From bc366411c2f3a02a53b5d8b97b60c8a3587fb162 Mon Sep 17 00:00:00 2001
From: manNomi <hanmw110@naver.com>
Date: Tue, 27 Jan 2026 01:39:32 +0900
Subject: [PATCH 1/2] =?UTF-8?q?fix:=20=EB=8C=80=ED=95=99=20=ED=8E=98?=
 =?UTF-8?q?=EC=9D=B4=EC=A7=80=20=EC=8A=A4=ED=81=AC=EB=A1=A4=20=EB=B0=8F=20?=
 =?UTF-8?q?=EA=B2=80=EC=83=89=20=EB=A1=9C=EC=A7=81=20=EC=88=98=EC=A0=95=20?=
 =?UTF-8?q?=EB=B0=8F=20=EB=A9=98=ED=86=A0=20=ED=8E=98=EC=9D=B4=EC=A7=80=20?=
 =?UTF-8?q?=EB=AC=B4=ED=95=9C=20=EC=8A=A4=ED=94=BC=EB=84=88=20=EB=B2=84?=
 =?UTF-8?q?=EA=B7=B8=20=ED=95=B4=EA=B2=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 대학 목록 가상화 제거 및 전체 페이지 스크롤 적용
- 검색바 스티키 고정 및 검색 시 현재 경로 유지하도록 수정
- authStore 초기화(hydration) 후 isInitialized 상태 업데이트 로직 추가
- 대학 페이지 레이아웃 및 문구 수정
---
 apps/web/src/app/university/SearchBar.tsx     | 10 +--
 .../SearchResultsContent.tsx                  |  2 +-
 .../list/[homeUniversityName]/page.tsx        |  4 +-
 apps/web/src/app/university/page.tsx          | 23 ++++---
 .../university/UniversityCards/index.tsx      | 63 ++-----------------
 apps/web/src/lib/zustand/useAuthStore.ts      |  6 ++
 6 files changed, 31 insertions(+), 77 deletions(-)

diff --git a/apps/web/src/app/university/SearchBar.tsx b/apps/web/src/app/university/SearchBar.tsx
index 074ea073..bfd12b6d 100644
--- a/apps/web/src/app/university/SearchBar.tsx
+++ b/apps/web/src/app/university/SearchBar.tsx
@@ -1,7 +1,7 @@
 "use client";
 
 import { zodResolver } from "@hookform/resolvers/zod";
-import { useRouter } from "next/navigation";
+import { usePathname, useRouter } from "next/navigation";
 import { type SubmitHandler, useForm } from "react-hook-form";
 import { z } from "zod";
 
