From 9a20cc009d5bd22e2b1e41f6f44acefb5dec11fd Mon Sep 17 00:00:00 2001
From: Ojakoo <ilari.ojakorpi@gmail.com>
Date: Tue, 26 Sep 2023 13:51:11 +0300
Subject: [PATCH] quick fix #42

---
 src/i18n/locales/en/common.json         |  3 +++
 src/pages/signup/[id].tsx               | 15 +++++++++++++--
 src/views/SignUpPage/SignUpPageView.tsx |  4 +++-
 3 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/src/i18n/locales/en/common.json b/src/i18n/locales/en/common.json
index 33a5c2e..98584d4 100644
--- a/src/i18n/locales/en/common.json
+++ b/src/i18n/locales/en/common.json
@@ -53,6 +53,9 @@
   "Ilmoittautuminen sulkeutuu":
   "Signup closes at",
 
+  "Ilmoittautuminen onnistui!":
+  "Signup successful!",
+
   "Ilmoittauminen on umpeutunut!":
   "Signup has been closed!",
 
diff --git a/src/pages/signup/[id].tsx b/src/pages/signup/[id].tsx
index 8ce4f8f..15f4b6d 100644
--- a/src/pages/signup/[id].tsx
+++ b/src/pages/signup/[id].tsx
@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useState } from "react";
 import { NextPage, GetStaticProps, GetStaticPaths } from "next";
 import Head from "next/head";
 import { useRouter } from "next/router";
@@ -25,6 +25,8 @@ const SignUpPage: NextPage<InitialProps> = ({ initialForm }) => {
   const id = String(initialForm?.id ?? "");
   const URL = `${FORM_URL}${id}/`;
   const { data: signupForm, error } = useSWR<SignupForm>(URL, (url) => axios.get(url).then((res) => res.data), { fallbackData: initialForm });
+  const [isSending, setIsSending] = useState(false);
+  const [formSent, setFormSent] = useState(false);
 
   if (error) {
     console.error(error);
@@ -42,18 +44,26 @@ const SignUpPage: NextPage<InitialProps> = ({ initialForm }) => {
   }
 
   const onSubmit = async ({ formData }: ISubmitEvent<string>) => {
+    setIsSending(true);
+
     const payload: Signup = {
       signupForm_id: signupForm.id,
       answer: formData,
     };
 
+    if (isSending === true) {
+      toast.error("Sign-up form already submitted! No need to spam send. 😟");
+      return;
+    }
+
     try {
       await SignupApi.createSignup(payload);
       toast.success("Sign-up submitted successfully 😎");
-      mutate(URL);
+      setFormSent(true);
     } catch (err) {
       console.error(err);
       toast.error("Uh oh! Sign-up failed! 😟");
+      setIsSending(false);
     }
   };
 
@@ -68,6 +78,7 @@ const SignUpPage: NextPage<InitialProps> = ({ initialForm }) => {
           formData={{}}
           onChange={noop}
           onSubmit={onSubmit}
+          formSent={formSent}
         />
       </PageWrapper>
     </>
diff --git a/src/views/SignUpPage/SignUpPageView.tsx b/src/views/SignUpPage/SignUpPageView.tsx
index f8e7ec4..7a2588d 100644
--- a/src/views/SignUpPage/SignUpPageView.tsx
+++ b/src/views/SignUpPage/SignUpPageView.tsx
@@ -23,6 +23,7 @@ interface SignUpPageViewProps {
   formData: any;
   onChange: (e: IChangeEvent<unknown>, es?: ErrorSchema) => unknown;
   onSubmit: (e: ISubmitEvent<unknown>) => unknown;
+  formSent: boolean;
 }
 
 const StyledSection = styled(TextSection)`
@@ -59,6 +60,7 @@ const SignUpPageView: React.FC<SignUpPageViewProps> = ({
   formData,
   onChange,
   onSubmit,
+  formSent,
 }) => {
   const { i18n, t } = useTranslation();
   const startDate = new Date(signUpForm?.start_time);
@@ -136,7 +138,7 @@ const SignUpPageView: React.FC<SignUpPageViewProps> = ({
         </h1>
 
         <div>
-          {form}
+          { formSent ? <p>{`${t("Ilmoittautuminen onnistui!")}`}</p> : form }
         </div>
         {signups}
       </StyledSection>