Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

update apply-auth for 2025 #93

Merged
merged 2 commits into from
Jan 9, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
68 changes: 31 additions & 37 deletions src/app/(site)/apply/_components/apply-auth.tsx
Original file line number Diff line number Diff line change
@@ -1,52 +1,46 @@
"use client";

import React, { useState } from "react";
import React from "react";

interface ApplyAuthProps {
children?: React.ReactNode;
}

const ApplyAuth: React.FC<ApplyAuthProps> = ({ children }) => {
// Application from March 13rd to April 1st
// 2025 application opens from Feb 14th to Mar 24th
const openDateTs = "2025-02-14T00:00:00.000-07:00";
const applicationCloseDateTs = "2025-03-24T23:59:59.999-07:00";
const closeDateTs = "2025-04-13T23:59:59.999-07:00";

const options = { timeZone: "America/Los_Angeles" };
const openDate = new Date("2024-01-14T00:00:00.000-07:00").toLocaleString(
"en-US",
options
);
const closeDate = new Date("2024-02-13T23:59:59.999-07:00").toLocaleString(
"en-US",
options
);

const openDate = new Date(openDateTs).toLocaleString("en-US", options);
const closeDate = new Date(closeDateTs).toLocaleString("en-US", options);
const applicationCloseDate = new Date(
applicationCloseDateTs
).toLocaleDateString("en-US", options);

const now = new Date().toLocaleString("en-US", options);
const [applicationOpen, setOpen] = useState<boolean>(() => {
const currentDate = new Date();
const opening = new Date(openDate);
const closing = new Date(closeDate);
return currentDate >= opening && currentDate <= closing;
});
const applicationOpen =
new Date(now) >= new Date(openDate) &&
new Date(now) <= new Date(applicationCloseDate);

if (applicationOpen) {
return <>{children}</>;
}

return (
<>
{applicationOpen ? (
children
) : (
<div className="mt-10 flex flex-col items-center justify-center text-center text-lg font-semibold text-white md:text-[2.5rem]">
{new Date(now) < new Date(openDate) && (
<div className="flex flex-col items-center gap-12 text-center">
<p className="w-[80%]">
Application will open on January 12th, see you soon!.
</p>
<img
src="/assets/byecat.svg"
alt="bye cat"
className="w-[300px]"
/>
</div>
)}
{new Date(now) >= new Date(closeDate) && (
<p>Fullyhacks 2024 has ended, we&apos;ll see you next year 🐘.</p>
)}
<div className="mt-10 flex flex-col items-center justify-center text-center text-lg font-semibold text-white md:text-[2.5rem]">
{new Date(now) < new Date(openDate) ? (
<div className="flex flex-col items-center gap-12 text-center">
<p>Applications will open on Feb 14th, see you soon!</p>
</div>
) : new Date(now) >= new Date(closeDate) ? (
<p>Fullyhacks 2025 has ended, we&apos;ll see you next year 🐘.</p>
) : (
<p>Applications for FullyHacks 2025 have closed.</p>
)}
</>
</div>
);
};

Expand Down
109 changes: 30 additions & 79 deletions src/app/(site)/apply/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -26,86 +26,37 @@ export default async function ApplyPage() {
const { user, application } = await getApplicationData(session);

return (
<>
<section>
<Flower
width="w-24 md:w-32"
height="h-24 md:w-32"
left="left-5"
top="top-[12rem]"
noMotion={true}
flowerType={1}
/>

<Flower
width="w-36 md:w-52"
height="w-36 md:h-52"
left="left-8 md:left-10"
top="top-[30rem] md:top-[20rem]"
noMotion={true}
flowerType={3}
/>

<Flower
width="w-16 md:w-24"
height="w-16 md:h-24"
left="left-6 md:left-12"
top="top-[32rem] md:top-[28rem]"
noMotion={true}
flowerType={3}
/>

<Flower
width="w-16 md:w-24"
height="w-16 md:h-24"
left=""
right="right-[2rem] md:right-[4rem]"
top="top-[7rem]"
noMotion={true}
flowerType={2}
/>

<Flower
width="w-28 md:w-52"
height="w-28 md:h-52"
left=""
right="right-[3rem] md:right-[6rem]"
top="top-[12rem]"
noMotion={true}
flowerType={4}
/>

<AuthNavBar />
{application?.applied ? (
<>
<div className="mt-10 flex flex-col items-center justify-center text-center text-purple_main">
<p className="text-lg font-semibold md:text-xl">
You&apos;ve already submitted an application
<section>
<AuthNavBar />
{application?.applied ? (
<>
<div className="mt-10 flex flex-col items-center justify-center text-center text-purple_main">
<p className="text-lg font-semibold md:text-xl">
You&apos;ve already submitted an application
</p>
<Link href="/portal" className="purple-btn mt-10">
Go to User Portal
</Link>
</div>
</>
) : (
<ApplyAuth>
<div className="flex items-center justify-center">
<div className="z-10 mt-10 mb-32 flex w-[min(50rem,_90vw)] flex-col items-center rounded-lg border-8 border-blue_border_rgba bg-blue_rgba p-8 text-[#FF35EB] [box-shadow:_0_0_32px_#618AA8]">
<p className="text-lg font-semibold text-[#FF35EB] md:text-[3rem]">
MY APPLICATION
</p>
<Link href="/portal" className="purple-btn mt-10">
Go to User Portal
</Link>
</div>
</>
) : (
<ApplyAuth>
<div className="flex items-center justify-center">
<div className="z-10 mt-10 mb-32 flex w-[min(50rem,_90vw)] flex-col items-center rounded-lg border-8 border-blue_border_rgba bg-blue_rgba p-8 text-[#FF35EB] [box-shadow:_0_0_32px_#618AA8]">
<p className="text-lg font-semibold text-[#FF35EB] md:text-[3rem]">
MY APPLICATION
</p>
<p className="font-light text-white md:text-[1.5rem]">
Draft will be saved
</p>
<p className="mt-4 text-[1.25rem] font-semibold text-white">
*Application due by Saturday, February 10th*
</p>
<ApplicationForm url={user?.image} />
</div>
<p className="font-light text-white md:text-[1.5rem]">
Draft will be saved
</p>
<p className="mt-4 text-[1.25rem] font-semibold text-white">
*Application due by Saturday, February 10th*
</p>
<ApplicationForm url={user?.image} />
</div>
</ApplyAuth>
)}
</section>
</>
</div>
</ApplyAuth>
)}
</section>
);
}
Loading