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 65d0ba5..c513c6a 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
@@ -1,158 +1,274 @@
-import { Formik, Form, Field, ErrorMessage } from 'formik';
-import { Label } from "@/components/ui/label"
-import { Input } from '@/components/ui/input';
-import { Textarea } from "@/components/ui/textarea"
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useForm, Controller } from "react-hook-form";
+import { type z } from "zod";
 import {
-    Select,
-    SelectContent,
-    SelectItem,
-    SelectTrigger,
-    SelectValue,
-} from "@/components/ui/select"
-import { Button } from "@/components/ui/button"
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormMessage,
+} from "@/components/ui/form";
+import { Label } from "@/components/ui/label";
+import { Input } from "@/components/ui/input";
+import { Textarea } from "@/components/ui/textarea";
+import { Button } from "@/components/ui/button";
+import { ideaSchema } from "@/schemas/idea";
 
 interface FormValues {
-    projectName: string;
-    projectTrack: string;
-    description: string;
-    figmaLink: string;
-    githubLink: string;
-    otherLinks: string;
+  projectName: string;
+  projectTrack: string;
+  description: string;
+  figmaLink: string;
+  githubLink: string;
+  otherLinks: string;
 }
 
-import send from "@/assets/images/Send.svg"
-import Image from 'next/image';
-const tracks = ['Track 1', 'Track 2', 'Track 3'];
-
+import send from "@/assets/images/Send.svg";
+import Image from "next/image";
+const tracks = ["Track 1", "Track 2", "Track 3"];
 
 export default function EditIdeaForm() {
-    const initialValues: FormValues = {
-        projectName: '',
-        projectTrack: '',
-        description: '',
-        figmaLink: '',
-        githubLink: '',
-        otherLinks: ''
-    };
-    const onSubmit = (values: FormValues, { setSubmitting }: { setSubmitting: (isSubmitting: boolean) => void }) => {
-        setSubmitting(false);
-    };
-
-    return (
-
-        <Formik initialValues={initialValues} onSubmit={onSubmit}>
-            {({ isSubmitting }) => (
-                <Form className=''>
-                    <div className='flex justify-start gap-16 max-[931px]:gap-6 max-[931px]:flex-col'>
-                        <div className='w-96 max-[445px]:w-[87vw] flex flex-col gap-6'>
-                            <div>
-                                <div className="grid w-full max-w-sm items-center gap-4">
-                                    <Label htmlFor="project-name" className='text-[#0019FF]'>Project Name<span className='text-[#FF0000]'>*</span></Label>
-                                    <Input
-                                        type="text"
-                                        id="project-name"
-                                        placeholder="Shuttle tracker"
-                                        className=''
-                                        style={{ backgroundColor: 'white', height: '60px' }}
-
-                                    />
-                                </div>
-                                <ErrorMessage name="projectName" component="div" />
-                            </div>
-                            <div>
-                                <div className="grid w-full max-w-sm items-center gap-4">
-                                    <Label htmlFor="project-track" className='text-[#0019FF] '>Project Track<span className='text-[#FF0000]'>*</span></Label>
-
-                                    <Select>
-                                        <SelectTrigger style={{ backgroundColor: 'white', height: '60px' }}
-                                            id="project-track" className="">
-                                            <SelectValue placeholder="Open Innovation" />
-                                        </SelectTrigger>
-                                        <SelectContent>
-                                            {tracks.map((track) => (
-                                                <SelectItem key={track} value={track}>
-                                                    {track}
-                                                </SelectItem>
-                                            ))}
-                                        </SelectContent>
-                                    </Select>
-                                </div>
-
-                                <ErrorMessage name="projectTrack" component="div" />
-                            </div>
-                            <div>
-                                <div className="grid w-full max-w-sm items-center gap-4">
-                                    <Label htmlFor="description" className='text-[#0019FF]'>Description of Project<span className='text-[#FF0000]'>*</span></Label>
+  const form = useForm<FormValues>({
+    resolver: zodResolver(ideaSchema),
+    defaultValues: {
+      projectName: "",
+      projectTrack: "",
+      description: "",
+      figmaLink: "",
+      githubLink: "",
+      otherLinks: "",
+    },
+    mode: "onChange",
+  });
 
-                                    <Textarea
-                                        id='description'
-                                        placeholder="Don't forget to include your inspiration, learnings, project construction method, and difficulties you encountered in your writing. "
-                                        className="col-span-12 md:col-span-6 mb-6 md:mb-0 min-h-40 max-h-72 text-black"
+  async function onSubmit(data: FormValues) {
+    console.log(data);
+    // const toastId = toast.loading("Logging in...", { autoClose: false });
+    // const res = await loginUser(data);
 
-                                    />
-                                </div>
+    // toast.update(toastId, {
+    //   render:
+    //     res === 200 ? "Login successful!" : res !== 500 ? res : <ServerError />,
+    //   type: res === 200 ? "success" : "error",
+    //   isLoading: false,
+    //   autoClose: 2000,
+    // });
 
-                                <p className='text-right pr-2'>500 max words</p>
-                                <ErrorMessage name="description" component="div" />
-                            </div>
-                        </div>
-                        <div className='w-96 max-[445px]:w-[87vw] flex flex-col gap-6'>
-                            <div>
-                                <div className="grid w-full max-w-sm items-center gap-4">
-                                    <Label htmlFor="figmaLink" className='text-[#0019FF]'>Figma Link</Label>
-                                    <Input
-                                        type="text"
-                                        id="figmaLink"
-                                        placeholder="Figma link"
-                                        className=''
-                                        style={{ backgroundColor: 'white', height: '60px' }}
+    // if (res === 200) {
+    //   setTimeout(() => {
+    //     void router.push("/overview");
+    //   }, 2000);
+    // }
+  }
 
-                                    />
-                                </div>
+  return (
+    <Form {...form}>
+      <form onSubmit={form.handleSubmit(onSubmit)}>
+        <div className="flex justify-start gap-16 max-[931px]:flex-col max-[931px]:gap-6">
+          <div className="flex w-96 flex-col gap-6 max-[445px]:w-[87vw]">
+            <div>
+              <FormField
+                control={form.control}
+                name="projectName"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormControl>
+                      <div className="grid w-full max-w-sm items-center gap-4">
+                        <Label
+                          htmlFor="project-name"
+                          className="text-[#0019FF]"
+                        >
+                          Project Name<span className="text-[#FF0000]">*</span>
+                        </Label>
+                        <Input
+                          type="text"
+                          id="project-name"
+                          {...field}
+                          placeholder="Shuttle tracker"
+                          className={`h-14 bg-white pl-5 ${
+                            form.getFieldState("projectName").invalid
+                              ? "border-red-500 focus:border-input focus:!ring-red-500"
+                              : ""
+                          }`}
+                        />
+                      </div>
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              ></FormField>
+            </div>
+            <div>
+              <FormField
+                control={form.control}
+                name="projectTrack"
+                render={({}) => (
+                  <Controller
+                    name="projectTrack"
+                    control={form.control}
+                    render={({ field }) => (
+                      <FormItem>
+                        <FormControl>
+                          <div className="grid w-full max-w-sm items-center gap-4">
+                            <Label
+                              htmlFor="project-track"
+                              className="text-[#0019FF] "
+                            >
+                              Project Track
+                              <span className="text-[#FF0000]">*</span>
+                            </Label>
+                            <select
+                              value={form.watch("projectTrack")}
+                              onChange={(e) =>
+                                form.setValue("projectTrack", e.target.value)
+                              }
+                              className="rounded-md border border-gray-200 p-4 focus:border-transparent focus:outline-none focus:ring-2 focus:ring-blue-600"
+                            >
+                              <option value="">Select Project Track</option>
+                              {tracks.map((track) => (
+                                <option key={track} value={track}>
+                                  {track}
+                                </option>
+                              ))}
+                            </select>
+                          </div>
+                        </FormControl>
+                        <FormMessage />
+                      </FormItem>
+                    )}
+                  />
+                )}
+              ></FormField>
+            </div>
+            <div>
+              <FormField
+                control={form.control}
+                name="description"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormControl>
+                      <div className="grid w-full max-w-sm items-center gap-4">
+                        <Label htmlFor="description" className="text-[#0019FF]">
+                          Description of Project
+                          <span className="text-[#FF0000]">*</span>
+                        </Label>
 
-                                <ErrorMessage name="figmaLink" component="div" />
-                            </div>
-                            <div>
-                                <div className="grid w-full max-w-sm items-center gap-4">
-                                    <Label htmlFor="githubLink" className='text-[#0019FF]'>GitHub Link</Label>
-                                    <Input
-                                        type="text"
-                                        id="githubLink"
-                                        placeholder="Github link"
-                                        className='h-10'
-                                        style={{ backgroundColor: 'white', height: '60px' }}
+                        <Textarea
+                          id="description"
+                          {...field}
+                          placeholder="Don't forget to include your inspiration, learnings, project construction method, and difficulties you encountered in your writing. "
+                          className="col-span-12 mb-6 max-h-72 min-h-40 pl-5 text-black md:col-span-6 md:mb-0"
+                        />
+                      </div>
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              ></FormField>
 
-                                    />
-                                </div>
+              <p className="pr-2 text-right">500 max words</p>
+            </div>
+          </div>
+          <div className="flex w-96 flex-col gap-6 max-[445px]:w-[87vw]">
+            <div>
+              <FormField
+                control={form.control}
+                name="figmaLink"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormControl>
+                      <div className="grid w-full max-w-sm items-center gap-4">
+                        <Label htmlFor="figmaLink" className="text-[#0019FF]">
+                          Figma Link
+                        </Label>
+                        <Input
+                          type="text"
+                          id="figmaLink"
+                          placeholder="Figma link"
+                          {...field}
+                          className={`h-14 bg-white pl-5 ${
+                            form.getFieldState("figmaLink").invalid
+                              ? "border-red-500 focus:border-input focus:!ring-red-500"
+                              : ""
+                          }`}
+                        />
+                      </div>
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              ></FormField>
+            </div>
+            <div>
+              <FormField
+                control={form.control}
+                name="githubLink"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormControl>
+                      <div className="grid w-full max-w-sm items-center gap-4">
+                        <Label htmlFor="githubLink" className="text-[#0019FF]">
+                          GitHub Link
+                        </Label>
+                        <Input
+                          type="text"
+                          id="githubLink"
+                          {...field}
+                          placeholder="Github link"
+                          className={`h-14 bg-white pl-5 ${
+                            form.getFieldState("githubLink").invalid
+                              ? "border-red-500 focus:border-input focus:!ring-red-500"
+                              : ""
+                          }`}
+                        />
+                      </div>
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              ></FormField>
+            </div>
+            <div>
+              <FormField
+                control={form.control}
+                name="otherLinks"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormControl>
+                      <div className="grid w-full max-w-sm items-center gap-4">
+                        <Label htmlFor="otherLinks" className="text-[#0019FF]">
+                          Other Links
+                        </Label>
 
-                                <ErrorMessage name="githubLink" component="div" />
-                            </div>
-                            <div>
-                                <div className="grid w-full max-w-sm items-center gap-4">
-                                    <Label htmlFor="otherLinks" className='text-[#0019FF]'>Other Links</Label>
+                        <Textarea
+                          id="otherLinks"
+                          placeholder="Other links"
+                          {...field}
+                          className="col-span-12 mb-6 min-h-10 pl-5 text-black md:col-span-6 md:mb-0"
+                        />
+                      </div>
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              ></FormField>
 
-                                    <Textarea
-                                        id='otherLinks'
-                                        placeholder='Other links'
-                                        className="col-span-12 md:col-span-6 mb-6 md:mb-0 min-h-10"
-                                        style={{ color: 'background', height: '60px' }}
-                                    />
-                                </div>
+              <p>
+                Canva PPTs, Videos, Drive or Supporting Material can be shared
+              </p>
+            </div>
+          </div>
+        </div>
 
-                                <p>Canva PPTs, Videos, Drive or Supporting Material can be shared</p>
-                                <ErrorMessage name="otherLinks" component="div" />
-                            </div>
-                        </div>
-
-                    </div>
-
-
-
-                    <Button className='bg-[#0019FF] my-5' type="submit" disabled={isSubmitting }>
-                       <Image src={send as HTMLImageElement} alt='b'/><span className='pl-2'></span> Confirm Edit
-                    </Button>
-                </Form>
-            )}
-        </Formik>
-    )
-}
\ No newline at end of file
+        <Button
+          className="my-5 bg-[#0019FF]"
+          type="submit"
+          //   disabled={isSubmitting}
+        >
+          <Image src={send as HTMLImageElement} alt="b" />
+          <span className="pl-2">Submit Idea</span>
+        </Button>
+      </form>
+    </Form>
+  );
+}
diff --git a/devsoc24-portal-fe/src/app/page.tsx b/devsoc24-portal-fe/src/app/page.tsx
index 7e0cb07..9b5803f 100644
--- a/devsoc24-portal-fe/src/app/page.tsx
+++ b/devsoc24-portal-fe/src/app/page.tsx
@@ -20,12 +20,18 @@ export default function HomePage() {
       modalType: "JoinTeam",
     },
   ];
