fix: hydration-safe initialization for useOverlays and useCollapsible

Author: jpr5

showcase/shell-dashboard/src/components/collapsible-category.tsx

@@ -6,7 +6,7 @@
  * Collapse state is persisted in localStorage using the key
  * `dashboard-collapse-{name}`.
  */
-import { useState } from "react";
+import { useState, useEffect } from "react";
 
 /* ------------------------------------------------------------------ */
 /*  localStorage helpers                                               */
@@ -55,7 +55,11 @@ export function useCollapsible({
   name,
   defaultOpen,
 }: UseCollapsibleOptions): UseCollapsibleReturn {
-  const [isOpen, setIsOpen] = useState(() => readStorage(name, defaultOpen));
+  const [isOpen, setIsOpen] = useState(defaultOpen);
+
+  useEffect(() => {
+    setIsOpen(readStorage(name, defaultOpen));
+  }, [name, defaultOpen]);
 
   const toggle = () => {
     const next = !isOpen;

showcase/shell-dashboard/src/hooks/useOverlays.ts

@@ -126,20 +126,19 @@ export interface UseOverlaysReturn {
 export function useOverlays(): UseOverlaysReturn {
   const initialized = useRef(false);
 
-  const [overlays, setOverlays] = useState<OverlaySet>(() => {
-    const { overlays: fromHash } = parseHash();
-    if (fromHash) return fromHash;
-
-    const fromStorage = loadFromStorage();
-    if (fromStorage) return fromStorage;
-
-    return new Set(DEFAULT_OVERLAYS) as OverlaySet;
-  });
+  const [overlays, setOverlays] = useState<OverlaySet>(
+    () => new Set(DEFAULT_OVERLAYS) as OverlaySet,
+  );
+  const [activeTab, setActiveTabRaw] = useState<"matrix" | "ops">("matrix");
 
-  const [activeTab, setActiveTabRaw] = useState<"matrix" | "ops">(() => {
-    const { tab } = parseHash();
-    return tab;
-  });
+  // Sync from URL hash / localStorage after hydration
+  useEffect(() => {
+    const { tab, overlays: fromHash } = parseHash();
+    const resolved =
+      fromHash ?? loadFromStorage() ?? (new Set(DEFAULT_OVERLAYS) as OverlaySet);
+    setOverlays(resolved);
+    setActiveTabRaw(tab);
+  }, []);
 
   // On mount, write hash to reflect actual state (handles legacy redirects
   // and fallback from localStorage where the URL had no hash).