[Chore] - 마이페이지 및 자격진단 헤더 반영 main 브렌치로 병합

app/eligibility/page.tsx

@@ -1,23 +1,73 @@
 "use client";
 
-import { Suspense, useEffect } from "react";
+import { Suspense, useEffect, useState } from "react";
+import { useRouter } from "next/navigation";
 import { EligibilitySection } from "@/src/widgets/eligibilitySection";
 import { useEligibilityStore } from "@/src/features/eligibility/model/eligibilityStore";
+import { useDiagnosisResultStore } from "@/src/features/eligibility/model/diagnosisResultStore";
+import { getDiagnosisLatest } from "@/src/features/eligibility/api/diagnosisApi";
+import type { DiagnosisLatestData } from "@/src/features/eligibility/api/diagnosisTypes";
+import { Modal } from "@/src/shared/ui/modal/default/modal";
 import { Spinner } from "@/src/shared/ui/spinner/default";
 
 export default function EligibilityPage() {
+  const router = useRouter();
   const reset = useEligibilityStore(state => state.reset);
+  const setDiagnosisResult = useDiagnosisResultStore(s => s.setResult);
+  const [isModalOpen, setIsModalOpen] = useState(false);
 
   useEffect(() => {
-    // 자격진단 페이지 진입 시 store 초기화
-    reset();
-  }, [reset]);
+    let mounted = true;
+
+    const checkLatest = async () => {
+      try {
+        const response = await getDiagnosisLatest<DiagnosisLatestData>();
+        if (!mounted) return;
+        const data = response?.data as DiagnosisLatestData | undefined;
+        if (data != null && typeof data === "object" && "eligible" in data) {
+          setDiagnosisResult(
+            {
+              eligible: data.eligible,
+              decisionMessage: data.diagnosisResult,
+              recommended: data.recommended,
+            },
+            { incomeLevel: data.myIncomeLevel }
+          );
+          setIsModalOpen(true);
+        } else {
+          reset();
+        }
+      } catch {
+        if (mounted) reset();
+      }
+    };
+
+    checkLatest();
+    return () => {
+      mounted = false;
+    };
+  }, [reset, setDiagnosisResult]);
+
+  const handleModalButtonClick = (index: number) => {
+    setIsModalOpen(false);
+    if (index === 0) {
+      setDiagnosisResult(null);
+      reset();
+    } else {
+      router.push("/eligibility/result/final");
+    }
+  };
 
   return (
     <main className="flex h-full flex-col">
       <Suspense fallback={<Spinner title="로딩 중" description="페이지를 불러오는 중입니다." />}>
         <EligibilitySection />
       </Suspense>
+      <Modal
+        type="eligibilityPreviousDiagnosis"
+        open={isModalOpen}
+        onButtonClick={handleModalButtonClick}
+      />
     </main>
   );
 }

app/eligibility/result/final/page.tsx

@@ -0,0 +1,11 @@
+"use client";
+
+import { EligibilityFinalResultSection } from "@/src/widgets/eligibilitySection";
+
+export default function EligibilityFinalResultPage() {
+  return (
+    <main className="flex h-full flex-col">
+      <EligibilityFinalResultSection />
+    </main>
+  );
+}

app/eligibility/result/page.tsx

@@ -0,0 +1,11 @@
+"use client";
+
+import { EligibilityResultSection } from "@/src/widgets/eligibilitySection";
+
+export default function EligibilityResultPage() {
+  return (
+    <main className="flex h-full flex-col">
+      <EligibilityResultSection />
+    </main>
+  );
+}

app/layout.tsx

@@ -8,8 +8,6 @@ import { HomeLandingRender } from "@/src/shared/ui/globalRender/globalRender";
 import { FrameBottomNav } from "@/src/shared/ui/bottomNavigation/frameBottomNavigation";
 import { ClientOnly } from "@/src/shared/ui/clientOnly/clientOnly";
 
