배포를 위한 pr

src/api/team.ts

@@ -6,6 +6,7 @@ import {
   TEAMS_RECRUITMENTS_URL,
   MEMBER_URL,
   TEAMS_APPLICATION_URL,
+  TEAMS_STATUS_URL,
 } from '../constants/endpoint';
 import type { TeamResponse, MemberResponse } from '../types/api/team';
 import type { PostDetailResponse } from '../types/api/posts';
@@ -73,3 +74,11 @@ export const DeleteTeamMember = async (memberId: number) => {
   const { data } = await axiosInstance.delete(MEMBER_URL(memberId));
   return data;
 };
+
+// 팀 상태 변경
+export const patchTeamStatus = async (teamId: number, status: string) => {
+  const { data } = await axiosInstance.patch(TEAMS_STATUS_URL(teamId), {
+    status,
+  });
+  return data;
+};

src/components/Modal/TeamStatusModal.tsx

@@ -0,0 +1,50 @@
+import BaseButton from '../common/Button';
+
+// Modal
+import { useModal } from '../../hooks/useModal';
+import type { ModalProps } from '../../types/modal';
+import ModalOverlay from './ModalOverlay';
+import ModalPortal from './ModalPortal';
+
+const TeamStatusModal = ({ isOpen, onClose, handleDone }: ModalProps) => {
+  useModal({ isOpen, onClose });
+  if (!isOpen) return null;
+
+  return (
+    <ModalPortal>
+      <div
+        className="fixed inset-0 z-50 flex items-center justify-center"
+        role="dialog"
+        aria-modal="true"
+      >
+        <ModalOverlay onClose={onClose} />
+        <div className="relative h-[24.7rem] w-[48.8rem] rounded-[1.492rem] bg-black-5 pt-[6.4rem]">
+          <div className="flex flex-col items-center gap-[3.2rem]">
+            <span className="text-[2.2rem] font-bold text-black-100">
+              정말 팀 활동을 마무리할까요?
+            </span>
+            <div className="flex gap-[1.2rem]">
+              <BaseButton
+                size="lg"
+                color="secondary"
+                className="w-[16.1rem]"
+                onClick={onClose}
+              >
+                취소
+              </BaseButton>
+              <BaseButton
+                size="lg"
+                className="w-[16.1rem]"
+                onClick={handleDone}
+              >
+                완료
+              </BaseButton>
+            </div>
+          </div>
+        </div>
+      </div>
+    </ModalPortal>
+  );
+};
+
+export default TeamStatusModal;

src/components/Team/TeamNav.tsx

@@ -9,7 +9,7 @@ const TeamNav = () => {
     { label: '메인 홈', to: `/team/${teamId}` },
     { label: '모집글 관리', to: `/team/${teamId}/recruitments` },
     { label: '지원자 관리', to: '/' },
-    { label: '팀 상태 관리', to: '/' },
+    { label: '팀 상태 관리', to: `/team/${teamId}/status` },
   ] as const;
 
   return (