src/lib/stores/ui.ts

import { writable, derived } from 'svelte/store';
import type { UIState } from '$lib/types/client';
import { STORAGE_KEY_SIDEBAR_VISIBLE } from '$lib/utils/constants';
import { getItem, setItem } from '$lib/services/storage';

/**
 * UI store managing application UI state
 * Handles sidebar visibility, loading states, and global errors
 */

function createInitialState(): UIState {
	const sidebarVisible = getItem<boolean>(STORAGE_KEY_SIDEBAR_VISIBLE);

	return {
		sidebarVisible: sidebarVisible !== null ? sidebarVisible : true, // Default visible
		loading: false,
		error: null,
		activeSessionId: null
	};
}

// Create the UI store
function createUIStore() {
	const { subscribe, set, update } = writable<UIState>(createInitialState());

	return {
		subscribe,

		/**
		 * Toggle sidebar visibility
		 */
		toggleSidebar() {
			update((state) => {
				const newVisible = !state.sidebarVisible;
				setItem(STORAGE_KEY_SIDEBAR_VISIBLE, newVisible);
				return {
					...state,
					sidebarVisible: newVisible
				};
			});
		},

		/**
		 * Set sidebar visibility
		 */
		setSidebarVisible(visible: boolean) {
			update((state) => {
				setItem(STORAGE_KEY_SIDEBAR_VISIBLE, visible);
				return {
					...state,
					sidebarVisible: visible
				};
			});
		},

		/**
		 * Set loading state
		 */
		setLoading(loading: boolean) {
			update((state) => ({
				...state,
				loading
			}));
		},

		/**
		 * Set error message
		 */
		setError(error: string | null) {
			update((state) => ({
				...state,
				error
			}));
		},

		/**
		 * Set active session ID
		 */
		setActiveSessionId(sessionId: string | null) {
			update((state) => ({
				...state,
				activeSessionId: sessionId
			}));
		},

		/**
		 * Clear error
		 */
		clearError() {
			update((state) => ({
				...state,
				error: null
			}));
		}
	};
}

export const uiStore = createUIStore();

// Derived stores
export const sidebarVisible = derived(uiStore, ($ui) => $ui.sidebarVisible);

export const isLoading = derived(uiStore, ($ui) => $ui.loading);

export const globalError = derived(uiStore, ($ui) => $ui.error);

export const activeSessionId = derived(uiStore, ($ui) => $ui.activeSessionId);