/** * @file useChatOverlay.ts * @description Hook for managing the global chat overlay state */ import { useState, useEffect, useCallback } from "react"; interface ChatOverlayState { isOpen: boolean; isMinimized: boolean; } interface UseChatOverlayResult extends ChatOverlayState { open: () => void; close: () => void; minimize: () => void; expand: () => void; toggle: () => void; toggleMinimize: () => void; } const STORAGE_KEY = "chatOverlayState"; const DEFAULT_STATE: ChatOverlayState = { isOpen: false, isMinimized: false, }; /** * Load state from localStorage */ function loadState(): ChatOverlayState { if (typeof window === "undefined") { return DEFAULT_STATE; } try { const stored = window.localStorage.getItem(STORAGE_KEY); if (stored) { return JSON.parse(stored) as ChatOverlayState; } } catch (error) { console.warn("Failed to load chat overlay state from localStorage:", error); } return DEFAULT_STATE; } /** * Save state to localStorage */ function saveState(state: ChatOverlayState): void { if (typeof window === "undefined") { return; } try { window.localStorage.setItem(STORAGE_KEY, JSON.stringify(state)); } catch (error) { console.warn("Failed to save chat overlay state to localStorage:", error); } } /** * Custom hook for managing chat overlay state * Persists state to localStorage for consistency across page refreshes */ export function useChatOverlay(): UseChatOverlayResult { const [state, setState] = useState(loadState); // Persist state changes to localStorage useEffect(() => { saveState(state); }, [state]); const open = useCallback(() => { setState({ isOpen: true, isMinimized: false }); }, []); const close = useCallback(() => { setState((prev) => ({ ...prev, isOpen: false })); }, []); const minimize = useCallback(() => { setState((prev) => ({ ...prev, isMinimized: true })); }, []); const expand = useCallback(() => { setState((prev) => ({ ...prev, isMinimized: false })); }, []); const toggle = useCallback(() => { setState((prev) => ({ ...prev, isOpen: !prev.isOpen })); }, []); const toggleMinimize = useCallback(() => { setState((prev) => ({ ...prev, isMinimized: !prev.isMinimized })); }, []); return { ...state, open, close, minimize, expand, toggle, toggleMinimize, }; }