Feat/apply css

src/app/(afterLogin)/_components/pageTitle.tsx

@@ -1,13 +1,14 @@
 "use client";
 
-import { useSelectedLayoutSegments } from "next/navigation";
+import { useRouter, useSelectedLayoutSegments } from "next/navigation";
 import WarningCircleIcon from "@/assets/WarningCircle.svg";
 import MessageBubble from "./messageBubble";
 import { useEffect, useState } from "react";
+import ArrowLeftIcon from "@/assets/ArrowLeft.svg";
 
 export default function PageTitle() {
   const segments = useSelectedLayoutSegments();
-
+  const router = useRouter();
   const [currentSegment, setCurrentSegment] = useState(segments[0]);
   const [isActivateMessage, setIsActivateMessage] = useState(false);
 
@@ -45,12 +46,25 @@ export default function PageTitle() {
     }
   };
 
+  // 뒤로가기 버튼 활성화
+  const isBackButton = () => {
+    if (segments[1]) {
+      return true;
+    }
+    return false;
+  };
+
   return (
     <div className="bg-[#F5F5F5] w-full h-36 relative">
       <div className="absolute bottom-6 left-80 flex flex-row items-center gap-2">
+        {isBackButton() && (
+          <button onClick={() => router.back()} className="absolute -left-8">
+            <ArrowLeftIcon />
+          </button>
+        )}
         <h1 className="font-medium text-4xl">{title()}</h1>
 
-        {currentSegment !== "dashboard" && (
+        {!isBackButton() &&currentSegment !== "dashboard" && (
           <div className="relative flex items-center">
             <div
               onMouseEnter={() => {

src/app/(afterLogin)/_components/protectedPage.tsx

@@ -15,18 +15,29 @@ export default function ProtectedPage({ children }: Props) {
   const { isInitialized, setInitialized, token } = useAuthStore();
   const initializedRef = useRef(false);
 
+  const checkAuth = async () => {
+    if (!token) {
+      await reissue()
+        .then(() => {})
+        .catch(() => {
+          window.location.replace("/login");
+        });
+
+      setInitialized(true);
+    }
+  };
+
   useEffect(() => {
     if (initializedRef.current || isInitialized) return;
     initializedRef.current = true;
-
     const code = searchParams.get("code");
     const signUpRequired = searchParams.get("sign-up-required");
 
+
     const initializeAuth = async () => {
       if (code) {
         try {
           await socialLogin(code);
-
           router.replace("/dashboard", { scroll: false });
         } catch (error) {
           console.error("Social login failed:", error);
@@ -47,15 +58,8 @@ export default function ProtectedPage({ children }: Props) {
       if (token) {
         setInitialized(true);
         return;
-      }
-
-      try {
-        await reissue();
-      } catch (error) {
-        console.error("Reissue failed:", error);
-        window.location.replace("/login");
-      } finally {
-        setInitialized(true);
+      } else {
+        checkAuth();
       }
     };
 

src/app/(afterLogin)/_components/sideNav.tsx

@@ -6,14 +6,16 @@ import CalendarBlank from "@/assets/CalendarBlank.svg";
 import ClipboardText from "@/assets/ClipboardText.svg";
 import House from "@/assets/House.svg";
 import UserInfo from "./userInfo";
-import { usePathname } from "next/navigation";
+import { useSelectedLayoutSegments } from "next/navigation";
 
 export default function SideNavigation({
   setIsModal,
 }: {
   setIsModal: (value: boolean) => void;
 }) {
-  const pathname = usePathname();
+  const segments = useSelectedLayoutSegments();
+  const pathname = segments[0];
+
   return (
     <div className="fixed top-32 left-11 border border-[#FFE8CC] rounded-lg px-10 py-8 flex flex-col items-center bg-white">
       <UserInfo />
@@ -31,17 +33,17 @@ export default function SideNavigation({
         <Link
           href="/dashboard"
           className={`flex flex-row gap-2 items-center ${
-            pathname === "/dashboard" ? "font-bold" : ""
+            pathname === "dashboard" ? "font-bold" : ""
           }`}
         >
           <House />
-          dashboard
+          Dashboard
         </Link>
 
         <Link
           href="/applications"
           className={`flex flex-row gap-2 items-center ${
-            pathname === "/applications" ? "font-bold" : ""
+            pathname === "applications" ? "font-bold" : ""
           }`}
         >
           <BriefCase />
@@ -51,7 +53,7 @@ export default function SideNavigation({
         <Link
           href="/documents"
           className={`flex flex-row gap-2 items-center ${
-            pathname === "/documents" ? "font-bold" : ""
+            pathname === "documents" ? "font-bold" : ""
           }`}
         >
           <ClipboardText />
@@ -61,7 +63,7 @@ export default function SideNavigation({
         <Link
           href="/schedule"
           className={`flex flex-row gap-2 items-center ${
-            pathname === "/schedule" ? "font-bold" : ""
+            pathname === "schedule" ? "font-bold" : ""
           }`}
         >
           <CalendarBlank />

src/app/(afterLogin)/applications/edit/[id]/_components/EditApplication.tsx

@@ -19,7 +19,6 @@ import {
 } from "@/type/applicationType";
 
 export default function EditApplicationsPage({ id }: { id: number }) {
-  // 폼 필드를 위한 상태
   const [companyName, setCompanyName] = useState("");
   const [companyAddress, setCompanyAddress] = useState("");
   const [companyUrl, setCompanyUrl] = useState("");
@@ -37,40 +36,46 @@ export default function EditApplicationsPage({ id }: { id: number }) {
   const [originalApplication, setOriginalApplication] =
     useState<CompanyApplicationWithId | null>(null);
 
-  const { data: documentsData, isLoading, isError } = useDocuments();
+  const { data: documentsData, isLoading, isError } = useDocuments(1);
   const { data, isLoading: isAppLoading } = useFetchApplication(id);
   const { mutateAsync, isPending: isUploadLoading } = useUpdateApplication();
 
   const documents = documentsData?.data.data.content;
   const router = useRouter();
 
-  // 데이터 로드 시 상태 초기화
   useEffect(() => {
-    if (!data) return;
+    if (!data || originalApplication) return; // 초기 한 번만 세팅
 
     const app = data.data.data;
-
     setOriginalApplication(app);
 
-    // 폼 필드 상태 업데이트
     setCompanyName(app.companyName ?? "");
     setCompanyAddress(app.companyAddress ?? "");
     setCompanyUrl(app.companyUrl ?? "");
     setCompanyScale(app.companyScale ?? "");
     setPosition(app.position ?? "");
     setStatus(app.status ?? ApplicationStatus.PLANNED);
 
+    // 지원일
     const apply = app.schedules?.find(
-      (s: { title: string }) => s.title === "지원일"
+      (s: { memo?: string }) => s.memo === "지원일"
     );
+    const applyDateObj = apply?.dateTime ? new Date(apply.dateTime) : null;
+    setApplyDate(isNaN(applyDateObj?.getTime() ?? NaN) ? null : applyDateObj);
+
+    // 마감일
     const deadline = app.schedules?.find(
-      (s: { title: string }) => s.title === "마감일"
+      (s: { memo?: string }) => s.memo === "마감일"
+    );
+    const deadlineDateObj = deadline?.dateTime
+      ? new Date(deadline.dateTime)
+      : null;
+    setDeadlineDate(
+      isNaN(deadlineDateObj?.getTime() ?? NaN) ? null : deadlineDateObj
     );
-    setApplyDate(apply?.dateTime ? new Date(apply.dateTime) : null);
-    setDeadlineDate(deadline?.dateTime ? new Date(deadline.dateTime) : null);
 
     setSelectedDocuments(app.documents ?? []);
-  }, [data]);
+  }, [data, originalApplication]);
 
   // 문서 선택 토글 함수
   const toggleDocument = (doc: { id: number; type: string; title: string }) => {
@@ -124,14 +129,14 @@ export default function EditApplicationsPage({ id }: { id: number }) {
     changedApplication.documents = selectedDocuments;
 
     const applySchedule = changedApplication.schedules.find(
-      (s: { title: string }) => s.title === "지원일"
+      (s: { memo?: string }) => s.memo === "지원일"
     );
     if (applySchedule) {
       applySchedule.dateTime = applyDate ? applyDate.toISOString() : "";
     }
 
     const deadlineSchedule = changedApplication.schedules.find(
-      (s: { title: string }) => s.title === "마감일"
+      (s: { memo?: string }) => s.memo === "마감일"
     );
     if (deadlineSchedule) {
       deadlineSchedule.dateTime = deadlineDate

src/app/(afterLogin)/applications/new/page.tsx

@@ -31,7 +31,7 @@ export default function NewApplicationsPage() {
   const [applyDate, setApplyDate] = useState<Date | null>(null);
   const [deadlineDate, setDeadlineDate] = useState<Date | null>(null);
 
-  const { data, isLoading, isError } = useDocuments();
+  const { data, isLoading, isError } = useDocuments(1);
   const documents = data?.data.data.content;
 
   const { mutateAsync, isPending: isUploadLoading } = useUploadApplications();
@@ -75,13 +75,15 @@ export default function NewApplicationsPage() {
       schedules: [
         {
           id: 0,
-          title: "지원일",
+          title: companyName,
+          memo: "지원일",
           dateTime: applyDate ? applyDate.toISOString() : "",
           status: ScheduleStatus.PLANNED,
         },
         {
           id: 1,
-          title: "마감일",
+          title: companyName,
+          memo: "마감일",
           dateTime: deadlineDate ? deadlineDate.toISOString() : "",
           status: getDeadlineStatus(status),
         },
@@ -192,7 +194,9 @@ export default function NewApplicationsPage() {
       <div className="mt-6 flex flex-row gap-4 w-3xl">
         {/* 지원일 */}
         <div className="flex flex-col w-full gap-2">
-          <label><span className="text-[#FF4D4F]">*</span>지원일</label>
+          <label>
+            <span className="text-[#FF4D4F]">*</span>지원일
+          </label>
           <DatePicker
             locale={ko}
             placeholderText="날짜를 선택해주세요."
@@ -205,7 +209,9 @@ export default function NewApplicationsPage() {
 
         {/* 마감일 */}
         <div className="flex flex-col w-full gap-2">
-          <label><span className="text-[#FF4D4F]">*</span>마감일</label>
+          <label>
+            <span className="text-[#FF4D4F]">*</span>마감일
+          </label>
           <DatePicker
             locale={ko}
             placeholderText="날짜를 선택해주세요."
@@ -264,11 +270,7 @@ export default function NewApplicationsPage() {
                   key={document.id}
                   onClick={() => toggleDocument(document.id)}
                   className={`px-4 py-5 border text-sm text-center flex flex-col justify-center items-center gap-3 rounded-sm cursor-pointer transition
-                    ${
-                      isSelected
-                        ? "border-[#FF9016]"
-                        : "border-[#D9D9D9]"
-                    }`}
+                    ${isSelected ? "border-[#FF9016]" : "border-[#D9D9D9]"}`}
                 >
                   <span className="flex flex-row items-center gap-1 text-[#212121]">
                     <FileIcon />