feat: current generation 업데이트

frontend/app/(WithNavbar)/layout.tsx

@@ -1,17 +1,12 @@
 import CommonNavbar from "@/components/common/navbar/Navbar";
 import { PropsWithChildren } from "react";
-import { headers } from "next/headers";
 
 interface WithNavbarLayout extends PropsWithChildren {}
 
 const ApplicantPage = ({ children }: WithNavbarLayout) => {
-  const headersList = headers();
-  const header_url = headersList.get("x-url") || "";
-  const [_, __, ___, generation, ____] = header_url.split(/[/?]+/);
-
   return (
     <div className="px-24 min-w-[1280px] flex p-12">
-      <CommonNavbar generation={generation} />
+      <CommonNavbar />
       {children}
     </div>
   );

frontend/app/kanban/[generation]/detail/page.tsx

@@ -52,7 +52,7 @@ const KanbanBoardDetailPage = ({
   return (
     <main className="flex mt-8 overflow-auto pt-12 pl-12">
       <KanbanColumnDetailCard
-        columnIndex={+columnIndex ?? 0}
+        columnIndex={+(columnIndex ?? 0)}
         generation={generation}
         cardId={cardId}
         applicantId={applicantId}

frontend/components/common/navbar/Navbar.tsx

@@ -5,14 +5,12 @@ import NavbarUserInfo from "./UserInfo";
 import { NavbarOperation } from "./NavbarOperation";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
+import { NavbarToggle } from "./NavbarToggle";
 
-interface CommonNavbarProps {
-  generation: string;
-}
-
-const CommonNavbar = ({ generation }: CommonNavbarProps) => {
-  const currentPath = usePathname().split("/")[1];
-  const isShort = currentPath === "kanban";
+const CommonNavbar = () => {
+  const currentPath = usePathname();
+  const isShort = currentPath.split("/")[1] === "kanban";
+  const generation = currentPath.split("/")[2];
 
   return (
     <nav className="flex flex-col transition-all">
@@ -25,10 +23,11 @@ const CommonNavbar = ({ generation }: CommonNavbarProps) => {
         <div>{generation}th</div>
       </Link>
       <div className="flex flex-col gap-8 mt-8 text-xl">
-        {MainNavbar.map((item) => (
+        {MainNavbar(+generation).map((item) => (
           <CommonNavbarCell key={item.type} item={item} />
         ))}
-        <NavbarOperation generation={generation} />
+        <NavbarToggle />
+        <NavbarOperation />
       </div>
       <NavbarUserInfo />
     </nav>

frontend/components/common/navbar/NavbarCell.tsx

@@ -22,6 +22,8 @@ const CommonNavbarCell = ({ item }: CommonNavbarCellProps) => {
   const currentType = currentPath.split("/")[1];
   const isShort = currentType === "kanban";
 
+  const generation = currentPath.split("/")[2];
+
   const linkButtonClassName =
     "flex justify-between p-4 hover:bg-secondary-100 hover:text-white rounded-lg";
 

frontend/components/common/navbar/NavbarOperation.tsx

@@ -3,16 +3,11 @@
 import { useQuery } from "@tanstack/react-query";
 import CommonNavbarCell from "./NavbarCell";
 import { getMyInfo } from "@/src/apis/interview";
+import { usePathname } from "next/navigation";
 
-interface NavbarOperationProps {
-  generation: string;
-  isShort?: boolean;
-}
-
-export const NavbarOperation = ({
-  generation,
-  isShort = false,
-}: NavbarOperationProps) => {
+export const NavbarOperation = () => {
+  const currentPath = usePathname();
+  const generation = currentPath.split("/")[2];
   const { data: userData } = useQuery(["user"], getMyInfo);
   if (!userData) {
     return <div></div>;

frontend/components/common/navbar/NavbarToggle.tsx

@@ -0,0 +1,30 @@
+import { usePathname } from "next/navigation";
+import CommonNavbarCell from "./NavbarCell";
+import { CURRENT_GENERATION } from "@/src/constants";
+
+export const NavbarToggle = () => {
+  const currentPath = usePathname();
+  const selectedGeneration = +currentPath.split("/")[2];
+
+  const isCurrentGeneration = selectedGeneration === CURRENT_GENERATION;
+  const generation = isCurrentGeneration
+    ? CURRENT_GENERATION - 1
+    : CURRENT_GENERATION;
+
+  const short_title = isCurrentGeneration ? "지난 모집" : "현재 모집";
+  const title = isCurrentGeneration
+    ? "지난 신입모집 보기"
+    : "현재 신입모집 보기";
+
+  return (
+    <CommonNavbarCell
+      item={{
+        href: `/kanban/${generation}`,
+        short_title,
+        title,
+        target: "_self",
+        type: "toggle",
+      }}
+    />
+  );
+};

frontend/src/constants/index.ts

@@ -1,4 +1,6 @@
-export const CURRENT_GENERATION = process.env.NEXT_PUBLIC_CURRENT_GENERATION;
+export const CURRENT_GENERATION: number = +(
+  process.env.NEXT_PUBLIC_CURRENT_GENERATION ?? 0
+);
 
 export const MAIN_MENU = [
   {
@@ -33,50 +35,44 @@ export const MAIN_MENU = [
   },
 ] as const;
 
-export const MainNavbar = [
-  {
-    title: "신입모집 신청 페이지",
-    short_title: "신청",
-    type: "apply",
-    target: "_blank",
-    href: `/application`,
-  },
-  {
-    title: "신입모집 칸반보드",
-    short_title: "칸반보드",
-    type: "kanban",
-    target: "none",
-    href: `/kanban/${CURRENT_GENERATION}`,
-  },
-  {
-    title: "신입모집 면접 기록",
-    short_title: "면접기록",
-    type: "interview",
-    target: "none",
-    href: `/interview/${CURRENT_GENERATION}`,
-  },
-  {
-    title: "신입모집 지원현황",
-    short_title: "지원현황",
-    type: "applicant",
-    target: "none",
-    href: `/applicant/${CURRENT_GENERATION}`,
-  },
-  {
-    title: "신입모집 쉐어 포인트",
-    short_title: "쉐어포인트",
-    type: "sharepoint",
-    target: "_blank",
-    href: "https://ejnu.sharepoint.com/sites/msteams_bbf640/Shared%20Documents/Forms/AllItems.aspx?id=%2Fsites%2Fmsteams_bbf640%2FShared%20Documents%2F2023%EB%85%84%2F1%ED%95%99%EA%B8%B0%2F%EC%8B%A0%EC%9E%85%EB%AA%A8%EC%A7%91&p=true&ga=1",
-  },
-  {
-    title: "지난 신입모집",
-    short_title: "지난 모집",
-    type: "history",
-    target: "_blank",
-    href: "https://trello.com/b/ioPTFCHN/2023-econovation-1%ED%95%99%EA%B8%B0-%EC%8B%A0%EC%9E%85%EB%AA%A8%EC%A7%91-tf%ED%8C%80",
-  },
-] as const;
+export const MainNavbar = (generation: number) =>
+  [
+    {
+      title: "신입모집 신청 페이지",
+      short_title: "신청",
+      type: "apply",
+      target: "_blank",
+      href: `/application`,
+    },
+    {
+      title: "신입모집 칸반보드",
+      short_title: "칸반보드",
+      type: "kanban",
+      target: "none",
+      href: `/kanban/${generation}`,
+    },
+    {
+      title: "신입모집 면접 기록",
+      short_title: "면접기록",
+      type: "interview",
+      target: "none",
+      href: `/interview/${generation}`,
+    },
+    {
+      title: "신입모집 지원현황",
+      short_title: "지원현황",
+      type: "applicant",
+      target: "none",
+      href: `/applicant/${generation}`,
+    },
+    {
+      title: "신입모집 쉐어 포인트",
+      short_title: "쉐어포인트",
+      type: "sharepoint",
+      target: "_blank",
+      href: "https://ejnu.sharepoint.com/sites/msteams_bbf640/Shared%20Documents/Forms/AllItems.aspx?id=%2Fsites%2Fmsteams_bbf640%2FShared%20Documents%2F2023%EB%85%84%2F1%ED%95%99%EA%B8%B0%2F%EC%8B%A0%EC%9E%85%EB%AA%A8%EC%A7%91&p=true&ga=1",
+    },
+  ] as const;
 
 export const APPLICANT_KEYS = [
   "field",