-  const ideaCard = [{
-    text: "Submit An Idea",
-    showModal: true,
-    modalType:"IdeaSubmit",
-    routeTo: "/submit-idea",
-  }]
+  const ideaCard = [
+    {
+      text: "View Idea",
+      showModal: true,
+      modalType: "IdeaSubmit",
+    },
+    {
+      text: "Submit Idea",
+      showModal: false,
+      routeTo: "/submit-idea",
+    },
+  ];
   const router = useRouter();
 
   // useEffect(() => {
@@ -37,12 +43,12 @@ export default function HomePage() {
   //   }
   // });
   return (
-    <main className="flex min-h-screen flex-col items-start bg-[#F4F5FA] overflow-x-hidden">
+    <main className="flex min-h-screen flex-col items-start overflow-x-hidden bg-[#F4F5FA]">
       <div className="flex h-[10%] w-full items-center gap-x-8 bg-background px-6 py-2">
         <Logo className="h-9/10 w-auto" />
         <Image src={Dashtitle as HTMLImageElement} alt="title" />
       </div>
-      <div className="mt-4 flex flex-col md:flex-row md:flex-wrap gap-4 w-full px-4">
+      <div className="mt-4 flex w-full flex-col gap-4 px-4 md:flex-row md:flex-wrap">
         <CustomCard
           title="Your Devsoc Team"
           cardImage="teamCardImg"
diff --git a/devsoc24-portal-fe/src/app/submit-idea/page.tsx b/devsoc24-portal-fe/src/app/submit-idea/page.tsx
index 111667b..e1e5e68 100644
--- a/devsoc24-portal-fe/src/app/submit-idea/page.tsx
+++ b/devsoc24-portal-fe/src/app/submit-idea/page.tsx
@@ -5,6 +5,8 @@ import Logo from "@/components/logo";
 import Dashtitle from "@/assets/images/titleDashboard.svg";
 import active from "@/assets/images/active.svg"
 import SubmitIdeaForm from "./submit-idea-form";
+import { ArrowLeft } from 'lucide-react';
+import Link from "next/link";
 
 export default function Page() {
     return (
@@ -14,14 +16,12 @@ export default function Page() {
                 <Image src={Dashtitle as HTMLImageElement} alt="title" />
             </div>
             <div className="flex h-[100vh] w-[4.7rem] max-[445px]:w-[3.7rem] items-start justify-center  gap-x-8 bg-background px-6 py-2 pt-12">
-                <Image src={active as HTMLImageElement} alt="title" className="scale-150 max-[445px]:scale-[3.5]" />
+                <Link href="/"><ArrowLeft className="text-[#0019FF]" /></Link>
             </div>
             <div className="mt-[11vh] ml-[4.7rem] max-[445px]:ml-[3.7rem] absolute pt-5 pl-5 bg-[#F4F5FA] w-[91.9vw] flex flex-col max-[931px]:justify-center  ">
                 <p className="text-black text-4xl font-medium mb-4">Submit An Idea For Devsoc24</p>
                 <SubmitIdeaForm />
             </div>
-
-
         </main>
     )
 }
\ No newline at end of file
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 37eeccc..d30b6ea 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
@@ -1,158 +1,274 @@
-import { Formik, Form, Field, ErrorMessage } from 'formik';
-import { Label } from "@/components/ui/label"
-import { Input } from '@/components/ui/input';
-import { Textarea } from "@/components/ui/textarea"
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useForm, Controller } from "react-hook-form";
+import { type z } from "zod";
 import {
-    Select,
-    SelectContent,
-    SelectItem,
-    SelectTrigger,
-    SelectValue,
-} from "@/components/ui/select"
-import { Button } from "@/components/ui/button"
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormMessage,
+} from "@/components/ui/form";
+import { Label } from "@/components/ui/label";
+import { Input } from "@/components/ui/input";
+import { Textarea } from "@/components/ui/textarea";
+import { Button } from "@/components/ui/button";
+import { ideaSchema } from "@/schemas/idea";
 
 interface FormValues {
-    projectName: string;
-    projectTrack: string;
-    description: string;
-    figmaLink: string;
-    githubLink: string;
-    otherLinks: string;
+  projectName: string;
+  projectTrack: string;
+  description: string;
+  figmaLink: string;
+  githubLink: string;
+  otherLinks: string;
 }
 
-import send from "@/assets/images/Send.svg"
-import Image from 'next/image';
-const tracks = ['Track 1', 'Track 2', 'Track 3'];
-
+import send from "@/assets/images/Send.svg";
+import Image from "next/image";
+const tracks = ["Track 1", "Track 2", "Track 3"];
 
 export default function SubmitIdeaForm() {
-    const initialValues: FormValues = {
-        projectName: '',
-        projectTrack: '',
-        description: '',
-        figmaLink: '',
-        githubLink: '',
-        otherLinks: ''
-    };
-    const onSubmit = (values: FormValues, { setSubmitting }: { setSubmitting: (isSubmitting: boolean) => void }) => {
-        setSubmitting(false);
-    };
-
-    return (
-
-        <Formik initialValues={initialValues} onSubmit={onSubmit}>
-            {({ isSubmitting }) => (
-                <Form className=''>
-                    <div className='flex justify-start gap-16 max-[931px]:gap-6 max-[931px]:flex-col'>
-                        <div className='w-96 max-[445px]:w-[87vw] flex flex-col gap-6'>
-                            <div>
-                                <div className="grid w-full max-w-sm items-center gap-4">
-                                    <Label htmlFor="project-name" className='text-[#0019FF]'>Project Name<span className='text-[#FF0000]'>*</span></Label>
-                                    <Input
-                                        type="text"
-                                        id="project-name"
-                                        placeholder="Shuttle tracker"
-                                        className=''
-                                        style={{ backgroundColor: 'white', height: '60px' }}
-
-                                    />
-                                </div>
-                                <ErrorMessage name="projectName" component="div" />
-                            </div>
-                            <div>
-                                <div className="grid w-full max-w-sm items-center gap-4">
-                                    <Label htmlFor="project-track" className='text-[#0019FF] '>Project Track<span className='text-[#FF0000]'>*</span></Label>
-
-                                    <Select>
-                                        <SelectTrigger style={{ backgroundColor: 'white', height: '60px' }}
-                                            id="project-track" className="">
-                                            <SelectValue placeholder="Open Innovation" />
-                                        </SelectTrigger>
-                                        <SelectContent>
-                                            {tracks.map((track) => (
-                                                <SelectItem key={track} value={track}>
-                                                    {track}
-                                                </SelectItem>
-                                            ))}
-                                        </SelectContent>
-                                    </Select>
-                                </div>
-
-                                <ErrorMessage name="projectTrack" component="div" />
-                            </div>
-                            <div>
-                                <div className="grid w-full max-w-sm items-center gap-4">
-                                    <Label htmlFor="description" className='text-[#0019FF]'>Description of Project<span className='text-[#FF0000]'>*</span></Label>
+  const form = useForm<FormValues>({
+    resolver: zodResolver(ideaSchema),
+    defaultValues: {
+      projectName: "",
+      projectTrack: "",
+      description: "",
+      figmaLink: "",
+      githubLink: "",
+      otherLinks: "",
+    },
+    mode: "onChange",
+  });
 
-                                    <Textarea
-                                        id='description'
-                                        placeholder="Don't forget to include your inspiration, learnings, project construction method, and difficulties you encountered in your writing. "
-                                        className="col-span-12 md:col-span-6 mb-6 md:mb-0 min-h-40 max-h-72 text-black"
+  async function onSubmit(data: FormValues) {
+    console.log(data);
+    // const toastId = toast.loading("Logging in...", { autoClose: false });
+    // const res = await loginUser(data);
 
-                                    />
-                                </div>
+    // toast.update(toastId, {
+    //   render:
+    //     res === 200 ? "Login successful!" : res !== 500 ? res : <ServerError />,
+    //   type: res === 200 ? "success" : "error",
+    //   isLoading: false,
+    //   autoClose: 2000,
+    // });
 
-                                <p className='text-right pr-2'>500 max words</p>
-                                <ErrorMessage name="description" component="div" />
-                            </div>
-                        </div>
-                        <div className='w-96 max-[445px]:w-[87vw] flex flex-col gap-6'>
-                            <div>
-                                <div className="grid w-full max-w-sm items-center gap-4">
-                                    <Label htmlFor="figmaLink" className='text-[#0019FF]'>Figma Link</Label>
-                                    <Input
-                                        type="text"
-                                        id="figmaLink"
-                                        placeholder="Figma link"
-                                        className=''
-                                        style={{ backgroundColor: 'white', height: '60px' }}
+    // if (res === 200) {
+    //   setTimeout(() => {
+    //     void router.push("/overview");
+    //   }, 2000);
+    // }
+  }
 
-                                    />
-                                </div>
+  return (
+    <Form {...form}>
+      <form onSubmit={form.handleSubmit(onSubmit)}>
+        <div className="flex justify-start gap-16 max-[931px]:flex-col max-[931px]:gap-6">
+          <div className="flex w-96 flex-col gap-6 max-[445px]:w-[87vw]">
+            <div>
+              <FormField
+                control={form.control}
+                name="projectName"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormControl>
+                      <div className="grid w-full max-w-sm items-center gap-4">
+                        <Label
+                          htmlFor="project-name"
+                          className="text-[#0019FF]"
+                        >
+                          Project Name<span className="text-[#FF0000]">*</span>
+                        </Label>
+                        <Input
+                          type="text"
+                          id="project-name"
+                          {...field}
+                          placeholder="Shuttle tracker"
+                          className={`h-14 bg-white pl-5 ${
+                            form.getFieldState("projectName").invalid
+                              ? "border-red-500 focus:border-input focus:!ring-red-500"
+                              : ""
+                          }`}
+                        />
+                      </div>
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              ></FormField>
+            </div>
+            <div>
+              <FormField
+                control={form.control}
+                name="projectTrack"
+                render={({}) => (
+                  <Controller
+                    name="projectTrack"
+                    control={form.control}
+                    render={({ field }) => (
+                      <FormItem>
+                        <FormControl>
+                          <div className="grid w-full max-w-sm items-center gap-4">
+                            <Label
+                              htmlFor="project-track"
+                              className="text-[#0019FF] "
+                            >
+                              Project Track
+                              <span className="text-[#FF0000]">*</span>
+                            </Label>
+                            <select
+                              value={form.watch("projectTrack")}
+                              onChange={(e) =>
+                                form.setValue("projectTrack", e.target.value)
+                              }
+                              className="rounded-md border border-gray-200 p-4 focus:border-transparent focus:outline-none focus:ring-2 focus:ring-blue-600"
+                            >
+                              <option value="">Select Project Track</option>
+                              {tracks.map((track) => (
+                                <option key={track} value={track}>
+                                  {track}
+                                </option>
+                              ))}
+                            </select>
+                          </div>
+                        </FormControl>
+                        <FormMessage />
+                      </FormItem>
+                    )}
+                  />
+                )}
+              ></FormField>
+            </div>
+            <div>
+              <FormField
+                control={form.control}
+                name="description"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormControl>
+                      <div className="grid w-full max-w-sm items-center gap-4">
+                        <Label htmlFor="description" className="text-[#0019FF]">
+                          Description of Project
+                          <span className="text-[#FF0000]">*</span>
+                        </Label>
 
-                                <ErrorMessage name="figmaLink" component="div" />
-                            </div>
-                            <div>
-                                <div className="grid w-full max-w-sm items-center gap-4">
-                                    <Label htmlFor="githubLink" className='text-[#0019FF]'>GitHub Link</Label>
-                                    <Input
-                                        type="text"
-                                        id="githubLink"
-                                        placeholder="Github link"
-                                        className='h-10'
-                                        style={{ backgroundColor: 'white', height: '60px' }}
+                        <Textarea
+                          id="description"
+                          {...field}
+                          placeholder="Don't forget to include your inspiration, learnings, project construction method, and difficulties you encountered in your writing. "
+                          className="col-span-12 mb-6 max-h-72 min-h-40 text-black md:col-span-6 md:mb-0 pl-5"
+                        />
+                      </div>
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              ></FormField>
 
-                                    />
-                                </div>
+              <p className="pr-2 text-right">500 max words</p>
+            </div>
+          </div>
+          <div className="flex w-96 flex-col gap-6 max-[445px]:w-[87vw]">
+            <div>
+              <FormField
+                control={form.control}
+                name="figmaLink"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormControl>
+                      <div className="grid w-full max-w-sm items-center gap-4">
+                        <Label htmlFor="figmaLink" className="text-[#0019FF]">
+                          Figma Link
+                        </Label>
+                        <Input
+                          type="text"
+                          id="figmaLink"
+                          placeholder="Figma link"
+                          {...field}
+                          className={`h-14 bg-white pl-5 ${
+                            form.getFieldState("figmaLink").invalid
+                              ? "border-red-500 focus:border-input focus:!ring-red-500"
+                              : ""
+                          }`}
+                        />
+                      </div>
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              ></FormField>
+            </div>
+            <div>
+              <FormField
+                control={form.control}
+                name="githubLink"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormControl>
+                      <div className="grid w-full max-w-sm items-center gap-4">
+                        <Label htmlFor="githubLink" className="text-[#0019FF]">
+                          GitHub Link
+                        </Label>
+                        <Input
+                          type="text"
+                          id="githubLink"
+                          {...field}
+                          placeholder="Github link"
+                          className={`h-14 bg-white pl-5 ${
+                            form.getFieldState("githubLink").invalid
+                              ? "border-red-500 focus:border-input focus:!ring-red-500"
+                              : ""
+                          }`}
+                        />
+                      </div>
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              ></FormField>
+            </div>
+            <div>
+              <FormField
+                control={form.control}
+                name="otherLinks"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormControl>
+                      <div className="grid w-full max-w-sm items-center gap-4">
+                        <Label htmlFor="otherLinks" className="text-[#0019FF]">
+                          Other Links
+                        </Label>
 
-                                <ErrorMessage name="githubLink" component="div" />
-                            </div>
-                            <div>
-                                <div className="grid w-full max-w-sm items-center gap-4">
-                                    <Label htmlFor="otherLinks" className='text-[#0019FF]'>Other Links</Label>
+                        <Textarea
+                          id="otherLinks"
+                          placeholder="Other links"
+                          {...field}
+                          className="col-span-12 mb-6 min-h-10 text-black md:col-span-6 md:mb-0 pl-5"
+                        />
+                      </div>
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              ></FormField>
 
-                                    <Textarea
-                                        id='otherLinks'
-                                        placeholder='Other links'
-                                        className="col-span-12 md:col-span-6 mb-6 md:mb-0 min-h-10"
-                                        style={{ color: 'background', height: '60px' }}
-                                    />
-                                </div>
+              <p>
+                Canva PPTs, Videos, Drive or Supporting Material can be shared
+              </p>
+            </div>
+          </div>
+        </div>
 
-                                <p>Canva PPTs, Videos, Drive or Supporting Material can be shared</p>
-                                <ErrorMessage name="otherLinks" component="div" />
-                            </div>
-                        </div>
-
-                    </div>
-
-
-
-                    <Button className='bg-[#0019FF] my-5' type="submit" disabled={isSubmitting }>
-                       <Image src={send as HTMLImageElement} alt='b'/><span className='pl-2'>Submit Idea</span> 
-                    </Button>
-                </Form>
-            )}
-        </Formik>
-    )
-}
\ No newline at end of file
+        <Button
+          className="my-5 bg-[#0019FF]"
+          type="submit"
+          //   disabled={isSubmitting}
+        >
+          <Image src={send as HTMLImageElement} alt="b" />
+          <span className="pl-2">Submit Idea</span>
+        </Button>
+      </form>
+    </Form>
+  );
+}
diff --git a/devsoc24-portal-fe/src/app/submit-project/page.tsx b/devsoc24-portal-fe/src/app/submit-project/page.tsx
index 279c5b2..76051f8 100644
--- a/devsoc24-portal-fe/src/app/submit-project/page.tsx
+++ b/devsoc24-portal-fe/src/app/submit-project/page.tsx
@@ -5,6 +5,8 @@ import Logo from "@/components/logo";
 import Dashtitle from "@/assets/images/titleDashboard.svg";
 import active from "@/assets/images/active.svg"
 import SubmitProjectForm from "./submit-project-form";
