8a46a8a019
- move reusable domain, data, state, ui code into src/lib - update host screens to consume new library exports - document architecture and configure path aliases - bump astro integration dependencies for compatibility Refs #30
State Layer (@lib/state)
Compose domain + data layers into reusable hooks. Hooks are Preact-friendly but React-compatible thanks to the astro-preact compat flag.
Hooks
useGameState- Loads/synchronises game collections.
- Exposes CRUD ops (
addGame,updateGame,deleteGame), filtering helpers, and cached player history. - Handles persistence errors and loading states.
useNavigation- Simple screen router for the 3 major views (list, new game, detail).
- Tracks selected game id.
useNewGameWizard- Holds transient wizard form state and immutable steps.
- Provides
startWizard,resetWizard,updateGameData,nextStep.
useModal,useValidationModal,useCompletionModal- Encapsulate modal visibility state, ensuring consistent APIs across components.
Usage
import { useGameState, useNavigation, useModal } from '@lib/state';
const gameState = useGameState();
const navigation = useNavigation();
const modal = useModal();
// gameState.games, navigation.screen, modal.openModal(), ...
Design Notes
- Hooks avoid direct DOM work—UI components receive ready-to-render props and callbacks.
- Side effects (storage, logging) are delegated to
@lib/data. - All exports are re-exported via
@lib/state/index.ts.