feat: 마이페이지 스크롤 위치 저장

src/components/MyPage/CombinationDetailView.tsx

@@ -44,6 +44,7 @@ interface CombinationDetailViewProps {
   onSelectAll: (deviceIds: number[]) => void;
   onSelectDevice: (deviceId: number) => void;
   onTrashClick: () => void;
+  onSaveScrollBeforeNavigate: () => void;
 }
 
 const CombinationDetailView = ({
@@ -61,6 +62,7 @@ const CombinationDetailView = ({
   onSelectAll,
   onSelectDevice,
   onTrashClick,
+  onSaveScrollBeforeNavigate,
 }: CombinationDetailViewProps) => {
   const navigate = useNavigate();
   const [hoveredStarComboId, setHoveredStarComboId] = useState<number | null>(null);
@@ -194,6 +196,7 @@ const CombinationDetailView = ({
           <button
             onClick={(e) => {
               e.stopPropagation();
+              onSaveScrollBeforeNavigate();
               navigate('/devices');
             }}
             className="cursor-pointer hover:opacity-80"

src/components/MyPage/CombinationList.tsx

@@ -36,6 +36,7 @@ interface CombinationListProps {
   handleBackToNormal: () => void;
   handleTogglePin: (e: React.MouseEvent, comboId: number) => void;
   handleTrashClick: () => void;
+  handleSaveScrollBeforeNavigate: () => void;
 }
 
 const CombinationList = ({
@@ -60,6 +61,7 @@ const CombinationList = ({
   handleBackToNormal,
   handleTogglePin,
   handleTrashClick,
+  handleSaveScrollBeforeNavigate,
 }: CombinationListProps) => {
   // Lazy Loading: 초기 12개, 더 보기 클릭 시 12개씩 추가
   const INITIAL_DISPLAY_COUNT = 12;
@@ -219,6 +221,7 @@ const CombinationList = ({
                   onSelectAll={deviceSelection.handleSelectAll}
                   onSelectDevice={deviceSelection.handleSelectDevice}
                   onTrashClick={handleTrashClick}
+                  onSaveScrollBeforeNavigate={handleSaveScrollBeforeNavigate}
                 />
               ) : (
                 /* 일반 모드 */

src/components/MyPage/EmptyCombinationCard.tsx

@@ -134,6 +134,7 @@ const EmptyCombinationCard = ({
         <button
           onClick={(e) => {
             e.stopPropagation();
+            sessionStorage.setItem('mypage-scroll', window.scrollY.toString());
             navigate('/devices');
           }}
           className="cursor-pointer hover:opacity-80"

src/pages/my/MyPage.tsx

@@ -86,6 +86,19 @@ const MyPage = () => {
     return () => mediaQuery.removeEventListener('change', handleChange);
   }, []);
 
+  // 페이지 마운트 시 sessionStorage에서 스크롤 위치 복원
+  useEffect(() => {
+    const savedScroll = sessionStorage.getItem('mypage-scroll');
+    if (savedScroll) {
+      const scrollPosition = parseInt(savedScroll, 10);
+      // 약간의 지연을 두어 DOM이 완전히 렌더링된 후 스크롤
+      setTimeout(() => {
+        window.scrollTo(0, scrollPosition);
+      }, 0);
+      sessionStorage.removeItem('mypage-scroll');
+    }
+  }, []);
+
   // 드롭다운 외부 클릭 시 닫기
   const handleClickOutside = useCallback(() => setOpenMenuIndex(null), []);
   useClickOutside(menuRef, handleClickOutside);
@@ -208,6 +221,11 @@ const MyPage = () => {
     window.scrollTo({ top: 0, behavior: 'smooth' });
   }, []);
 
+  // 자세히보기에서 + 버튼 클릭 시: 이미 저장된 스크롤 위치를 sessionStorage에 저장
+  const handleSaveScrollBeforeNavigate = useCallback(() => {
+    sessionStorage.setItem('mypage-scroll', savedScrollPosition.toString());
+  }, [savedScrollPosition]);
+
   return (
     <div className={`min-h-screen bg-white relative ${isAtBottom ? 'bg-effect-fade-bottom' : ''}`}>
       <GNB />
@@ -270,6 +288,7 @@ const MyPage = () => {
             handleBackToNormal={handleBackToNormal}
             handleTogglePin={handleTogglePin}
             handleTrashClick={handleTrashClick}
+            handleSaveScrollBeforeNavigate={handleSaveScrollBeforeNavigate}
           />
 
           {/* Top Button */}