const SessionContext = React.createContext(null);

function SessionProvider({ children: reactChildren, initialBundle }) {
  const [bundle, setBundle] = React.useState(initialBundle || null);
  const [selectedChildId, setSelectedChildIdState] = React.useState(() => {
    const raw = localStorage.getItem('kb.selectedChildId');
    return raw ? Number(raw) : null;
  });

  React.useEffect(() => {
    if (!bundle) return;
    const ids = (bundle.children || []).map((c) => c.id);
    if (!ids.length) {
      setSelectedChildIdState(null);
      localStorage.removeItem('kb.selectedChildId');
      return;
    }
    if (!ids.includes(selectedChildId)) {
      setSelectedChildIdState(ids[0]);
      localStorage.setItem('kb.selectedChildId', String(ids[0]));
    }
  }, [bundle]);

  const setSelectedChildId = (id) => {
    setSelectedChildIdState(id);
    if (id == null) localStorage.removeItem('kb.selectedChildId');
    else localStorage.setItem('kb.selectedChildId', String(id));
  };

  const refresh = React.useCallback(async () => {
    try {
      const b = await api.me();
      setBundle(b);
      return b;
    } catch (e) {
      setBundle(null);
      return null;
    }
  }, []);

  const clear = () => {
    setBundle(null);
    setSelectedChildIdState(null);
    localStorage.removeItem('kb.selectedChildId');
  };

  const value = {
    bundle,
    setBundle,
    selectedChildId,
    setSelectedChildId,
    refresh,
    clear,
    user: bundle?.user || null,
    family: bundle?.family || null,
    parents: bundle?.parents || [],
    children: bundle?.children || [],
  };

  return <SessionContext.Provider value={value}>{reactChildren}</SessionContext.Provider>;
}

const useSession = () => React.useContext(SessionContext);

Object.assign(window, { SessionContext, SessionProvider, useSession });