import { useCallback, useEffect, useState } from "react";

const KEY = "ap_sidebar_collapsed";

function read(): boolean {
  if (typeof window === "undefined") return false;
  try {
    return window.localStorage.getItem(KEY) === "1";
  } catch {
    return false; // Safari en modo privado puede lanzar al leer localStorage.
  }
}

/**
 * Colapso de la barra lateral en pantallas grandes (lg+), recordado entre
 * sesiones. En iPad Pro portrait (1024px) la barra expandida se lleva 256px de
 * los 1024 disponibles, así que poder colapsarla a solo iconos es lo que más
 * ancho devuelve al contenido.
 */
export function useSidebarCollapsed() {
  const [collapsed, setCollapsed] = useState(read);

  const toggle = useCallback(() => setCollapsed((c) => !c), []);

  useEffect(() => {
    try {
      window.localStorage.setItem(KEY, collapsed ? "1" : "0");
    } catch {
      /* sin persistencia si el almacenamiento está bloqueado */
    }
  }, [collapsed]);

  // Mantiene ambos shells (app y admin) en sincronía si se abren en dos pestañas.
  useEffect(() => {
    const onStorage = (e: StorageEvent) => {
      if (e.key === KEY && e.newValue !== null) setCollapsed(e.newValue === "1");
    };
    window.addEventListener("storage", onStorage);
    return () => window.removeEventListener("storage", onStorage);
  }, []);

  return { collapsed, toggle };
}