diff --git a/devsoc24-portal-fe/src/app/home/page.tsx b/devsoc24-portal-fe/src/app/home/page.tsx
index 3cc419d..5458b16 100644
--- a/devsoc24-portal-fe/src/app/home/page.tsx
+++ b/devsoc24-portal-fe/src/app/home/page.tsx
@@ -138,7 +138,7 @@ export default function HomePage() {
   const fetchIdea = async () => {
     try {
       const response: AxiosResponse<ideaProps> = await axios.get(
-        `${process.env.NEXT_PUBLIC_API_URL}/idea`,
+        `${process.env.NEXT_PUBLIC_API_URL}/project`,
         {
           withCredentials: true,
         },
@@ -240,32 +240,40 @@ export default function HomePage() {
   ];
   const ideaTherecard = [
     {
-      text: "View Idea",
+      text: "View Project",
       showModal: true,
       modalType: "IdeaSubmit",
     },
     {
-      text: "Edit idea",
+      text: "Edit Project",
       showModal: false,
       modalType: "EditIdea",
-      routeTo: "/edit-idea",
+      routeTo: "/edit-project",
     },
   ];
   const ideaCard = [
     {
-      text: "Submit an Idea",
-      showModal: true,
+      text: "Submit A Project",
+      showModal: getIdea !== "idea found" && getIdea !== "",
       modalType: "Choice",
+      routeTo: "/submit-project",
     },
   ];
 
   const notLeader = [
     {
-      text: "View Idea",
+      text: "View Project",
       showModal: true,
       modalType: "IdeaSubmit",
     },
   ];
+  const ideaView = [
+    {
+      text: "View Idea",
+      showModal: true,
+      modalType: "IdeaView",
+    },
+  ];
 
   return (
     <>
@@ -395,14 +403,14 @@ export default function HomePage() {
           <></>
         )}
 
-        <div className="flex h-full  flex-col">
+        <div className="flex h-full flex-col">
           {showModal === "leave" && <LeaveTeam />}
           {showModal === "kick" && <Kick />}
           <div className="mt-4 flex h-fit w-screen flex-col justify-between gap-4 px-4">
             <TimelineComponent count={1} />
           </div>
 
-          <div className="mt-4 flex h-fit w-screen flex-col justify-between gap-4 overflow-y-auto px-4 md:flex-row lg:h-[85%]">
+          <div className="mt-4 flex h-fit w-screen flex-col justify-between gap-4 px-4 md:flex-row lg:h-[85%]">
             {team ? (
               <CustomCard
                 title="Your Team"
@@ -414,29 +422,41 @@ export default function HomePage() {
             ) : (
               <TeamCard {...teamData} />
             )}
-            <CustomCard
-              title="Idea Submission"
-              cardImage="ideaSubmissionImg"
-              cardContent={
-                getIdea === "idea found"
-                  ? "Idea Submitted"
-                  : "Idea submission closed"
-              }
-              cardDesc={
-                getIdea === "idea found"
-                  ? isLeader
-                    ? "Edit or View Idea"
-                    : "View Idea"
-                  : "closed"
-              }
-              buttonDetails={
-                getIdea === "idea found" && !team
-                  ? isLeader
-                    ? ideaTherecard
-                    : notLeader
-                  : ideaCard
-              }
-            />
+            <div className="flex flex-col gap-y-4">
+              <CustomCard
+                title="Project Submission"
+                cardImage="ideaSubmissionImg"
+                cardContent={
+                  getIdea === "idea found"
+                    ? "Project Submitted"
+                    : "No Project Yet"
+                }
+                cardDesc={
+                  getIdea === "idea found"
+                    ? isLeader
+                      ? "Edit or View Project"
+                      : "View Project"
+                    : isLeader
+                      ? "Submit a Project"
+                      : "View Project"
+                }
+                buttonDetails={
+                  getIdea === "idea found" && !team
+                    ? isLeader
+                      ? ideaTherecard
+                      : notLeader
+                    : ideaCard
+                }
+              />
+              <CustomCard
+                title="Idea Submission"
+                cardImage="ideaSubmissionImg"
+                cardContent="Idea Submitted"
+                cardDesc="View Idea"
+                buttonDetails={ideaView}
+              />
+            </div>
+
             <div className="h-full ">
               <TrackComponent />
             </div>
diff --git a/devsoc24-portal-fe/src/components/customCard.tsx b/devsoc24-portal-fe/src/components/customCard.tsx
index e94bd7b..84f295f 100644
--- a/devsoc24-portal-fe/src/components/customCard.tsx
+++ b/devsoc24-portal-fe/src/components/customCard.tsx
@@ -3,6 +3,7 @@ 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 IdeaSubmission2 from "@/components/submission/submission2";
 import Image from "next/image";
 import { Button } from "@/components/ui/button";
 import { useState } from "react";
@@ -63,6 +64,7 @@ function CustomCard(props: CardProps) {
               {showModal === "JoinTeam" && <JoinTeam />}
               {showModal === "CreateTeam" && <CreateTeam />}
               {showModal === "IdeaSubmit" && <IdeaSubmission />}
+              {showModal === "IdeaView" && <IdeaSubmission2 />}
             </Dialog>
           </div>
         </div>
diff --git a/devsoc24-portal-fe/src/components/submission/submission.tsx b/devsoc24-portal-fe/src/components/submission/submission.tsx
index 0fca2c8..3c53461 100644
--- a/devsoc24-portal-fe/src/components/submission/submission.tsx
+++ b/devsoc24-portal-fe/src/components/submission/submission.tsx
@@ -8,7 +8,7 @@ import axios from "axios";
 import { useEffect, useState } from "react";
 
 interface FormValues {
-  title: string;
+  name: string;
   track: string;
   description: string;
   figma_link?: string;
@@ -28,7 +28,7 @@ function Submission() {
     async function getIdeaSubmission() {
       try {
         const res = await axios.get<GetIdea>(
-          `${process.env.NEXT_PUBLIC_API_URL}/idea`,
+          `${process.env.NEXT_PUBLIC_API_URL}/project`,
           {
             withCredentials: true,
           },
@@ -58,9 +58,9 @@ function Submission() {
               id="projectName"
               className="rounded-md bg-[#F1F1F1] p-2  text-[#ABAFB1]"
             >
-              {!ideaDetails?.title || ideaDetails?.title === ""
+              {!ideaDetails?.name || ideaDetails?.name === ""
                 ? viewStatus
-                : ideaDetails?.title}
+                : ideaDetails?.name}
             </div>
 
             <Label htmlFor="projectTrack" className="text-xs font-semibold">
diff --git a/devsoc24-portal-fe/src/components/submission/submission2.tsx b/devsoc24-portal-fe/src/components/submission/submission2.tsx
new file mode 100644
index 0000000..b76afd3
--- /dev/null
+++ b/devsoc24-portal-fe/src/components/submission/submission2.tsx
@@ -0,0 +1,132 @@
+import {
+    DialogContent,
+    DialogHeader,
+    DialogTitle,
+  } from "@/components/ui/dialog";
+  import { Label } from "@/components/ui/label";
+  import axios from "axios";
+  import { useEffect, useState } from "react";
+  
+  interface FormValues {
+    title: string;
+    track: string;
+    description: string;
+    figma_link?: string;
+    github_link?: string;
+    others: string;
+  }
+  interface GetIdea {
+    data: FormValues;
+    message: string;
+    status: string;
+  }
+  
+  function Submission2() {
+    const viewStatus = "Not submitted";
+    const [ideaDetails, setIdeaDetails] = useState<FormValues>();
+    useEffect(() => {
+      async function getIdeaSubmission() {
+        try {
+          const res = await axios.get<GetIdea>(
+            `${process.env.NEXT_PUBLIC_API_URL}/idea`,
+            {
+              withCredentials: true,
+            },
+          );
+          // console.log(res.data.data);
+          setIdeaDetails(res.data.data);
+        } catch (error) {
+          // console.log("Error getting idea submission:", error)
+        }
+      }
+      void getIdeaSubmission();
+    }, []);
+    return (
+      <>
+        <DialogContent className="sm:max-w-[425px]">
+          <DialogHeader>
+            <DialogTitle>View Submission</DialogTitle>
+          </DialogHeader>
+          <div className="max-h-[80vh] overflow-y-auto">
+            {" "}
+            {/* Scrollable container */}
+            <div className="flex flex-col gap-y-2 py-3 text-[#0019FF]">
+              <Label htmlFor="projectName" className="text-xs font-semibold">
+                Project Name
+              </Label>
+              <div
+                id="projectName"
+                className="rounded-md bg-[#F1F1F1] p-2  text-[#ABAFB1]"
+              >
+                {!ideaDetails?.title || ideaDetails?.title === ""
+                  ? viewStatus
+                  : ideaDetails?.title}
+              </div>
+  
+              <Label htmlFor="projectTrack" className="text-xs font-semibold">
+                Project Track
+              </Label>
+              <div
+                id="projectTrack"
+                className="rounded-md bg-[#F1F1F1] p-2  text-[#ABAFB1]"
+              >
+                {!ideaDetails?.track || ideaDetails?.track === ""
+                  ? viewStatus
+                  : ideaDetails?.track}
+              </div>
+  
+              <Label htmlFor="description" className="text-xs font-semibold">
+                Description of project
+              </Label>
+              <div
+                id="description"
+                className="text-wrap break-words rounded-md bg-[#F1F1F1] p-2 text-[#ABAFB1]"
+              >
+                {!ideaDetails?.description || ideaDetails?.description === ""
+                  ? viewStatus
+                  : ideaDetails?.description}
+              </div>
+              <Label htmlFor="figmaLink" className="text-xs font-semibold">
+                Figma Link
+              </Label>
+              <div
+                id="figmaLink"
+                className="text-wrap break-words rounded-md  bg-[#F1F1F1] p-2 text-[#ABAFB1]"
+              >
+                {!ideaDetails?.figma_link || ideaDetails?.figma_link === ""
+                  ? viewStatus
+                  : ideaDetails?.figma_link}
+              </div>
+  
+              <Label htmlFor="githubLink" className="text-xs font-semibold">
+                Github Link
+              </Label>
+              <div
+                id="githubLink"
+                className="text-wrap break-words rounded-md bg-[#F1F1F1] p-2 text-[#ABAFB1]"
+              >
+                {!ideaDetails?.github_link || ideaDetails?.github_link === ""
+                  ? viewStatus
+                  : ideaDetails?.github_link}
+              </div>
+  
+              <Label htmlFor="otherLinks" className="text-xs font-semibold">
+                Other Links
+              </Label>
+              <div
+                id="otherLinks"
+                className="rounded-md bg-[#F1F1F1] p-2  text-[#ABAFB1]"
+              >
+                {!ideaDetails?.others || ideaDetails?.others === ""
+                  ? viewStatus
+                  : ideaDetails?.others}
+              </div>
+            </div>
+          </div>
+        </DialogContent>
+      </>
+    );
+  }
+  
+  export default Submission2;
+  
\ No newline at end of file
diff --git a/devsoc24-portal-fe/src/components/team/Option.tsx b/devsoc24-portal-fe/src/components/team/Option.tsx
index f4c96a4..6b7ea00 100644
--- a/devsoc24-portal-fe/src/components/team/Option.tsx
+++ b/devsoc24-portal-fe/src/components/team/Option.tsx
@@ -4,8 +4,7 @@ function Choice() {
   return (
     <>
       <DialogContent className="flex min-h-[100px] flex-col items-center justify-center sm:max-w-[425px]">
-        <DialogTitle>Idea submission Closed.</DialogTitle>
-
+        <DialogTitle>Only team leader can submit project.</DialogTitle>
         {/* <div className="flex justify-evenly w-full ">
             <Button type="submit" className="bg-[#458B71] w-[30%]">
               Create Team
diff --git a/devsoc24-portal-fe/src/components/track/TrackComponent.tsx b/devsoc24-portal-fe/src/components/track/TrackComponent.tsx
index bf8b335..5bed16b 100644
--- a/devsoc24-portal-fe/src/components/track/TrackComponent.tsx
+++ b/devsoc24-portal-fe/src/components/track/TrackComponent.tsx
@@ -49,7 +49,7 @@ const tracks = [
 ];
 const TrackComponent = () => {
   return (
-    <div className="trackComponent w-full h-fit md:h-[62vh] overflow-auto rounded-xl bg-white px-6 md:w-[32vw]">
+    <div className="trackComponent w-full h-fit md:h-[115vh] overflow-auto rounded-xl bg-white px-6 md:w-[32vw]">
       <div className="pt-3 font-semibold text-[#45464E]">Track Details</div>
       <div className="trackComponent -z-10 my-6 flex w-full flex-row items-center gap-6 overflow-auto md:flex-col">
         {tracks.map((item, index) => (