+import { ArrowLeft } from 'lucide-react';
+import Link from "next/link";
 
 export default function Page() {
     return (
@@ -14,7 +16,7 @@ export default function Page() {
                 <Image src={Dashtitle as HTMLImageElement} alt="title" />
             </div>
             <div className="flex h-[100vh] w-[4.7rem] max-[445px]:w-[3.7rem] items-start justify-center  gap-x-8 bg-background px-6 py-2 pt-12">
-                <Image src={active as HTMLImageElement} alt="title" className="scale-150 max-[445px]:scale-[3.5]" />
+                <Link href="/"><ArrowLeft className="text-[#0019FF]" /></Link>
             </div>
             <div className="mt-[11vh] ml-[4.7rem] max-[445px]:ml-[3.7rem] absolute pt-5 pl-5 bg-[#F4F5FA] w-[91.9vw] flex flex-col max-[931px]:justify-center  ">
                 <p className="text-black text-4xl font-medium mb-4">Project Submission For Devsoc24</p>
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 9178ea1..efb5d0f 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
@@ -1,158 +1,274 @@
-import { Formik, Form, Field, ErrorMessage } from 'formik';
-import { Label } from "@/components/ui/label"
-import { Input } from '@/components/ui/input';
-import { Textarea } from "@/components/ui/textarea"
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useForm, Controller } from "react-hook-form";
+import { type z } from "zod";
 import {
-    Select,
-    SelectContent,
-    SelectItem,
-    SelectTrigger,
-    SelectValue,
-} from "@/components/ui/select"
-import { Button } from "@/components/ui/button"
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormMessage,
+} from "@/components/ui/form";
+import { Label } from "@/components/ui/label";
+import { Input } from "@/components/ui/input";
+import { Textarea } from "@/components/ui/textarea";
+import { Button } from "@/components/ui/button";
+import { ideaSchema } from "@/schemas/idea";
 
 interface FormValues {
-    projectName: string;
-    projectTrack: string;
-    description: string;
-    figmaLink: string;
-    githubLink: string;
-    otherLinks: string;
+  projectName: string;
+  projectTrack: string;
+  description: string;
+  figmaLink: string;
+  githubLink: string;
+  otherLinks: string;
 }
 
-import send from "@/assets/images/Send.svg"
-import Image from 'next/image';
-const tracks = ['Track 1', 'Track 2', 'Track 3'];
-
+import send from "@/assets/images/Send.svg";
+import Image from "next/image";
+const tracks = ["Track 1", "Track 2", "Track 3"];
 
 export default function SubmitProjectForm() {
-    const initialValues: FormValues = {
-        projectName: '',
-        projectTrack: '',
-        description: '',
-        figmaLink: '',
-        githubLink: '',
-        otherLinks: ''
-    };
-    const onSubmit = (values: FormValues, { setSubmitting }: { setSubmitting: (isSubmitting: boolean) => void }) => {
-        setSubmitting(false);
-    };
-
-    return (
-
-        <Formik initialValues={initialValues} onSubmit={onSubmit}>
-            {({ isSubmitting }) => (
-                <Form className=''>
-                    <div className='flex justify-start gap-16 max-[931px]:gap-6 max-[931px]:flex-col'>
-                        <div className='w-96 max-[445px]:w-[87vw] flex flex-col gap-6'>
-                            <div>
-                                <div className="grid w-full max-w-sm items-center gap-4">
-                                    <Label htmlFor="project-name" className='text-[#0019FF]'>Project Name<span className='text-[#FF0000]'>*</span></Label>
-                                    <Input
-                                        type="text"
-                                        id="project-name"
-                                        placeholder="Shuttle tracker"
-                                        className=''
-                                        style={{ backgroundColor: 'white', height: '60px' }}
-
-                                    />
-                                </div>
-                                <ErrorMessage name="projectName" component="div" />
-                            </div>
-                            <div>
-                                <div className="grid w-full max-w-sm items-center gap-4">
-                                    <Label htmlFor="project-track" className='text-[#0019FF] '>Project Track<span className='text-[#FF0000]'>*</span></Label>
-
-                                    <Select>
-                                        <SelectTrigger style={{ backgroundColor: 'white', height: '60px' }}
-                                            id="project-track" className="">
-                                            <SelectValue placeholder="Open Innovation" />
-                                        </SelectTrigger>
-                                        <SelectContent>
-                                            {tracks.map((track) => (
-                                                <SelectItem key={track} value={track}>
-                                                    {track}
-                                                </SelectItem>
-                                            ))}
-                                        </SelectContent>
-                                    </Select>
-                                </div>
-
-                                <ErrorMessage name="projectTrack" component="div" />
-                            </div>
-                            <div>
-                                <div className="grid w-full max-w-sm items-center gap-4">
-                                    <Label htmlFor="description" className='text-[#0019FF]'>Description of Project<span className='text-[#FF0000]'>*</span></Label>
+  const form = useForm<FormValues>({
+    resolver: zodResolver(ideaSchema),
+    defaultValues: {
+      projectName: "",
+      projectTrack: "",
+      description: "",
+      figmaLink: "",
+      githubLink: "",
+      otherLinks: "",
+    },
+    mode: "onChange",
+  });
 
-                                    <Textarea
-                                        id='description'
-                                        placeholder="Don't forget to include your inspiration, learnings, project construction method, and difficulties you encountered in your writing. "
-                                        className="col-span-12 md:col-span-6 mb-6 md:mb-0 min-h-40 max-h-72 text-black"
+  async function onSubmit(data: FormValues) {
+    console.log(data);
+    // const toastId = toast.loading("Logging in...", { autoClose: false });
+    // const res = await loginUser(data);
 
-                                    />
-                                </div>
+    // toast.update(toastId, {
+    //   render:
+    //     res === 200 ? "Login successful!" : res !== 500 ? res : <ServerError />,
+    //   type: res === 200 ? "success" : "error",
+    //   isLoading: false,
+    //   autoClose: 2000,
+    // });
 
-                                <p className='text-right pr-2'>500 max words</p>
-                                <ErrorMessage name="description" component="div" />
-                            </div>
-                        </div>
-                        <div className='w-96 max-[445px]:w-[87vw] flex flex-col gap-6'>
-                            <div>
-                                <div className="grid w-full max-w-sm items-center gap-4">
-                                    <Label htmlFor="figmaLink" className='text-[#0019FF]'>Figma Link</Label>
-                                    <Input
-                                        type="text"
-                                        id="figmaLink"
-                                        placeholder="Figma link"
-                                        className=''
-                                        style={{ backgroundColor: 'white', height: '60px' }}
+    // if (res === 200) {
+    //   setTimeout(() => {
+    //     void router.push("/overview");
+    //   }, 2000);
+    // }
+  }
 
-                                    />
-                                </div>
+  return (
+    <Form {...form}>
+      <form onSubmit={form.handleSubmit(onSubmit)}>
+        <div className="flex justify-start gap-16 max-[931px]:flex-col max-[931px]:gap-6">
+          <div className="flex w-96 flex-col gap-6 max-[445px]:w-[87vw]">
+            <div>
+              <FormField
+                control={form.control}
+                name="projectName"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormControl>
+                      <div className="grid w-full max-w-sm items-center gap-4">
+                        <Label
+                          htmlFor="project-name"
+                          className="text-[#0019FF]"
+                        >
+                          Project Name<span className="text-[#FF0000]">*</span>
+                        </Label>
+                        <Input
+                          type="text"
+                          id="project-name"
+                          {...field}
+                          placeholder="Shuttle tracker"
+                          className={`h-14 bg-white pl-5 ${
+                            form.getFieldState("projectName").invalid
+                              ? "border-red-500 focus:border-input focus:!ring-red-500"
+                              : ""
+                          }`}
+                        />
+                      </div>
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              ></FormField>
+            </div>
+            <div>
+              <FormField
+                control={form.control}
+                name="projectTrack"
+                render={({}) => (
+                  <Controller
+                    name="projectTrack"
+                    control={form.control}
+                    render={({ field }) => (
+                      <FormItem>
+                        <FormControl>
+                          <div className="grid w-full max-w-sm items-center gap-4">
+                            <Label
+                              htmlFor="project-track"
+                              className="text-[#0019FF] "
+                            >
+                              Project Track
+                              <span className="text-[#FF0000]">*</span>
+                            </Label>
+                            <select
+                              value={form.watch("projectTrack")}
+                              onChange={(e) =>
+                                form.setValue("projectTrack", e.target.value)
+                              }
+                              className="rounded-md border border-gray-200 p-4 focus:border-transparent focus:outline-none focus:ring-2 focus:ring-blue-600"
+                            >
+                              <option value="">Select Project Track</option>
+                              {tracks.map((track) => (
+                                <option key={track} value={track}>
+                                  {track}
+                                </option>
+                              ))}
+                            </select>
+                          </div>
+                        </FormControl>
+                        <FormMessage />
+                      </FormItem>
+                    )}
+                  />
+                )}
+              ></FormField>
+            </div>
+            <div>
+              <FormField
+                control={form.control}
+                name="description"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormControl>
+                      <div className="grid w-full max-w-sm items-center gap-4">
+                        <Label htmlFor="description" className="text-[#0019FF]">
+                          Description of Project
+                          <span className="text-[#FF0000]">*</span>
+                        </Label>
 
-                                <ErrorMessage name="figmaLink" component="div" />
-                            </div>
-                            <div>
-                                <div className="grid w-full max-w-sm items-center gap-4">
-                                    <Label htmlFor="githubLink" className='text-[#0019FF]'>GitHub Link</Label>
-                                    <Input
-                                        type="text"
-                                        id="githubLink"
-                                        placeholder="Github link"
-                                        className='h-10'
-                                        style={{ backgroundColor: 'white', height: '60px' }}
+                        <Textarea
+                          id="description"
+                          {...field}
+                          placeholder="Don't forget to include your inspiration, learnings, project construction method, and difficulties you encountered in your writing. "
+                          className="col-span-12 mb-6 max-h-72 min-h-40 text-black md:col-span-6 md:mb-0 pl-5"
+                        />
+                      </div>
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              ></FormField>
 
-                                    />
-                                </div>
+              <p className="pr-2 text-right">500 max words</p>
+            </div>
+          </div>
+          <div className="flex w-96 flex-col gap-6 max-[445px]:w-[87vw]">
+            <div>
+              <FormField
+                control={form.control}
+                name="figmaLink"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormControl>
+                      <div className="grid w-full max-w-sm items-center gap-4">
+                        <Label htmlFor="figmaLink" className="text-[#0019FF]">
+                          Figma Link
+                        </Label>
+                        <Input
+                          type="text"
+                          id="figmaLink"
+                          placeholder="Figma link"
+                          {...field}
+                          className={`h-14 bg-white pl-5 ${
+                            form.getFieldState("figmaLink").invalid
+                              ? "border-red-500 focus:border-input focus:!ring-red-500"
+                              : ""
+                          }`}
+                        />
+                      </div>
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              ></FormField>
+            </div>
+            <div>
+              <FormField
+                control={form.control}
+                name="githubLink"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormControl>
+                      <div className="grid w-full max-w-sm items-center gap-4">
+                        <Label htmlFor="githubLink" className="text-[#0019FF]">
+                          GitHub Link
+                        </Label>
+                        <Input
+                          type="text"
+                          id="githubLink"
+                          {...field}
+                          placeholder="Github link"
+                          className={`h-14 bg-white pl-5 ${
+                            form.getFieldState("githubLink").invalid
+                              ? "border-red-500 focus:border-input focus:!ring-red-500"
+                              : ""
+                          }`}
+                        />
+                      </div>
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              ></FormField>
+            </div>
+            <div>
+              <FormField
+                control={form.control}
+                name="otherLinks"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormControl>
+                      <div className="grid w-full max-w-sm items-center gap-4">
+                        <Label htmlFor="otherLinks" className="text-[#0019FF]">
+                          Other Links
+                        </Label>
 
-                                <ErrorMessage name="githubLink" component="div" />
-                            </div>
-                            <div>
-                                <div className="grid w-full max-w-sm items-center gap-4">
-                                    <Label htmlFor="otherLinks" className='text-[#0019FF]'>Other Links</Label>
+                        <Textarea
+                          id="otherLinks"
+                          placeholder="Other links"
+                          {...field}
+                          className="col-span-12 mb-6 min-h-10 text-black md:col-span-6 md:mb-0 pl-5"
+                        />
+                      </div>
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              ></FormField>
 
-                                    <Textarea
-                                        id='otherLinks'
-                                        placeholder='Other links'
-                                        className="col-span-12 md:col-span-6 mb-6 md:mb-0 min-h-10"
-                                        style={{ color: 'background', height: '60px' }}
-                                    />
-                                </div>
+              <p>
+                Canva PPTs, Videos, Drive or Supporting Material can be shared
+              </p>
+            </div>
+          </div>
+        </div>
 
-                                <p>Canva PPTs, Videos, Drive or Supporting Material can be shared</p>
-                                <ErrorMessage name="otherLinks" component="div" />
-                            </div>
-                        </div>
-
-                    </div>
-
-
-
-                    <Button className='bg-[#0019FF] my-5' type="submit" disabled={isSubmitting }>
-                       <Image src={send as HTMLImageElement} alt='b'/><span className='pl-2'>Submit Project</span> 
-                    </Button>
-                </Form>
-            )}
-        </Formik>
-    )
-}
\ No newline at end of file
+        <Button
+          className="my-5 bg-[#0019FF]"
+          type="submit"
+          //   disabled={isSubmitting}
+        >
+          <Image src={send as HTMLImageElement} alt="b" />
+          <span className="pl-2">Submit Idea</span>
+        </Button>
+      </form>
+    </Form>
+  );
+}
diff --git a/devsoc24-portal-fe/src/components/customCard.tsx b/devsoc24-portal-fe/src/components/customCard.tsx
index 2df81c1..9f81804 100644
--- a/devsoc24-portal-fe/src/components/customCard.tsx
+++ b/devsoc24-portal-fe/src/components/customCard.tsx
@@ -2,15 +2,17 @@
 import { Dialog, DialogTrigger } from "@/components/ui/dialog";
 import { type CardProps } from "@/interfaces";
 import JoinTeam from "@/components/team/joinTeam";
