feat(20-01): extend UIStore with FAB/catalog state, add useTags hook, update useGlobalItems

- Add fabMenuOpen, openFabMenu, closeFabMenu to UIStore
- Add catalogSearchOpen, catalogSearchMode, openCatalogSearch, closeCatalogSearch
- openCatalogSearch also closes FAB menu (natural flow)
- Create useTags hook with 5-min staleTime cache
- Add optional tags parameter to useGlobalItems for tag filtering

src/client/hooks/useGlobalItems.ts

@@ -23,13 +23,16 @@ interface ItemGlobalLink {
 	globalItemId: number;
 }
 
-export function useGlobalItems(query?: string) {
+export function useGlobalItems(query?: string, tags?: string[]) {
+	const params = new URLSearchParams();
+	if (query) params.set("q", query);
+	if (tags && tags.length > 0) params.set("tags", tags.join(","));
+	const qs = params.toString();
+
 	return useQuery({
-		queryKey: ["global-items", query ?? ""],
+		queryKey: ["global-items", query ?? "", tags ?? []],
 		queryFn: () =>
-			apiGet<GlobalItem[]>(
-				`/api/global-items${query ? `?q=${encodeURIComponent(query)}` : ""}`,
-			),
+			apiGet<GlobalItem[]>(`/api/global-items${qs ? `?${qs}` : ""}`),
 	});
 }
 

src/client/hooks/useTags.ts

@@ -0,0 +1,15 @@
+import { useQuery } from "@tanstack/react-query";
+import { apiGet } from "../lib/api";
+
+export interface Tag {
+	id: number;
+	name: string;
+}
+
+export function useTags() {
+	return useQuery({
+		queryKey: ["tags"],
+		queryFn: () => apiGet<Tag[]>("/api/tags"),
+		staleTime: 5 * 60 * 1000,
+	});
+}

src/client/stores/uiStore.ts

@@ -56,6 +56,17 @@ interface UIState {
 	// Setup impact preview
 	selectedSetupId: number | null;
 	setSelectedSetupId: (id: number | null) => void;
+
+	// FAB menu
+	fabMenuOpen: boolean;
+	openFabMenu: () => void;
+	closeFabMenu: () => void;
+
+	// Catalog search overlay
+	catalogSearchOpen: boolean;
+	catalogSearchMode: "collection" | "thread" | null;
+	openCatalogSearch: (mode: "collection" | "thread") => void;
+	closeCatalogSearch: () => void;
 }
 
 export const useUIStore = create<UIState>((set) => ({
@@ -119,4 +130,21 @@ export const useUIStore = create<UIState>((set) => ({
 	// Setup impact preview
 	selectedSetupId: null,
 	setSelectedSetupId: (id) => set({ selectedSetupId: id }),
+
+	// FAB menu
+	fabMenuOpen: false,
+	openFabMenu: () => set({ fabMenuOpen: true }),
+	closeFabMenu: () => set({ fabMenuOpen: false }),
+
+	// Catalog search overlay
+	catalogSearchOpen: false,
+	catalogSearchMode: null,
+	openCatalogSearch: (mode) =>
+		set({
+			catalogSearchOpen: true,
+			catalogSearchMode: mode,
+			fabMenuOpen: false,
+		}),
+	closeCatalogSearch: () =>
+		set({ catalogSearchOpen: false, catalogSearchMode: null }),
 }));