/** * Map UI Context * Manages UI state for the map view: sidebar, view modes, refs * Separated from MapContexts.tsx for better SRP */ import React, { createContext, ReactNode, useCallback, useContext, useRef, useState } from 'react'; interface MapUIState { isSidebarOpen: boolean; mapViewMode: 'organizations' | 'historical'; showProductsServices: boolean; // Toggle for products/services layer addOrgButtonRef: React.RefObject; } interface MapUIActions { setIsSidebarOpen: (isOpen: boolean) => void; setMapViewMode: (mode: 'organizations' | 'historical') => void; setShowProductsServices: (show: boolean) => void; toggleSidebar: () => void; closeSidebar: () => void; toggleProductsServices: () => void; } interface MapUIContextType extends MapUIState, MapUIActions {} const MapUIContext = createContext(undefined); export const useMapUI = () => { const context = useContext(MapUIContext); if (context === undefined) { throw new Error('useMapUI must be used within a MapUIProvider'); } return context; }; interface MapUIProviderProps { children: ReactNode; defaultViewMode?: 'organizations' | 'historical'; } export const MapUIProvider = ({ children, defaultViewMode = 'organizations', }: MapUIProviderProps) => { const [isSidebarOpen, setIsSidebarOpen] = useState(true); const [mapViewMode, setMapViewMode] = useState<'organizations' | 'historical'>(defaultViewMode); const [showProductsServices, setShowProductsServices] = useState(false); const addOrgButtonRef = useRef(null); const toggleSidebar = useCallback(() => { setIsSidebarOpen((prev) => !prev); }, []); const closeSidebar = useCallback(() => { setIsSidebarOpen(false); }, []); const toggleProductsServices = useCallback(() => { setShowProductsServices((prev) => !prev); }, []); const value: MapUIContextType = { // State isSidebarOpen, mapViewMode, showProductsServices, addOrgButtonRef, // Actions setIsSidebarOpen, setMapViewMode, setShowProductsServices, toggleSidebar, closeSidebar, toggleProductsServices, }; return {children}; };