-
-
 export const metadata: Metadata = {
   title: "pinhouse",
   description: "pinhosue-fe",
@@ -43,9 +41,7 @@ export default function RootLayout({
                   </ClientOnly>
                 }
               >
-                <ClientOnly>
-                  <div>{children}</div>
-                </ClientOnly>
+                <ClientOnly>{children}</ClientOnly>
               </HomeLandingRender>
             </div>
           </div>

app/mypage/page.tsx

@@ -1,83 +1,7 @@
 "use client";
 
-import { SearchLine } from "@/src/assets/icons/home";
-import FootPrintIcon from "@/src/assets/icons/mypage/footPrintIcon";
-import MapPinIcon from "@/src/assets/icons/mypage/mapPinIcon";
-import RecentIcon from "@/src/assets/icons/mypage/recentIcon";
-import PinsetIcon from "@/src/assets/icons/mypage/pinsetIcon";
-import { MypageSection, UserInfoCard, PinReportSection } from "@/src/features/mypage/ui";
-import { useRouter } from "next/navigation";
-import { useOAuthStore } from "@/src/features/login/model/authStore";
-
+import { MypageSection } from "@/src/widgets/mypageSection";
 
 export default function MypagePage() {
-    const { userName } = useOAuthStore();
-    const imageUrl = null;
-    const router = useRouter();
-    return (
-        <div className="flex flex-col min-h-screen gap-5 px-5 pb-6 bg-greyscale-grey-25">
-            {/* 사용자 정보 카드 */}
-            <UserInfoCard 
-                imageUrl={imageUrl}
-                userName={userName}
-                userEmail="백엔드에서이메일정보전달필요@naver.com"
-                onSettingsClick={() => {
-                    router.push("/mypage/settings");
-                }}
-            />
-
-            {/* 핀 보고서 섹션 */}
-            <PinReportSection
-                onDiagnosisClick={() => {
-                    router.push("/eligibility");
-                }}
-            />
-
-            {/* 내 정보 섹션 */}
-            <MypageSection
-                title="내 정보"
-                items={[
-                    {
-                        icon: <FootPrintIcon />,
-                        label: "관심 주변 환경 설정",
-                        onClick: () => {
-                            alert("관심 주변 환경 설정 미구현 상태");
-                            // TODO: 네비게이션 구현
-                        },
-                    },
-                    {
-                        icon: <MapPinIcon />,
-                        label: "핀포인트 설정",
-                        onClick: () => {
-                            router.push("/mypage/pinpoints");
-                        },
-                    },
-                ]}
-            />
-
-            {/* 내 활동 섹션 */}
-            <MypageSection
-                title="내 활동"
-                items={[
-                    {
-                        icon: <PinsetIcon />,
-                        label: "저장 목록",
-                        onClick: () => {
-                            alert("저장 목록 이동 미구현 상태");
-                            // TODO: 네비게이션 구현
-                        },
-                    },
-                    {
-                        icon: <RecentIcon />,
-                        label: "최근 본 공고",
-                        onClick: () => {
-                            alert("최근 본 공고 이동 미구현 상태");
-                            // TODO: 네비게이션 구현
-                        },
-                    },
-                ]}
-            />
-        </div>
-    );
+  return <MypageSection />;
 }
-

app/mypage/pinpoints/page.tsx

@@ -1,50 +1,7 @@
 "use client";
 
-import { MapPin } from "@/src/assets/icons/onboarding";
-import { useAddressStore } from "@/src/entities/address";
-import { AddressSearch } from "@/src/features/addressSearch";
-import { useAddPinpoint } from "@/src/features/mypage/hooks/useAddPinpoint";
-import { Button } from "@/src/shared/lib/headlessUi";
-import { useRouter } from "next/navigation";
+import { PinpointsSection } from "@/src/widgets/mypageSection";
 
-const MypagePinpointsPage = () => {
-  const title = "핀포인트 설정";
-  const description = "나만의 핀포인트를 찍고\n원하는 거리 안의 임재주택을 찾아보세요!";
-  const image = <MapPin />;
-  const { address, pinPoint } = useAddressStore();
-  const router = useRouter();
-  const { addPinpoint, isLoading, isError, error } = useAddPinpoint({
-    onSuccess: () => {
-      router.push("/mypage/settings"); // 주소 선택 후 이전 화면으로
-      // 또는 목록 새로고침 등
-    },
-    onError: err => {
-      // 토스트 등 에러 처리
-    },
-  });
-  return (
-    <div className="p-5">
-      <div className="mb-3 flex flex-[1] flex-col items-center justify-start text-center">
-        <div className="inline-flex sm:min-w-[200px] sm:max-w-[250px] md:min-w-[250px] md:max-w-[300px] lg:min-w-[280px] lg:max-w-[340px]">
-          {image}
-        </div>
-        {title && <h2 className="text-lg font-bold">{title}</h2>}
-        <p className="mt-1 whitespace-pre-line text-center text-sm text-gray-500">{description}</p>
-        <div className="mt-5 w-full">
-          <AddressSearch />
-        </div>
-      </div>
-      {address ? (
-        <Button
-          size={"md"}
-          variant={"solid"}
-          onClick={() => addPinpoint({ address, name: pinPoint || "핀 포인트", first: true })}
-        >
-          핀포인트 추가
-        </Button>
-      ) : null}
-    </div>
-  );
-};
-
-export default MypagePinpointsPage;
+export default function MypagePinpointsPage() {
+  return <PinpointsSection />;
+}

app/mypage/profile/page.tsx

@@ -1,26 +1,7 @@
 "use client";
 
-import { ProfileForm } from "@/src/features/mypage/ui/profileForm";
-import { LeftButton } from "@/src/assets/icons/button/leftButton";
-import { useRouter } from "next/navigation";
-import { useOAuthStore } from "@/src/features/login/model/authStore";
+import { ProfileSection } from "@/src/widgets/mypageSection";
 
 export default function ProfilePage() {
-  const { userName } = useOAuthStore();
-
-  // TODO: 로그인 시 or 프로필 조회 API로 실제 사용자 이메일, Provider 정보 필요
-  const initialEmail = "로그인할때or프로필조회API로이메일_필요@naver.com"; // 예시
-  const initialProvider = "kakao" as const;
-  return (
-    <div className="flex min-h-screen flex-col bg-white">
-      {/* 프로필 폼 */}
-      <div className="px-5 py-6">
-        <ProfileForm
-          initialNickname={userName}
-          initialEmail={initialEmail}
-          initialProvider={initialProvider}
-        />
-      </div>
-    </div>
-  );
+  return <ProfileSection />;
 }

app/mypage/settings/page.tsx

@@ -1,35 +1,7 @@
 "use client";
 
-import Link from "next/link";
-import { logout } from "@/src/features/login/utils/logout";
+import { SettingsSection } from "@/src/widgets/mypageSection";
 
 export default function MypageSettingsPage() {
-  return (
-    <div className="flex min-h-screen flex-col bg-white px-5">
-      <div className="flex flex-col">
-        <Link
-          href="/mypage/profile"
-          className="font-regular block w-full px-5 py-3 text-base leading-[140%] tracking-[-0.02em] text-greyscale-grey-900 hover:no-underline"
-        >
-          프로필 설정
-        </Link>
-        <div className="-mx-[20px] h-[9px] border-t border-greyscale-grey-50 bg-greyscale-grey-25"></div>
-
-        <button
-          type="button"
-          onClick={logout}
-          className="font-regular block w-full px-5 py-3 text-left text-base leading-[140%] tracking-[-0.02em] text-greyscale-grey-900"
-        >
-          로그아웃
-        </button>
-
-        <Link
-          href="/mypage/withdraw"
-          className="font-regular block w-full px-5 py-3 text-base leading-[140%] tracking-[-0.02em] text-greyscale-grey-900 hover:no-underline"
-        >
-          회원 탈퇴
-        </Link>
-      </div>
-    </div>
-  );
+  return <SettingsSection />;
 }

app/mypage/withdraw/page.tsx

@@ -1,25 +1,7 @@
 "use client";
 
-import { WithdrawForm } from "@/src/features/mypage/ui/withdrawForm";
-import { WithdrawBanner } from "@/src/features/mypage/ui";
+import { WithdrawSection } from "@/src/widgets/mypageSection";
 
 export default function WithdrawPage() {
-  return (
-    <div className="flex min-h-screen flex-col bg-white">
-      {/* 상단 아이콘 및 문구 */}
-      <WithdrawBanner
-        className="py-6"
-        title="그동안 핀하우스를 이용해 주셔서 감사합니다."
-        description="탈퇴 사유를 알려주시면 서비스 개선에 참고하겠습니다."
-      />
-
-      {/* 구분선 */}
-      <div className="mb-7 h-[9px] w-full border border-greyscale-grey-50 bg-greyscale-grey-25" />
-
-      {/* 탈퇴 폼 */}
-      <div className="px-5">
-        <WithdrawForm />
-      </div>
-    </div>
-  );
+  return <WithdrawSection />;
 }