-import IdeaSubmission from "@/components/submission/submission"
+import IdeaSubmission from "@/components/submission/submission";
 import Image from "next/image";
 import { Button } from "@/components/ui/button";
 import { useState } from "react";
 import CreateTeam from "./team/createTeam";
+import { useRouter } from "next/navigation";
 
 function CustomCard(props: CardProps) {
+  const router = useRouter();
   const { title, cardImage, cardContent, cardDesc, buttonDetails } = props;
-  const [ showModal, setShowModal ] = useState("");
+  const [showModal, setShowModal] = useState("");
 
   const handleDialogTriggerClick = (modalType: string) => {
     setShowModal(modalType);
@@ -18,7 +20,7 @@ function CustomCard(props: CardProps) {
 
   return (
     <>
-      <div className="h-fit rounded-xl bg-white w-full md:w-fit">
+      <div className="h-fit w-full rounded-xl bg-white md:w-fit">
         <div className="pl-3 pt-2 font-semibold text-[#45464E]">{title}</div>
         <div className="flex flex-col items-center justify-center p-8">
           <div className="rounded-full border-[#E1E2E9] bg-[#F4F5FA] p-8">
@@ -45,7 +47,11 @@ function CustomCard(props: CardProps) {
                     {button.text}
                   </DialogTrigger>
                 ) : (
-                  <Button key={index} className="w-28" >
+                  <Button
+                    key={index}
+                    className="w-36"
+                    onClick={() => void router.push(button.routeTo ?? "")}
+                  >
                     {button.text}
                   </Button>
                 ),
diff --git a/devsoc24-portal-fe/src/schemas/idea.ts b/devsoc24-portal-fe/src/schemas/idea.ts
new file mode 100644
index 0000000..173a5af
--- /dev/null
+++ b/devsoc24-portal-fe/src/schemas/idea.ts
@@ -0,0 +1,38 @@
+"use client";
+
+import * as z from "zod";
+
+export const ideaSchema = z.object({
+    projectName: z
+    .string({
+      required_error: "Project name is required",
+      invalid_type_error: "Project must be a string",
+    }),
+    projectTrack: z
+    .string({
+      required_error: "Project track is required",
+      invalid_type_error: "Project track be a string",
+    }),
+    description: z
+    .string({
+      required_error: "Description is required",
+      invalid_type_error: "Description be a string",
+    }),
+    figmaLink: z
+    .string({
+      required_error: "Figma Link is required",
+      invalid_type_error: "Figma Link be a string",
+    }),
+    githubLink: z
+    .string({
+      required_error: "Github Link is required",
+      invalid_type_error: "Github Link be a string",
+    }),
+    otherLinks: z
+    .string({
+      required_error: "Other Links is required",
+      invalid_type_error: "Other Links be a string",
+    }),
+
+  
+});
\ No newline at end of file