@@ -27,6 +27,7 @@ interface SearchBarProps {
 // --- 폼 로직을 관리하는 부모 컴포넌트 ---
 const SearchForm = ({ initText }: SearchBarProps) => {
   const router = useRouter();
+  const pathname = usePathname();
 
   const {
     register,
@@ -48,12 +49,13 @@ const SearchForm = ({ initText }: SearchBarProps) => {
 
     const queryString = queryParams.toString();
 
-    router.push(`/university?${queryString}`);
+    // 현재 경로에서 쿼리 파라미터만 업데이트
+    router.push(`${pathname}?${queryString}`);
   };
 
   return (
-    <form onSubmit={handleSubmit(onSubmit)} className="w-full">
-      <div className="relative mb-2">
+    <form onSubmit={handleSubmit(onSubmit)} className="sticky top-14 z-10 w-full bg-white pb-2">
+      <div className="relative">
         <input
           type="text"
           placeholder={"대학명을 검색해보세요..."}
diff --git a/apps/web/src/app/university/list/[homeUniversityName]/SearchResultsContent.tsx b/apps/web/src/app/university/list/[homeUniversityName]/SearchResultsContent.tsx
index a33355a7..8bba124d 100644
--- a/apps/web/src/app/university/list/[homeUniversityName]/SearchResultsContent.tsx
+++ b/apps/web/src/app/university/list/[homeUniversityName]/SearchResultsContent.tsx
@@ -83,7 +83,7 @@ const SearchResultsContentInner = ({ homeUniversityName }: SearchResultsContentI
   }, [searchParams]);
 
   return (
-    <div className="pt-4">
+    <div>
       <SearchBar initText={searchText || undefined} />
 
       {/* 지역 필터 */}
diff --git a/apps/web/src/app/university/list/[homeUniversityName]/page.tsx b/apps/web/src/app/university/list/[homeUniversityName]/page.tsx
index 8d1e550f..3c370544 100644
--- a/apps/web/src/app/university/list/[homeUniversityName]/page.tsx
+++ b/apps/web/src/app/university/list/[homeUniversityName]/page.tsx
@@ -49,9 +49,7 @@ const UniversityListPage = async ({ params }: PageProps) => {
   return (
     <>
       <TopDetailNavigation title={`${universityName} 파견학교`} />
-      <div className="mt-14 w-full px-5">
-        <SearchResultsContent homeUniversityName={universityName} />
-      </div>
+      <SearchResultsContent homeUniversityName={universityName} />
     </>
   );
 };
diff --git a/apps/web/src/app/university/page.tsx b/apps/web/src/app/university/page.tsx
index cb02aa6e..6bfa923b 100644
--- a/apps/web/src/app/university/page.tsx
+++ b/apps/web/src/app/university/page.tsx
@@ -19,18 +19,17 @@ const UniversityOnboardingPage = () => {
   return (
     <>
       <TopDetailNavigation title="대학교 선택" />
-      <div className="mt-14 w-full px-5 py-6">
-        <h1 className="mb-2 text-k-800 typo-bold-1">파견 대학교를 선택해주세요</h1>
-        <p className="mb-6 text-k-500 typo-medium-4">
-          소속 대학교를 선택하면 해당 대학교의 교환학생 파견 정보를 확인할 수 있습니다.
-        </p>
-
-        <div className="flex flex-col gap-2.5">
-          {HOME_UNIVERSITIES.map((university) => (
-            <Link key={university.slug} href={`/university/list/${university.slug}`} className="block">
-              <div className="relative h-[91px] w-full overflow-hidden rounded-lg border border-solid border-k-100 hover:-translate-y-0.5 hover:shadow-md hover:shadow-black/10">
-                <div className="flex justify-between px-5 py-3.5">
-                  <div className="flex gap-[23.5px]">
+      <div className="mt-14 w-full px-5">
+      <h1 className="mb-2 text-k-800 typo-bold-1">출신 학교 정보를 선택해주세요</h1>
+      <p className="mb-6 text-k-500 typo-medium-4">
+        해당 학교에서 제공되는 교환학생 파견 정보를 확인할 수 있습니다.
+      </p>
+      <div className="flex flex-col gap-2.5">
+        {HOME_UNIVERSITIES.map((university) => (
+          <Link key={university.slug} href={`/university/list/${university.slug}`} className="block">
+            <div className="relative h-[91px] w-full overflow-hidden rounded-lg border border-solid border-k-100 hover:-translate-y-0.5 hover:shadow-md hover:shadow-black/10">
+              <div className="flex justify-between px-5 py-3.5">
+                <div className="flex gap-[23.5px]">
                     <div className="flex flex-shrink-0 items-center">
                       <Image
                         src={university.imageUrl}
diff --git a/apps/web/src/components/university/UniversityCards/index.tsx b/apps/web/src/components/university/UniversityCards/index.tsx
index 81b48417..914d46e7 100644
--- a/apps/web/src/components/university/UniversityCards/index.tsx
+++ b/apps/web/src/components/university/UniversityCards/index.tsx
@@ -1,9 +1,6 @@
 "use client";
 
-import { useVirtualizer } from "@tanstack/react-virtual";
-
 import clsx from "clsx";
-import { useRef } from "react";
 
 import type { ListUniversity } from "@/types/university";
 import UniversityCard from "../../ui/UniverSityCard";
@@ -13,69 +10,21 @@ type UniversityCardsProps = {
   style?: React.CSSProperties;
   className?: string;
   showCapacity?: boolean;
-  enableVirtualization?: boolean;
 };
 
-const ITEM_HEIGHT = 101;
-
 const UniversityCards = ({
   colleges,
   style,
   className,
   showCapacity = true,
-  enableVirtualization = true,
 }: UniversityCardsProps) => {
-  // 훅은 항상 컴포넌트 상단에서 호출해야 함 (React Hooks 규칙)
-  const parentRef = useRef<HTMLDivElement>(null);
-
-  const virtualizer = useVirtualizer({
-    count: colleges.length,
-    getScrollElement: () => parentRef.current,
-    estimateSize: () => ITEM_HEIGHT,
-    overscan: 5,
-  });
-
-  // 가상화가 비활성화된 경우 일반 렌더링
-  if (!enableVirtualization) {
-    return (
-      <div className={clsx("flex flex-col gap-2.5", className)} style={style}>
-        {colleges.map((college) => (
-          <div key={college.id} className="pb-2.5">
-            <UniversityCard university={college} showCapacity={showCapacity} />
-          </div>
-        ))}
-      </div>
-    );
-  }
-
-  // 가상화 사용
   return (
-    <div ref={parentRef} className={clsx("h-[calc(100vh-200px)] overflow-auto", className)} style={style}>
-      <div
-        style={{
-          height: `${virtualizer.getTotalSize()}px`,
-          width: "100%",
-          position: "relative",
-        }}
-      >
-        {virtualizer.getVirtualItems().map((virtualItem) => (
-          <div
-            key={colleges[virtualItem.index].id}
-            style={{
-              position: "absolute",
-              top: 0,
-              left: 0,
-              width: "100%",
-              height: `${virtualItem.size}px`,
-              transform: `translateY(${virtualItem.start}px)`,
-            }}
-          >
-            <div className="pb-2.5">
-              <UniversityCard university={colleges[virtualItem.index]} showCapacity={showCapacity} />
-            </div>
-          </div>
-        ))}
-      </div>
+    <div className={clsx("flex flex-col gap-2.5", className)} style={style}>
+      {colleges.map((college) => (
+        <div key={college.id} className="pb-2.5">
+          <UniversityCard university={college} showCapacity={showCapacity} />
+        </div>
+      ))}
     </div>
   );
 };
diff --git a/apps/web/src/lib/zustand/useAuthStore.ts b/apps/web/src/lib/zustand/useAuthStore.ts
index 2cbdc397..e7de5c47 100644
--- a/apps/web/src/lib/zustand/useAuthStore.ts
+++ b/apps/web/src/lib/zustand/useAuthStore.ts
@@ -63,6 +63,12 @@ const useAuthStore = create<AuthState>()(
         accessToken: state.accessToken,
         isAuthenticated: state.isAuthenticated,
       }),
+      onRehydrateStorage: () => (state) => {
+        // hydration 완료 후 isInitialized를 true로 설정
+        if (state) {
+          state.isInitialized = true;
+        }
+      },
     },
   ),
 );

From 57559f1aef336b1fa7cac4965a44891bdfae104e Mon Sep 17 00:00:00 2001
From: manNomi <hanmw110@naver.com>
Date: Tue, 27 Jan 2026 01:44:30 +0900
Subject: [PATCH 2/2] =?UTF-8?q?fix:=20university=20cards=20prop=20?=
 =?UTF-8?q?=EC=A0=9C=EA=B1=B0=20=EB=B0=8F=20lint=20=EC=9E=90=EB=8F=99=20?=
 =?UTF-8?q?=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- university list에서 제거된 enable virtualization prop 사용 제거
- biome lint 자동 수정 적용
---
 .../app/(home)/_ui/UniversityList/index.tsx    |  2 +-
 apps/web/src/app/university/page.tsx           | 18 ++++++++----------
 .../university/UniversityCards/index.tsx       |  7 +------
 3 files changed, 10 insertions(+), 17 deletions(-)

diff --git a/apps/web/src/app/(home)/_ui/UniversityList/index.tsx b/apps/web/src/app/(home)/_ui/UniversityList/index.tsx
index 6a891221..5722b8ab 100644
--- a/apps/web/src/app/(home)/_ui/UniversityList/index.tsx
+++ b/apps/web/src/app/(home)/_ui/UniversityList/index.tsx
@@ -47,7 +47,7 @@ const UniversityList = ({ allRegionsUniversityList }: UniversityListProps) => {
           background: "white",
         }}
       />
-      <UniversityCards colleges={previewUniversities} showCapacity={false} enableVirtualization={false} />
+      <UniversityCards colleges={previewUniversities} showCapacity={false} />
     </div>
   );
 };
diff --git a/apps/web/src/app/university/page.tsx b/apps/web/src/app/university/page.tsx
index 6bfa923b..325d4d12 100644
--- a/apps/web/src/app/university/page.tsx
+++ b/apps/web/src/app/university/page.tsx
@@ -20,16 +20,14 @@ const UniversityOnboardingPage = () => {
     <>
       <TopDetailNavigation title="대학교 선택" />
       <div className="mt-14 w-full px-5">
-      <h1 className="mb-2 text-k-800 typo-bold-1">출신 학교 정보를 선택해주세요</h1>
-      <p className="mb-6 text-k-500 typo-medium-4">
-        해당 학교에서 제공되는 교환학생 파견 정보를 확인할 수 있습니다.
-      </p>
-      <div className="flex flex-col gap-2.5">
-        {HOME_UNIVERSITIES.map((university) => (
-          <Link key={university.slug} href={`/university/list/${university.slug}`} className="block">
-            <div className="relative h-[91px] w-full overflow-hidden rounded-lg border border-solid border-k-100 hover:-translate-y-0.5 hover:shadow-md hover:shadow-black/10">
-              <div className="flex justify-between px-5 py-3.5">
-                <div className="flex gap-[23.5px]">
+        <h1 className="mb-2 text-k-800 typo-bold-1">출신 학교 정보를 선택해주세요</h1>
+        <p className="mb-6 text-k-500 typo-medium-4">해당 학교에서 제공되는 교환학생 파견 정보를 확인할 수 있습니다.</p>
+        <div className="flex flex-col gap-2.5">
+          {HOME_UNIVERSITIES.map((university) => (
+            <Link key={university.slug} href={`/university/list/${university.slug}`} className="block">
+              <div className="relative h-[91px] w-full overflow-hidden rounded-lg border border-solid border-k-100 hover:-translate-y-0.5 hover:shadow-md hover:shadow-black/10">
+                <div className="flex justify-between px-5 py-3.5">
+                  <div className="flex gap-[23.5px]">
                     <div className="flex flex-shrink-0 items-center">
                       <Image
                         src={university.imageUrl}
diff --git a/apps/web/src/components/university/UniversityCards/index.tsx b/apps/web/src/components/university/UniversityCards/index.tsx
index 914d46e7..16905aa1 100644
--- a/apps/web/src/components/university/UniversityCards/index.tsx
+++ b/apps/web/src/components/university/UniversityCards/index.tsx
@@ -12,12 +12,7 @@ type UniversityCardsProps = {
   showCapacity?: boolean;
 };
 
-const UniversityCards = ({
-  colleges,
-  style,
-  className,
-  showCapacity = true,
-}: UniversityCardsProps) => {
+const UniversityCards = ({ colleges, style, className, showCapacity = true }: UniversityCardsProps) => {
   return (
     <div className={clsx("flex flex-col gap-2.5", className)} style={style}>
       {colleges.map((college) => (