Feat: 세션 유지 컴포넌트 추가 및 주석 디자인 다크테마 적용

stores/session-store.ts

@@ -0,0 +1,46 @@
+/**
+ * @file stores/session-store.ts
+ * @description 사용자 세션 상태(마지막 활동 시간)를 관리하는 Zustand 스토어
+ * @remarks
+ * - [레이어] Infrastructure/State
+ * - [데이터 흐름] User Activity -> SessionStore -> LocalStorage
+ * - [연관 파일] session-manager.tsx (Setter), session-timer.tsx (Getter)
+ * - [주의사항] localStorage를 사용하여 탭 간 상태 공유 (partialize 적용)
+ */
+
+import { create } from "zustand";
+import { persist, createJSONStorage } from "zustand/middleware";
+
+/**
+ * 세션 상태 인터페이스
+ */
+interface SessionState {
+  /** 마지막 사용자 활동 시간 (Timestamp) */
+  lastActive: number;
+  /** 활동 시간 갱신 함수 */
+  setLastActive: (time: number) => void;
+}
+
+/**
+ * 세션 관리 스토어 hook
+ * @returns {SessionState} lastActive, setLastActive
+ * @remarks persist 미들웨어를 통해 브라우저 새로고침/재접속 시에도 상태 유지
+ * @see session-manager.tsx - 사용자 활동 감지 시 setLastActive 호출
+ * @see session-timer.tsx - 남은 시간 계산을 위해 lastActive 구독
+ */
+export const useSessionStore = create<SessionState>()(
+  persist(
+    (set) => ({
+      // [State] 초기값: 스토어 생성 시점
+      lastActive: Date.now(),
+
+      // [Action] 활동 시간 업데이트
+      setLastActive: (time) => set({ lastActive: time }),
+    }),
+    {
+      name: "session-storage", // localStorage Key
+      storage: createJSONStorage(() => localStorage), // localStorage 사용
+      partialize: (state) => ({ lastActive: state.lastActive }),
+    },
+  ),
+);