47 lines
1.6 KiB
TypeScript
47 lines
1.6 KiB
TypeScript
|
/**
|
||
|
|
* @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 }),
|
||
|
|
},
|
||
|
|
),
|
||
|
|
);
|