Close submissions

README.md

@@ -11,13 +11,26 @@ Before you begin, you need to install the following tools:
 
 ## Development Quickstart
 
-1. Install dependencies
+### 0. Set up environment variables
+
+For local development, in your `.env.local` add the following:
+
+```
+NEXT_PUBLIC_SUBMISSION_DEADLINE=YYYY-MM-DDTHH:MM:SS
+```
+
+Replace `YYYY-MM-DDTHH:MM:SS` with the actual deadline (e.g., "2024-03-31T23:59:59", deadline must be in UTC).
+This variable controls the visibility of the apply button and form submissions.
+
+> Note: For a PROD environment, you can set the deadline in the .env file or set the environment variable in your hosting provider.
+
+### 1. Install dependencies
 
 ```
 yarn install
 ```
 
-2. Spin up the Postgres database service + create database + seed
+### 2. Spin up the Postgres database service + create database + seed
 
 ```
 docker-compose up -d
@@ -27,7 +40,7 @@ yarn seed
 
 See more info about the database in the section below
 
-3. Start your NextJS app:
+### 3. Start your NextJS app:
 
 ```
 yarn start

packages/nextjs/.env.example

@@ -11,3 +11,4 @@
 # More info: https://nextjs.org/docs/pages/building-your-application/configuring/environment-variables
 NEXT_PUBLIC_ALCHEMY_API_KEY=
 NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID=
+NEXT_PUBLIC_SUBMISSION_DEADLINE=

packages/nextjs/app/api/submissions/route.ts

@@ -26,6 +26,11 @@ export type CreateNewSubmissionBody = SubmissionInsert & { signature: `0x${strin
 
 export async function POST(req: Request) {
   try {
+    const submissionDeadline = new Date(process.env.NEXT_PUBLIC_SUBMISSION_DEADLINE || "");
+    if (isNaN(submissionDeadline.getTime()) || new Date() > submissionDeadline) {
+      return NextResponse.json({ error: "Submissions are closed" }, { status: 403 });
+    }
+
     const { title, description, telegram, linkToRepository, linkToVideo, feedback, signature, builder } =
       (await req.json()) as CreateNewSubmissionBody;
 

packages/nextjs/app/submit/_component/SubmitButton.tsx

@@ -4,17 +4,23 @@ import { useFormStatus } from "react-dom";
 import { useAccount } from "wagmi";
 import { RainbowKitCustomConnectButton } from "~~/components/scaffold-eth";
 
-// To use useFormStatus we need to make sure button is child of form
 const SubmitButton = () => {
   const { pending } = useFormStatus();
   const { isConnected } = useAccount();
 
+  const submissionDeadline = new Date(process.env.NEXT_PUBLIC_SUBMISSION_DEADLINE || "");
+  const isSubmissionClosed = isNaN(submissionDeadline.getTime()) || Date.now() > submissionDeadline.getTime();
+
   return (
     <div
-      className={`items-center flex flex-col ${!isConnected && "tooltip tooltip-bottom"}`}
-      data-tip={`${!isConnected ? "Please connect your wallet" : ""}`}
+      className={`items-center flex flex-col ${!isConnected && !isSubmissionClosed && "tooltip tooltip-bottom"}`}
+      data-tip={`${!isConnected && !isSubmissionClosed ? "Please connect your wallet" : ""}`}
     >
-      {isConnected ? (
+      {isSubmissionClosed ? (
+        <button className="btn border border-black px-6 text-lg h-10 min-h-10 font-medium" disabled>
+          Submissions Closed
+        </button>
+      ) : isConnected ? (
         <button
           className="btn border border-black px-6 text-lg h-10 min-h-10 font-medium"
           disabled={pending}

packages/nextjs/components/extensions-hackathon/StickySubmissionInfo.tsx

@@ -3,6 +3,8 @@ import Link from "next/link";
 
 export const StickySubmissionInfo = () => {
   const [isVisible, setIsVisible] = useState(true);
+  const submissionDeadline = new Date(process.env.NEXT_PUBLIC_SUBMISSION_DEADLINE || "");
+  const isSubmissionClosed = isNaN(submissionDeadline.getTime()) || new Date() > submissionDeadline;
 
   if (!isVisible) {
     return (
@@ -26,16 +28,18 @@ export const StickySubmissionInfo = () => {
         ✕
       </button>
       <h2 className="text-2xl underline mb-0 md:mb-4 2xl:text-3xl 2xl:mb-6">
-        Submissions <br className="hidden md:inline" /> open
+        {isSubmissionClosed ? "Submissions closed" : "Submissions open"}
       </h2>
       <p className="md:mb-10 mt-2 2xl:text-xl 2xl:mb-12 2xl:mt-4">AUG 20 - SEP 2</p>
       <div className="flex md:block space-x-2 2xl:space-x-4">
-        <Link
-          href="/submit"
-          className="bg-[#B7EBEC] py-2 px-2 sm:px-4 border border-1 border-black text-center flex-1 2xl:py-3 2xl:px-6 text-sm sm:text-base 2xl:text-xl"
-        >
-          Apply
-        </Link>
+        {!isSubmissionClosed && (
+          <Link
+            href="/submit"
+            className="bg-[#B7EBEC] py-2 px-2 sm:px-4 border border-1 border-black text-center flex-1 2xl:py-3 2xl:px-6 text-sm sm:text-base 2xl:text-xl"
+          >
+            Apply
+          </Link>
+        )}
         <a
           href="https://t.me/+jgKFHjb9B_cyNmMx"
           target="_blank"