From d22466ec2327ecbd0ecac8a09081bb3face00bd5 Mon Sep 17 00:00:00 2001
From: caadiq <caadiq@gmail.com>
Date: Sat, 10 Jan 2026 09:46:38 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20=EA=B0=80=EC=83=81=20=EC=8A=A4=ED=81=AC?=
 =?UTF-8?q?=EB=A1=A4=20=EB=8F=99=EC=A0=81=20=EB=86=92=EC=9D=B4=20=EC=A7=80?=
 =?UTF-8?q?=EC=9B=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- measureElement와 data-index 사용으로 각 아이템 실제 높이 측정
- 고정 높이(h-[120px]) 제거하여 내용에 맞게 자동 조절
---
 frontend/src/pages/pc/public/Schedule.jsx | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/frontend/src/pages/pc/public/Schedule.jsx b/frontend/src/pages/pc/public/Schedule.jsx
index 93b81ad..21de495 100644
--- a/frontend/src/pages/pc/public/Schedule.jsx
+++ b/frontend/src/pages/pc/public/Schedule.jsx
@@ -43,7 +43,7 @@ function Schedule() {
     const [searchInput, setSearchInput] = useState('');
     const [searchTerm, setSearchTerm] = useState('');
     const SEARCH_LIMIT = 20; // 페이지당 20개
-    const ITEM_HEIGHT = 136; // 각 아이템 높이 (120px) + 간격 (16px)
+    const ESTIMATED_ITEM_HEIGHT = 120; // 아이템 추정 높이 (동적 측정)
     
     // Intersection Observer for infinite scroll
     const { ref: loadMoreRef, inView } = useInView({
@@ -289,11 +289,11 @@ function Schedule() {
             });
     }, [schedules, selectedDate, currentYearMonth, selectedCategories, isSearchMode, searchTerm, searchResults]);
 
-    // 가상 스크롤 설정 (검색 모드에서만 활성화)
+    // 가상 스크롤 설정 (검색 모드에서만 활성화, 동적 높이 지원)
     const virtualizer = useVirtualizer({
         count: isSearchMode && searchTerm ? filteredSchedules.length : 0,
         getScrollElement: () => scrollContainerRef.current,
-        estimateSize: () => ITEM_HEIGHT,
+        estimateSize: () => ESTIMATED_ITEM_HEIGHT,
         overscan: 5, // 버퍼 아이템 수
     });
 
@@ -834,7 +834,7 @@ function Schedule() {
                                     <>
                                         <div
                                             style={{
-                                                height: `${virtualizer.getTotalSize() - 16}px`,
+                                                height: `${virtualizer.getTotalSize()}px`,
                                                 width: '100%',
                                                 position: 'relative',
                                             }}
@@ -850,19 +850,20 @@ function Schedule() {
                                                 return (
                                                     <div
                                                         key={virtualItem.key}
+                                                        ref={virtualizer.measureElement}
+                                                        data-index={virtualItem.index}
                                                         style={{
                                                             position: 'absolute',
                                                             top: 0,
                                                             left: 0,
                                                             width: '100%',
-                                                            height: `${virtualItem.size}px`,
                                                             transform: `translateY(${virtualItem.start}px)`,
                                                         }}
                                                     >
                                                         <div className={virtualItem.index < filteredSchedules.length - 1 ? "pb-4" : ""}>
                                                             <div
                                                                 onClick={() => handleScheduleClick(schedule)}
-                                                                className="flex items-stretch bg-white rounded-2xl shadow-sm hover:shadow-md transition-shadow overflow-hidden cursor-pointer h-[120px]"
+                                                                className="flex items-stretch bg-white rounded-2xl shadow-sm hover:shadow-md transition-shadow overflow-hidden cursor-pointer"
                                                             >
                                                             {/* 날짜 영역 */}
                                                             <div