From 72416146133b4365e5fa7a15c72fec090274438e Mon Sep 17 00:00:00 2001 From: Abh1noob Date: Mon, 11 Mar 2024 01:04:30 +0530 Subject: [PATCH] feat: bigger fatter prrerr --- .../src/app/edit-idea/edit-idea-form.tsx | 56 ++--- .../app/edit-project/edit-subject-form.tsx | 57 ++--- .../src/app/forgot/forgot-pass-form.tsx | 96 +++----- .../src/app/login/login-form.tsx | 6 +- devsoc24-portal-fe/src/app/page.tsx | 2 +- .../src/app/reset/reset-form.tsx | 127 +++-------- .../src/app/signup/signup-form.tsx | 83 +++---- .../src/app/signup/verify/verify-form.tsx | 207 +++++------------- .../src/app/submit-idea/submit-idea-form.tsx | 63 ++---- .../submit-project/submit-project-form.tsx | 46 ++-- .../src/components/ToastContainer.tsx | 9 +- .../src/components/forms/create-team-form.tsx | 89 ++------ .../src/components/forms/external-form.tsx | 81 ++----- .../src/components/forms/join-team-form.tsx | 107 +++------ .../src/components/forms/vitian-form.tsx | 98 ++------- 15 files changed, 326 insertions(+), 801 deletions(-) diff --git a/devsoc24-portal-fe/src/app/edit-idea/edit-idea-form.tsx b/devsoc24-portal-fe/src/app/edit-idea/edit-idea-form.tsx index 16bbb27..bb6d949 100644 --- a/devsoc24-portal-fe/src/app/edit-idea/edit-idea-form.tsx +++ b/devsoc24-portal-fe/src/app/edit-idea/edit-idea-form.tsx @@ -13,7 +13,7 @@ import { Input } from "@/components/ui/input"; import { Textarea } from "@/components/ui/textarea"; import { Button } from "@/components/ui/button"; import { ideaSchema } from "@/schemas/idea"; -import toast, { Toaster } from 'react-hot-toast'; +import toast, { Toaster } from "react-hot-toast"; import axios from "axios"; import { useRouter } from "next/navigation"; @@ -33,7 +33,7 @@ interface SubmitProjectResponse { data: unknown; } -interface GetIdea{ +interface GetIdea { data: FormValues; message: string; status: string; @@ -42,19 +42,23 @@ interface GetIdea{ import send from "@/assets/images/Send.svg"; import Image from "next/image"; import { useEffect } from "react"; +import ToastContainer from "@/components/ToastContainer"; const tracks = ["Track 1", "Track 2", "Track 3"]; export default function EditIdeaForm() { useEffect(() => { async function getIdeaSubmission() { try { - const res = await axios.get(`${process.env.NEXT_PUBLIC_API_URL}/idea`, { - withCredentials: true, - }); + const res = await axios.get( + `${process.env.NEXT_PUBLIC_API_URL}/idea`, + { + withCredentials: true, + }, + ); console.log(res.data.data); form.reset(res.data.data); } catch (error) { - console.log("Error getting idea submission:", error) + console.log("Error getting idea submission:", error); } } void getIdeaSubmission(); @@ -74,9 +78,7 @@ export default function EditIdeaForm() { }); async function onSubmit(data: FormValues) { - try { - console.log(data); - const toastId = toast.loading("Idea Submitted", { autoClose: false }); + const handleSubmit = async () => { const res = await axios.patch( `${process.env.NEXT_PUBLIC_API_URL}/idea/update`, data, @@ -84,40 +86,18 @@ export default function EditIdeaForm() { withCredentials: true, }, ); + }; - if (res.data.status === "success") { - toast.update(toastId, { - render: ( -
-

Idea Submitted

-
- ), - type: "success", - isLoading: false, - autoClose: 2000, - }); - } else { - toast.update(toastId, { - render: ( -
-

Failed to submit idea

-

Please try again.

-
- ), - type: "error", - isLoading: false, - autoClose: 2000, - }); - } - } catch (error) { - console.error("Error submitting idea:", error); - toast.error("Failed to submit idea"); - } + void toast.promise(handleSubmit(), { + loading: `Loading`, + success: `Idea Submitted`, + error: `Something went wrong`, + }); } return ( <> - +
diff --git a/devsoc24-portal-fe/src/app/edit-project/edit-subject-form.tsx b/devsoc24-portal-fe/src/app/edit-project/edit-subject-form.tsx index 3ee0943..470c123 100644 --- a/devsoc24-portal-fe/src/app/edit-project/edit-subject-form.tsx +++ b/devsoc24-portal-fe/src/app/edit-project/edit-subject-form.tsx @@ -13,7 +13,7 @@ import { Input } from "@/components/ui/input"; import { Textarea } from "@/components/ui/textarea"; import { Button } from "@/components/ui/button"; import { ideaSchema } from "@/schemas/idea"; -import toast, { Toaster } from 'react-hot-toast'; +import toast, { Toaster } from "react-hot-toast"; import axios from "axios"; import { useRouter } from "next/navigation"; @@ -33,7 +33,7 @@ interface SubmitProjectResponse { data: unknown; } -interface GetIdea{ +interface GetIdea { data: FormValues; message: string; status: string; @@ -42,19 +42,23 @@ interface GetIdea{ import send from "@/assets/images/Send.svg"; import Image from "next/image"; import { useEffect } from "react"; +import ToastContainer from "@/components/ToastContainer"; const tracks = ["Track 1", "Track 2", "Track 3"]; export default function EditProjectForm() { useEffect(() => { async function getIdeaSubmission() { try { - const res = await axios.get(`${process.env.NEXT_PUBLIC_API_URL}/project`, { - withCredentials: true, - }); + const res = await axios.get( + `${process.env.NEXT_PUBLIC_API_URL}/project`, + { + withCredentials: true, + }, + ); console.log(res.data.data); form.reset(res.data.data); } catch (error) { - console.log("Error getting idea submission:", error) + console.log("Error getting idea submission:", error); } } void getIdeaSubmission(); @@ -74,9 +78,7 @@ export default function EditProjectForm() { }); async function onSubmit(data: FormValues) { - try { - console.log(data); - const toastId = toast.loading("Project Submitted", { autoClose: false }); + const handleSubmit = async () => { const res = await axios.patch( `${process.env.NEXT_PUBLIC_API_URL}/project/update`, data, @@ -84,40 +86,17 @@ export default function EditProjectForm() { withCredentials: true, }, ); - - if (res.data.status === "success") { - toast.update(toastId, { - render: ( -
-

Project Submitted

-
- ), - type: "success", - isLoading: false, - autoClose: 2000, - }); - } else { - toast.update(toastId, { - render: ( -
-

Failed to submit project

-

Please try again.

-
- ), - type: "error", - isLoading: false, - autoClose: 2000, - }); - } - } catch (error) { - console.error("Error submitting idea:", error); - toast.error("Failed to submit idea"); - } + }; + void toast.promise(handleSubmit(), { + loading: "Loading...", + success: `Project Submitted Successfully`, + error: `Something went wrong`, + }); } return ( <> - +
diff --git a/devsoc24-portal-fe/src/app/forgot/forgot-pass-form.tsx b/devsoc24-portal-fe/src/app/forgot/forgot-pass-form.tsx index d2037a7..8f091a0 100644 --- a/devsoc24-portal-fe/src/app/forgot/forgot-pass-form.tsx +++ b/devsoc24-portal-fe/src/app/forgot/forgot-pass-form.tsx @@ -11,7 +11,7 @@ import { } from "@/components/ui/form"; import { Input } from "@/components/ui/input"; import { Button } from "@/components/ui/button"; -import toast, { Toaster } from 'react-hot-toast'; +import toast, { Toaster } from "react-hot-toast"; import { useRouter } from "next/navigation"; import { MailIcon } from "lucide-react"; import Link from "next/link"; @@ -35,75 +35,41 @@ export default function ForgotForm() { async function onSubmit(form: ForgotFormValues) { console.log(form); - // const toastId = toast.loading("Sending...", { autoClose: false }); - try { + const handleSubmit = async () => { await axios.post( `${process.env.NEXT_PUBLIC_API_URL}/reset-password`, { email: form.email }, + { + withCredentials: true, + }, ); - // toast.update(toastId, { - // render: ( - //
- //

OTP sent successfully!

- //

Redirecting...

- //
- // ), - // type: "success", - // isLoading: false, - // autoClose: 2000, - // }); - setTimeout(() => { - void router.push("/reset?email=" + form.email); - }, 1500); - } catch (err) { - console.log(err); - if (axios.isAxiosError(err)) { - const error = err as AxiosError; - if (error.response?.status === 404) { - // toast.update(toastId, { - // render: ( - //
- //

Account not found!

- //

Please signup.

- //
- // ), - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - } else if (error.response?.status === 403) { - // toast.update(toastId, { - // render: ( - //
- //

Email not verified!

- //

Please verify your email.

- //
- // ), - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - setTimeout(() => { - void router.push("/signup/verify?email=" + form.email); - }, 1500); - } else if (error.response?.status === 400) { - // toast.update(toastId, { - // render: , - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); + }; + void toast.promise(handleSubmit(), { + loading: "Loading...", + success: (temp) => { + setTimeout(() => { + void router.push("/reset?email=" + form.email); + }, 1500); + return `OTP sent successfully!\nRedirecting...`; + }, + error: (err: AxiosError) => { + switch (err.response?.status) { + case 404: + return `Account Not Found`; + case 409: + return `Incorrect Credentials`; + case 403: + setTimeout(() => { + void router.push("/signup/verify?email=" + form.email); + }, 1500); + return `Email Not Verified`; + case 400: + return `Please check your input and try again`; + default: + return `Something went wrong`; } - return; - } - // toast.update(toastId, { - // render: , - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - return; - } + }, + }); } return ( diff --git a/devsoc24-portal-fe/src/app/login/login-form.tsx b/devsoc24-portal-fe/src/app/login/login-form.tsx index d5d49f3..4df388c 100644 --- a/devsoc24-portal-fe/src/app/login/login-form.tsx +++ b/devsoc24-portal-fe/src/app/login/login-form.tsx @@ -47,13 +47,13 @@ export default function LoginForm() { ); }; - toast.promise(submitForm(), { - loading: "Logging In", + void toast.promise(submitForm(), { + loading: "Loading...", success: (temp) => { void router.push("/"); return `Logged In`; }, - error: (err) => { + error: (err: AxiosError) => { switch (err.response?.status) { case 404: return `Account Not Found`; diff --git a/devsoc24-portal-fe/src/app/page.tsx b/devsoc24-portal-fe/src/app/page.tsx index de87471..7af5828 100644 --- a/devsoc24-portal-fe/src/app/page.tsx +++ b/devsoc24-portal-fe/src/app/page.tsx @@ -88,7 +88,7 @@ export default function HomePage() { }; const handleLogout = async () => { - toast.promise(logout(), { + void toast.promise(logout(), { loading: "Logging Out...", success: "Logged Out", error: "Something went wrong", diff --git a/devsoc24-portal-fe/src/app/reset/reset-form.tsx b/devsoc24-portal-fe/src/app/reset/reset-form.tsx index e1af6dd..f77e5f7 100644 --- a/devsoc24-portal-fe/src/app/reset/reset-form.tsx +++ b/devsoc24-portal-fe/src/app/reset/reset-form.tsx @@ -13,14 +13,9 @@ import { Input } from "@/components/ui/input"; import { useState } from "react"; import { Button } from "@/components/ui/button"; import { useRouter, useSearchParams } from "next/navigation"; -import { - EyeIcon, - EyeOffIcon, - KeyRoundIcon, - LockKeyhole, -} from "lucide-react"; +import { EyeIcon, EyeOffIcon, KeyRoundIcon, LockKeyhole } from "lucide-react"; import Link from "next/link"; -import toast, { Toaster } from 'react-hot-toast'; +import toast, { Toaster } from "react-hot-toast"; import axios, { type AxiosError } from "axios"; import { type APIResponse } from "@/schemas/api"; import { BadRequest, ServerError } from "@/components/toast"; @@ -48,8 +43,7 @@ export default function ResetForm() { async function onSubmit(form: ResetFormValues) { console.log(form); // const toastId = toast.loading("Reseting...", { autoClose: false }); - - try { + const handleSubmit = async () => { await axios.patch( `${process.env.NEXT_PUBLIC_API_URL}/reset-password`, { @@ -61,94 +55,35 @@ export default function ResetForm() { withCredentials: true, }, ); - // toast.update(toastId, { - // render: ( - //
- //

Password reset successfully!

- //

Please login with your new password.

- //
- // ), - // type: "success", - // isLoading: false, - // autoClose: 2000, - // }); - - setTimeout(() => { - void router.push("/login"); - }, 1500); - } catch (err) { - console.log(err); - if (axios.isAxiosError(err)) { - const error = err as AxiosError; - if (error.response?.status === 409) { - // toast.update(toastId, { - // render: ( - //
- //

Incorrect password!

- //

Please try again.

- //
- // ), - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - } else if (error.response?.status === 404) { - // toast.update(toastId, { - // render: ( - //
- //

Account not found!

- //

Please signup.

- //
- // ), - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - } else if (error.response?.status === 403) { - // toast.update(toastId, { - // render: ( - //
- //

OTP expired!

- //

Please request a new OTP.

- //
- // ), - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - setTimeout(() => { - void router.push("/reset"); - }, 1500); - } else if (error.response?.status === 401) { - // toast.update(toastId, { - // render: ( - //
- //

Invalid OTP!

- //

Please try again.

- //
- // ), - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - } else if (error.response?.status === 400) { - // toast.update(toastId, { - // render: , - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); + }; + void toast.promise(handleSubmit(), { + loading: "Loading...", + success: (temp) => { + setTimeout(() => { + void router.push("/login"); + }, 1500); + return `Password reset successfully!`; + }, + error: (err: AxiosError) => { + switch (err.response?.status) { + case 404: + return `Account Not Found`; + case 409: + return `Incorrect Credentials`; + case 401: + return `Invalid OTP!`; + case 403: + setTimeout(() => { + void router.push("/reset"); + }, 1500); + return `OTP expired\nPlease request a new OTP`; + case 400: + return `Please check your input and try again`; + default: + return `Something went wrong`; } - return; - } - // toast.update(toastId, { - // render: , - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - return; - } + }, + }); } return ( diff --git a/devsoc24-portal-fe/src/app/signup/signup-form.tsx b/devsoc24-portal-fe/src/app/signup/signup-form.tsx index ece0ab2..6215e79 100644 --- a/devsoc24-portal-fe/src/app/signup/signup-form.tsx +++ b/devsoc24-portal-fe/src/app/signup/signup-form.tsx @@ -14,11 +14,12 @@ import { useState } from "react"; import { Button } from "@/components/ui/button"; import { EyeIcon, EyeOffIcon, LockKeyholeIcon, MailIcon } from "lucide-react"; import Link from "next/link"; -import { toast, ToastContainer } from "react-toastify"; +import toast, { Toaster } from "react-hot-toast"; import { type APIResponse } from "@/schemas/api"; import axios, { type AxiosError } from "axios"; import { BadRequest, ServerError } from "@/components/toast"; import { useRouter } from "next/navigation"; +import ToastContainer from "@/components/ToastContainer"; type SignupFormValues = z.infer; @@ -38,9 +39,7 @@ export default function SignupForm() { }); async function onSubmit(formVal: SignupFormValues) { - const toastId = toast.loading("Creating Account...", { autoClose: false }); - - try { + const handleSubmit = async () => { await axios.post( `${process.env.NEXT_PUBLIC_API_URL}/signup`, { @@ -51,58 +50,32 @@ export default function SignupForm() { withCredentials: true, }, ); - toast.update(toastId, { - render: ( -
-

Account Created Successfully!

-

Please verify your email.

-
- ), - type: "success", - isLoading: false, - autoClose: 2000, - }); - setTimeout(() => { - void router.push("./signup/verify?email=" + formVal.email); - }, 1500); - return; - } catch (err) { - console.log(err); - if (axios.isAxiosError(err)) { - const error = err as AxiosError; - if (error.response?.status === 409) { - toast.update(toastId, { - render: ( -
-

Account already exists!

-

Please login.

-
- ), - type: "error", - isLoading: false, - autoClose: 2000, - }); - setTimeout(() => { - void router.push("./login"); - }, 1500); - } else if (error.response?.status === 400) { - toast.update(toastId, { - render: , - type: "error", - isLoading: false, - autoClose: 2000, - }); + }; + + void toast.promise(handleSubmit(), { + loading: "Loading...", + success: (temp) => { + setTimeout(() => { + void router.push("./signup/verify?email=" + formVal.email); + }, 1500); + return `Account Created Successfully!\nPlease verify your email.`; + }, + error: (err: AxiosError) => { + switch (err.response?.status) { + case 404: + return `Account Not Found`; + case 409: + setTimeout(() => { + void router.push("/login"); + }, 1500); + return `Account already exists!`; + case 400: + return `Please check your input and try again`; + default: + return `Something went wrong`; } - return; - } - toast.update(toastId, { - render: , - type: "error", - isLoading: false, - autoClose: 2000, - }); - return; - } + }, + }); } return ( diff --git a/devsoc24-portal-fe/src/app/signup/verify/verify-form.tsx b/devsoc24-portal-fe/src/app/signup/verify/verify-form.tsx index dc15bd2..1c0fd8c 100644 --- a/devsoc24-portal-fe/src/app/signup/verify/verify-form.tsx +++ b/devsoc24-portal-fe/src/app/signup/verify/verify-form.tsx @@ -16,7 +16,7 @@ import { Button } from "@/components/ui/button"; import { useRouter, useSearchParams } from "next/navigation"; import { KeyRoundIcon } from "lucide-react"; import { useEffect, useState } from "react"; -import toast, { Toaster } from 'react-hot-toast'; +import toast, { Toaster } from "react-hot-toast"; import axios, { type AxiosError } from "axios"; import { type APIResponse } from "@/schemas/api"; import { BadRequest, ServerError } from "@/components/toast"; @@ -41,11 +41,7 @@ export default function ForgotForm() { async function onSubmit(data: VerifyFormValues) { console.log(data); - // const toastId = toast.loading("Verifying OTP...", { - // autoClose: false, - // }); - - try { + const handleSubmit = async () => { const res = await axios.post( `${process.env.NEXT_PUBLIC_API_URL}/verify`, { @@ -56,98 +52,36 @@ export default function ForgotForm() { withCredentials: true, }, ); - // toast.update(toastId, { - // render: ( - //
- //

- // {res.status === 200 - // ? "Account verified successfully!" - // : "User already verified!"} - //

- //

- // {res.status === 200 - // ? "Please complete profile." - // : "Please login."} - //

- //
- // ), - // type: "success", - // isLoading: false, - // autoClose: 2000, - // }); - setTimeout(() => { - void router.push("/login"); - }, 1500); - return; - } catch (err) { - console.log(err); - if (axios.isAxiosError(err)) { - const error = err as AxiosError; - if (error.response?.status === 404) { - // toast.update(toastId, { - // render: ( - //
- //

No account found!

- //

Please create an account.

- //
- // ), - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - setTimeout(() => { - void router.push("/signup"); - }, 1500); - } else if (error.response?.status === 401) { - // toast.update(toastId, { - // render: ( - //
- //

Invalid OTP!

- //

Please enter a valid OTP.

- //
- // ), - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - } else if (error.response?.status === 403) { - // toast.update(toastId, { - // render: ( - //
- //

OTP Expired!

- //

Please resend OTP.

- //
- // ), - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - } else if (error.response?.status === 400) { - // toast.update(toastId, { - // render: , - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); + }; + void toast.promise(handleSubmit(), { + loading: "Loading...", + success: (temp) => { + setTimeout(() => { + void router.push("/login"); + }, 1500); + return `Success`; + }, + error: (err: AxiosError) => { + switch (err.response?.status) { + case 404: + return `Account Not Found`; + case 401: + return `Invalid OTP!\nPlease enter a valid OTP`; + case 409: + return `Incorrect Credentials`; + case 403: + return `OTP Expired!\nPlease resend OTP`; + case 400: + return `Please check your input and try again`; + default: + return `Something went wrong`; } - return; - } - // toast.update(toastId, { - // render: , - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - return; - } + }, + }); } const resendOTP = async () => { - // const toastId = toast.loading("Sending OTP...", { - // autoClose: false, - // }); - - try { + const handleResentOTP = async () => { await axios.post( `${process.env.NEXT_PUBLIC_API_URL}/resend`, { @@ -158,70 +92,29 @@ export default function ForgotForm() { withCredentials: true, }, ); - // toast.update(toastId, { - // render: ( - //
- //

OTP sent successfully!

- //

Please check your email for the OTP.

- //
- // ), - // type: "success", - // isLoading: false, - // autoClose: 2000, - // }); - return; - } catch (err) { - console.log(err); - if (axios.isAxiosError(err)) { - const error = err as AxiosError; - if (error.response?.status === 404) { - // toast.update(toastId, { - // render: ( - //
- //

No account found!

- //

Please create an account.

- //
- // ), - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - setTimeout(() => { - void router.push("./signup"); - }, 1500); - } else if (error.response?.status === 403) { - // toast.update(toastId, { - // render: ( - //
- //

User is already verified!

- //

Please login.

- //
- // ), - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - setTimeout(() => { - void router.push("./login"); - }, 1500); - } else if (error.response?.status === 400) { - // toast.update(toastId, { - // render: , - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); + }; + + void toast.promise(handleResentOTP(), { + loading: "Loading...", + success: (temp) => { + void router.push("/"); + return `OTP Sent`; + }, + error: (err: AxiosError) => { + switch (err.response?.status) { + case 404: + return `Account Not Found`; + case 409: + return `Incorrect Credentials`; + case 403: + return `User Already Verified`; + case 400: + return `Please check your input and try again`; + default: + return `Something went wrong`; } - return; - } - // toast.update(toastId, { - // render: , - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - return; - } + }, + }); }; useEffect(() => { diff --git a/devsoc24-portal-fe/src/app/submit-idea/submit-idea-form.tsx b/devsoc24-portal-fe/src/app/submit-idea/submit-idea-form.tsx index 79b8807..fe68dbf 100644 --- a/devsoc24-portal-fe/src/app/submit-idea/submit-idea-form.tsx +++ b/devsoc24-portal-fe/src/app/submit-idea/submit-idea-form.tsx @@ -13,9 +13,9 @@ import { Input } from "@/components/ui/input"; import { Textarea } from "@/components/ui/textarea"; import { Button } from "@/components/ui/button"; import { ideaSchema } from "@/schemas/idea"; -import toast, { Toaster } from 'react-hot-toast'; +import toast, { Toaster } from "react-hot-toast"; -import axios from "axios"; +import axios, { AxiosError } from "axios"; import { useRouter } from "next/navigation"; interface FormValues { @@ -35,6 +35,7 @@ interface SubmitProjectResponse { import send from "@/assets/images/Send.svg"; import Image from "next/image"; +import ToastContainer from "@/components/ToastContainer"; const tracks = ["Track 1", "Track 2", "Track 3"]; export default function SubmitIdeaForm() { @@ -53,9 +54,7 @@ export default function SubmitIdeaForm() { }); async function onSubmit(data: FormValues) { - try { - console.log(data); - const toastId = toast.loading("Idea Submitted", { autoClose: false }); + const handleSubmit = async () => { const res = await axios.post( `${process.env.NEXT_PUBLIC_API_URL}/idea/create`, data, @@ -63,40 +62,26 @@ export default function SubmitIdeaForm() { withCredentials: true, }, ); - - if (res.data.status === "success") { - toast.update(toastId, { - render: ( -
-

Idea Submitted

-

Redirecting...

-
- ), - type: "success", - isLoading: false, - autoClose: 2000, - }); - - setTimeout(() => { - router.push("/"); - }, 2000); - } else { - toast.update(toastId, { - render: ( -
-

Failed to submit idea

-

Please try again.

-
- ), - type: "error", - isLoading: false, - autoClose: 2000, - }); - } - } catch (error) { - console.error("Error submitting idea:", error); - toast.error("Failed to submit idea"); - } + }; + void toast.promise(handleSubmit(), { + loading: "Loading...", + success: (temp) => { + void router.push("/"); + return `Logged In`; + }, + error: (err: AxiosError) => { + switch (err.response?.status) { + case 404: + return `Account Not Found`; + case 409: + return `Incorrect Credentials`; + case 400: + return `Please check your input and try again`; + default: + return `Something went wrong`; + } + }, + }); } return ( diff --git a/devsoc24-portal-fe/src/app/submit-project/submit-project-form.tsx b/devsoc24-portal-fe/src/app/submit-project/submit-project-form.tsx index bbb7c7e..883c9b4 100644 --- a/devsoc24-portal-fe/src/app/submit-project/submit-project-form.tsx +++ b/devsoc24-portal-fe/src/app/submit-project/submit-project-form.tsx @@ -15,10 +15,11 @@ import { Button } from "@/components/ui/button"; import { ideaSchema } from "@/schemas/idea"; import send from "@/assets/images/Send.svg"; import Image from "next/image"; -import toast, { Toaster } from 'react-hot-toast'; +import toast, { Toaster } from "react-hot-toast"; -import axios from "axios"; +import axios, { AxiosError } from "axios"; import { useRouter } from "next/navigation"; +import ToastContainer from "@/components/ToastContainer"; interface FormValues { title: string; @@ -53,9 +54,7 @@ export default function SubmitProjectForm() { }); async function onSubmit(data: FormValues) { - try { - console.log(data); - const toastId = toast.loading("Project Submitted", { autoClose: 3 }); + const handleSubmit = async () => { const res = await axios.post( `${process.env.NEXT_PUBLIC_API_URL}/project/create`, data, @@ -63,28 +62,21 @@ export default function SubmitProjectForm() { withCredentials: true, }, ); - - if (res.data.status = "success") { - toast.update(toastId, { - render: "Project Submitted Successfully", - type: "success", - autoClose: 2000, - }); - - setTimeout(() => { - router.push("/"); - }, 2000); - } else { - toast.update(toastId, { - render: "Failed to submit project", - type: "error", - autoClose: 2000, - }); - } - } catch (error) { - console.error("Error submitting project:", error); - toast.error("Failed to submit project"); - } + }; + void toast.promise(handleSubmit(), { + loading: "Loading...", + success: (temp) => { + return `Project Submitted Successfully`; + }, + error: (err: AxiosError) => { + switch (err.response?.status) { + case 404: + return `Account Not Found`; + default: + return `Failed to submit project`; + } + }, + }); } return ( diff --git a/devsoc24-portal-fe/src/components/ToastContainer.tsx b/devsoc24-portal-fe/src/components/ToastContainer.tsx index 6e8a001..0ed3759 100644 --- a/devsoc24-portal-fe/src/components/ToastContainer.tsx +++ b/devsoc24-portal-fe/src/components/ToastContainer.tsx @@ -1,5 +1,5 @@ import React from "react"; -import toast, { Toaster } from "react-hot-toast"; +import { Toaster } from "react-hot-toast"; const ToastContainer = () => { return ( @@ -11,12 +11,11 @@ const ToastContainer = () => { containerClassName="" containerStyle={{}} toastOptions={{ - // Define default options className: "", - duration: 5000, + duration: 3000, style: { - background: "#363636", - color: "#fff", + background: "#FFFFFF", + color: "#000000", }, }} /> diff --git a/devsoc24-portal-fe/src/components/forms/create-team-form.tsx b/devsoc24-portal-fe/src/components/forms/create-team-form.tsx index 522def8..e67fc33 100644 --- a/devsoc24-portal-fe/src/components/forms/create-team-form.tsx +++ b/devsoc24-portal-fe/src/components/forms/create-team-form.tsx @@ -15,11 +15,12 @@ import { } from "@/components/ui/form"; import { Button } from "@/components/ui/button"; import { Input } from "@/components/ui/input"; -import { toast, ToastContainer } from "react-toastify"; +import toast, { Toaster } from "react-hot-toast"; import axios, { type AxiosError } from "axios"; import { type APIResponse } from "@/schemas/api"; import { useRouter } from "next/navigation"; import { BadRequest, ServerError } from "@/components/toast"; +import ToastContainer from "../ToastContainer"; type CreateTeamFormValues = z.infer; @@ -34,9 +35,7 @@ export default function CreateTeamForm() { }); async function onSubmit(data: CreateTeamFormValues) { - const toastId = toast.loading("Creating...", { autoClose: false }); - console.log(data); - try { + const handleSubmit = async () => { await axios.post( `${process.env.NEXT_PUBLIC_API_URL}/team/create`, { name: data.teamName }, @@ -44,69 +43,29 @@ export default function CreateTeamForm() { withCredentials: true, }, ); - toast.update(toastId, { - render: ( -
-

Success!

-

Team created successfully.

-
- ), - type: "success", - isLoading: false, - autoClose: 2000, - }); - setTimeout(() => { + }; + + void toast.promise(handleSubmit(), { + loading: "Loading...", + success: (temp) => { void router.push("/"); - }, 1500); - return; - } catch (err) { - console.log(err); - if (axios.isAxiosError(err)) { - const error = err as AxiosError; - if (error.response?.status === 400) { - toast.update(toastId, { - render: , - type: "error", - isLoading: false, - autoClose: 2000, - }); - return; - } else if (error.response?.status === 417) { - toast.update(toastId, { - render: ( -
-

User is already in a team!

-

Leave the team to create a new one.

-
- ), - type: "error", - isLoading: false, - autoClose: 2000, - }); - return; - } else if (error.response?.status === 409) { - toast.update(toastId, { - render: ( -
-

Team name already exists!

-

Please choose a different name for your team.

-
- ), - type: "error", - isLoading: false, - autoClose: 2000, - }); - return; + return `Team created successfully.`; + }, + error: (err: AxiosError) => { + switch (err.response?.status) { + case 404: + return `Account Not Found`; + case 417: + return `User is already in team`; + case 409: + return `Teamname already exists`; + case 400: + return `Please check your input and try again`; + default: + return `Something went wrong`; } - } - toast.update(toastId, { - render: , - type: "error", - isLoading: false, - autoClose: 2000, - }); - return; - } + }, + }); } return ( diff --git a/devsoc24-portal-fe/src/components/forms/external-form.tsx b/devsoc24-portal-fe/src/components/forms/external-form.tsx index 34952a8..25ddf04 100644 --- a/devsoc24-portal-fe/src/components/forms/external-form.tsx +++ b/devsoc24-portal-fe/src/components/forms/external-form.tsx @@ -23,7 +23,7 @@ import { } from "@/components/ui/form"; import { Button } from "@/components/ui/button"; import { Input } from "@/components/ui/input"; -import toast, { Toaster } from 'react-hot-toast'; +import toast, { Toaster } from "react-hot-toast"; import axios, { type AxiosError } from "axios"; import { type APIResponse } from "@/schemas/api"; import { BadRequest, ServerError } from "@/components/toast"; @@ -67,7 +67,7 @@ export default function ExternalForm({ }; console.log(updatedData); - try { + const handleSubmit = async () => { await axios.post( `${process.env.NEXT_PUBLIC_API_URL}/user/complete-profile`, updatedData, @@ -75,62 +75,29 @@ export default function ExternalForm({ withCredentials: true, }, ); - // toast.update(toastId, { - // render: ( - //
- //

Success!

- //

Account details saved successfully.

- //
- // ), - // type: "success", - // isLoading: false, - // autoClose: 2000, - // }); - setTimeout(() => setForm(2), 1500); - return; - } catch (err) { - console.log(err); - if (axios.isAxiosError(err)) { - const error = err as AxiosError; - if (error.response?.status === 400) { - // toast.update(toastId, { - // render: , - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - } else if (error.response?.status === 403) { - // toast.update(toastId, { - // render: ( - //
- //

Email not verified!

- //

Please verify your email.

- //
- // ), - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - } else if (error.response?.status === 404) { - // toast.update(toastId, { - // render: ( - //
- //

User not found!

- //

Please sign up.

- //
- // ), - // }); + }; + + void toast.promise(handleSubmit(), { + loading: "Loading...", + success: (temp) => { + setTimeout(() => setForm(2), 1500); + return `Logged In`; + }, + error: (err: AxiosError) => { + switch (err.response?.status) { + case 404: + return `Account Not Found`; + case 409: + return `Incorrect Credentials`; + case 403: + return `Email Not Verified`; + case 400: + return `Please check your input and try again`; + default: + return `Something went wrong`; } - return; - } - // toast.update(toastId, { - // render: , - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - return; - } + }, + }); } return ( <> diff --git a/devsoc24-portal-fe/src/components/forms/join-team-form.tsx b/devsoc24-portal-fe/src/components/forms/join-team-form.tsx index c162a48..83e0436 100644 --- a/devsoc24-portal-fe/src/components/forms/join-team-form.tsx +++ b/devsoc24-portal-fe/src/components/forms/join-team-form.tsx @@ -15,8 +15,8 @@ import { } from "@/components/ui/form"; import { Button } from "@/components/ui/button"; import { Input } from "@/components/ui/input"; -import axios, { type AxiosError } from "axios"; -import toast, { Toaster } from 'react-hot-toast'; +import axios, { Axios, type AxiosError } from "axios"; +import toast, { Toaster } from "react-hot-toast"; import { type APIResponse } from "@/schemas/api"; import { useRouter } from "next/navigation"; import { BadRequest, ServerError } from "@/components/toast"; @@ -35,12 +35,13 @@ export default function JoinTeamForm() { }); async function onSubmit(data: CreateTeamFormValues) { - // const toastId = toast.loading("Joining...", { autoClose: false }); console.log(data); - try { + const handleSubmit = async () => { await axios.post( `${process.env.NEXT_PUBLIC_API_URL}/refresh`, - {}, + { + nallaData: "", + }, { withCredentials: true, }, @@ -52,82 +53,30 @@ export default function JoinTeamForm() { withCredentials: true, }, ); - // toast.update(toastId, { - // render: ( - //
- //

Success!

- //

Team joined successfully.

- //
- // ), - // type: "success", - // isLoading: false, - // autoClose: 2000, - // }); - setTimeout(() => { + }; + void toast.promise(handleSubmit(), { + loading: "Loading...", + success: (temp) => { void router.push("/"); - }, 1500); - return; - } catch (err) { - console.log(err); - if (axios.isAxiosError(err)) { - const error = err as AxiosError; - if (error.response?.status === 400) { - // toast.update(toastId, { - // render: , - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - return; - } else if (error.response?.status === 417) { - // toast.update(toastId, { - // render: ( - //
- //

User is already in a team!

- //

Leave the team to create a new one.

- //
- // ), - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - return; - } else if (error.response?.status === 409) { - // toast.update(toastId, { - // render: ( - //
- //

Invalid team code!

- //

Please check the team code and try again.

- //
- // ), - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - return; - } else if (error.response?.status === 424) { - // toast.update(toastId, { - // render: ( - //
- //

Team is full!

- //

Try joining another team.

- //
- // ), - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - return; + return `Team joined successfully.`; + }, + error: (err: AxiosError) => { + switch (err.response?.status) { + case 404: + return `Account Not Found`; + case 417: + return `User Already in a team`; + case 409: + return `Invalid Team Code`; + case 424: + return `Team is full`; + case 400: + return `Please check your input and try again`; + default: + return `Something went wrong`; } - } - // toast.update(toastId, { - // render: , - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - return; - } + }, + }); } return ( diff --git a/devsoc24-portal-fe/src/components/forms/vitian-form.tsx b/devsoc24-portal-fe/src/components/forms/vitian-form.tsx index 029f34b..ed034da 100644 --- a/devsoc24-portal-fe/src/components/forms/vitian-form.tsx +++ b/devsoc24-portal-fe/src/components/forms/vitian-form.tsx @@ -23,7 +23,7 @@ import { } from "@/components/ui/form"; import { Button } from "@/components/ui/button"; import { Input } from "@/components/ui/input"; -import toast, { Toaster } from 'react-hot-toast'; +import toast, { Toaster } from "react-hot-toast"; import { useSearchParams } from "next/navigation"; import { BadRequest, ServerError } from "@/components/toast"; import axios, { type AxiosError } from "axios"; @@ -69,8 +69,7 @@ export default function VitianForm({ vit_email: data.vitEmail, }; console.log(updatedData); - - try { + const handleSubmit = async () => { await axios.post( `${process.env.NEXT_PUBLIC_API_URL}/user/complete-profile`, updatedData, @@ -78,79 +77,28 @@ export default function VitianForm({ withCredentials: true, }, ); - // toast.update(toastId, { - // render: ( - //
- //

Success!

- //

Account details saved successfully.

- //
- // ), - // type: "success", - // isLoading: false, - // autoClose: 2000, - // }); - setTimeout(() => setForm(2), 1500); - return; - } catch (err) { - console.log(err); - if (axios.isAxiosError(err)) { - const error = err as AxiosError; - if (error.response?.status === 400) { - // toast.update(toastId, { - // render: , - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - } else if (error.response?.status === 403) { - // toast.update(toastId, { - // render: ( - //
- //

Email not verified!

- //

Please verify your email.

- //
- // ), - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - } else if (error.response?.status === 404) { - // toast.update(toastId, { - // render: ( - //
- //

User not found!

- //

Please sign up.

- //
- // ), - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); + }; + void toast.promise(handleSubmit(), { + loading: "Loading...", + success: (temp) => { + setTimeout(() => setForm(2), 1500); + return `Success`; + }, + error: (err: AxiosError) => { + switch (err.response?.status) { + case 403: + return `Email not verified`; + case 404: + return `Account Not Found`; + case 409: + return `Incorrect Credentials`; + case 400: + return `Please check your input and try again`; + default: + return `Something went wrong`; } - return; - } - // toast.update(toastId, { - // render: , - // type: "error", - // isLoading: false, - // autoClose: 2000, - // }); - return; - } - - // toast.update(toastId, { - // render: - // res === 200 ? "Login successful!" : res !== 500 ? res : , - // type: res === 200 ? "success" : "error", - // isLoading: false, - // autoClose: 2000, - // }); - - // if (res === 200) { - // setTimeout(() => { - // void router.push("/overview"); - // }, 2000); - // } + }, + }); } return ( <>