a7cb866cab
Add @bytelyst/command-palette (workspace:* + minimal lockfile importer entry). Mount CommandRegistryProvider + a lazily-loaded CommandMenu in providers.tsx, opened with ⌘K / Ctrl-K. Register navigate commands (Overview/Items/Board/Roadmap), New item (navigates to items with ?new=1 which auto-opens the create modal), Toggle theme, Sign out, and per-product Switch commands wired to setProductId. Command building lives in the pure src/lib/command-registry.ts. Add command-menu.test.tsx (jsdom) asserting the builder set and that the palette opens on ⌘K and lists commands. Generated with [Devin](https://cli.devin.ai/docs) Co-Authored-By: Devin <158243242+devin-ai-integration[bot]@users.noreply.github.com>
45 lines
1.4 KiB
TypeScript
45 lines
1.4 KiB
TypeScript
'use client';
|
|
|
|
import { useMemo } from 'react';
|
|
import { useRouter } from 'next/navigation';
|
|
import { CommandPalette, useCommandPalette, useRegisterCommands } from '@bytelyst/command-palette';
|
|
import { useTheme } from '@/lib/theme-context';
|
|
import { useAuth } from '@/lib/auth-context';
|
|
import { useProduct } from '@/lib/product-context';
|
|
import { buildCommands } from '@/lib/command-registry';
|
|
|
|
/**
|
|
* ⌘K / Ctrl-K command palette shell (UX-5). Mounted once inside the providers
|
|
* tree (within CommandRegistryProvider) and loaded via next/dynamic so the
|
|
* palette code stays out of the initial bundle.
|
|
*/
|
|
export default function CommandMenu() {
|
|
const router = useRouter();
|
|
const { theme, setTheme } = useTheme();
|
|
const { logout } = useAuth();
|
|
const { products, setProductId } = useProduct();
|
|
const cmdk = useCommandPalette();
|
|
|
|
const commands = useMemo(
|
|
() =>
|
|
buildCommands({
|
|
navigate: href => router.push(href),
|
|
newItem: () => router.push('/dashboard/items?new=1'),
|
|
toggleTheme: () => setTheme(theme === 'dark' ? 'light' : 'dark'),
|
|
signOut: () => {
|
|
logout();
|
|
router.push('/login');
|
|
},
|
|
setProduct: setProductId,
|
|
products,
|
|
}),
|
|
[router, theme, setTheme, logout, setProductId, products]
|
|
);
|
|
|
|
useRegisterCommands(commands);
|
|
|
|
return (
|
|
<CommandPalette open={cmdk.open} onClose={cmdk.hide} onNavigate={href => router.push(href)} />
|
|
);
|
|
}
|