feat: first draft

contexts/state/StateContext.tsx

@@ -0,0 +1,68 @@
+'use client';
+
+import React, { createContext, useContext } from 'react';
+import type { GlobalState } from '../../utils/types';
+
+export type Action =
+  | { type: 'SET_STATE'; payload: GlobalState }
+  | {
+      type: 'ADD_FACTOR';
+      payload: {
+        id: string;
+        name: string;
+        marketScore: number;
+        ideaScore: number;
+      };
+    }
+  | {
+      type: 'ADD_ACTION';
+      payload: { actionType: keyof GlobalState['fourActions']; value: string };
+    }
+  | {
+      type: 'ADD_OPPORTUNITY';
+      payload: { pathType: keyof GlobalState['sixPaths']; value: string };
+    }
+  | { type: 'UPDATE_PATH_NOTES'; payload: { pathType: string; notes: string } }
+  | { type: 'TOGGLE_UTILITY'; payload: { key: string } }
+  | { type: 'UPDATE_UTILITY_NOTES'; payload: { key: string; notes: string } }
+  | { type: 'UPDATE_TARGET_PRICE'; payload: number }
+  | {
+      type: 'ADD_COMPETITOR';
+      payload: {
+        name: string;
+        price: number;
+        category: 'same-form' | 'different-form' | 'different-function';
+      };
+    }
+  | {
+      type: 'UPDATE_COMPETITOR';
+      payload: {
+        index: number;
+        field: 'name' | 'price' | 'category';
+        value: string | number;
+      };
+    }
+  | { type: 'TOGGLE_NON_CUSTOMER'; payload: { key: string } }
+  | { type: 'TOGGLE_SEQUENCE'; payload: { key: string } }
+  | { type: 'UPDATE_VALIDATION_NOTES'; payload: string }
+  | { type: 'RESET_STATE' };
+
+export interface StateContextType {
+  state: GlobalState;
+  dispatch: React.Dispatch<Action>;
+  isLoading: boolean;
+  error: string | null;
+  resetState: () => void;
+}
+
+export const StateContext = createContext<StateContextType | undefined>(
+  undefined
+);
+
+export function useGlobalState() {
+  const context = useContext(StateContext);
+  if (!context) {
+    throw new Error('useGlobalState must be used within StateProvider');
+  }
+  return context;
+}

contexts/state/StateProvider.tsx

@@ -0,0 +1,86 @@
+'use client';
+
+import { Alert, AlertDescription } from '@components/ui/alert';
+import { StateContext, StateContextType } from './StateContext';
+import { Loader2 } from 'lucide-react';
+import { useEffect, useReducer, useState } from 'react';
+import { useStorage } from '@utils/useStorage';
+import { stateReducer } from '@utils/stateReducer';
+import _ from 'lodash';
+import { initialState } from '@utils/validateState';
+
+export function StateProvider({ children }: { children: React.ReactNode }) {
+  const [state, dispatch] = useReducer(stateReducer, initialState);
+  const [isLoading, setIsLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+  const { loadState, saveState } = useStorage();
+
+  useEffect(() => {
+    const init = async () => {
+      try {
+        setIsLoading(true);
+        setError(null);
+        const saved = await loadState();
+        if (saved) {
+          dispatch({ type: 'SET_STATE', payload: saved });
+        }
+      } catch (error) {
+        console.error('Failed to load initial state:', error);
+        setError('Failed to load saved data. Starting with empty state.');
+      } finally {
+        setIsLoading(false);
+      }
+    };
+    init();
+  }, [loadState]);
+
+  useEffect(() => {
+    const debouncedSave = _.debounce(async () => {
+      try {
+        await saveState(state);
+      } catch (error) {
+        console.error('Failed to save state:', error);
+        setError('Failed to save changes.');
+      }
+    }, 1000);
+
+    if (!isLoading) {
+      debouncedSave();
+    }
+
+    return () => {
+      debouncedSave.cancel();
+    };
+  }, [saveState, state, isLoading]);
+
+  const resetState = () => {
+    dispatch({ type: 'RESET_STATE' });
+  };
+
+  if (isLoading) {
+    return (
+      <div className="flex items-center justify-center h-screen">
+        <Loader2 className="h-8 w-8 animate-spin" />
+      </div>
+    );
+  }
+
+  const contextValue: StateContextType = {
+    state,
+    dispatch,
+    isLoading,
+    error,
+    resetState,
+  };
+
+  return (
+    <StateContext.Provider value={contextValue}>
+      {error && (
+        <Alert variant="destructive" className="mb-4">
+          <AlertDescription>{error}</AlertDescription>
+        </Alert>
+      )}
+      {children}
+    </StateContext.Provider>
+  );
+}