Command Palette
Ctrl+K command palette for fast admin navigation, content search, and workflow actions
Command Palette
The Command Palette is a fuzzy-searchable launcher built into every admin page. Press Ctrl+K (or Cmd+K on Mac) to open it, type to filter, arrow-key to navigate, and Enter to execute.
How It’s Triggered
Three ways to open the palette:
| Method | Where |
|---|---|
| Ctrl+K / Cmd+K | Any admin page (global keyboard listener) |
| Sidebar button | AdminSidebar footer — “Search (Ctrl+K)“ |
| Programmatic | window.openCommandPalette() from any script |
Press Escape to close.
Item Categories
The palette organizes items into three categories, selectable via tabs (All, Content, Actions, Pages):
Pages (9 static entries)
Direct navigation links to admin sections:
| Page | Path |
|---|---|
| Dashboard | /admin |
| Editor | /admin/edit |
| Content Pipeline | /admin/pipeline |
| Security Scanner | /admin/security |
| Review Queue | /admin/review |
| Build Swarm | /admin/build-swarm |
| Sandbox Catalog | /admin/sandbox |
| AI Chat | /admin/chat |
| Telemetry | /telemetry |
Actions (5 commands)
Commands that trigger workflows or navigation:
| Action | Effect |
|---|---|
| New Post | Navigate to /admin/edit?new=true |
| Full Health Check | Run full-health workflow (voice + PII + security scan) |
| Batch Sanitize | Run batch-sanitize workflow |
| Auto-Fill Metadata | Run auto-metadata workflow |
| AI Settings | Call window.openAISettings() |
Workflow actions use runWorkflowFromPalette() which either calls window.runWorkflow() (if on the dashboard) or redirects to /admin?workflow=<type>.
Content (dynamic)
All posts and journal entries, loaded from GET /api/admin/content-index on first open. Each item shows:
- Icon: newspaper (posts) or book (journals)
- Title from frontmatter
- Path:
collection/id - Badges: DRAFT (gray) or FLAGGED (pink) if applicable
- Links to
/admin/edit?collection=X&id=Y
Content is cached in memory for the page session. The API returns a 30-second Cache-Control header.
Fuzzy Search
The search input filters across all visible categories. The algorithm:
- Empty query matches everything
- Case-insensitive exact substring match (e.g., “edit” finds “Editor”)
- Falls back to sequential character matching (e.g., “dshb” finds “Dashboard”)
- Searches against
title + subtitleconcatenated
Results update instantly on every keystroke.
Keyboard Navigation
| Key | Action |
|---|---|
| Ctrl+K / Cmd+K | Open / close |
| Escape | Close |
| Arrow Up / Down | Move selection |
| Enter | Execute selected item |
| Tab clicks | Filter by category |
The selected item gets a purple highlight and auto-scrolls into view.
Execution
Items execute in two modes:
- Navigation (pages + content): Sets
location.hrefto the target path - Function call (actions): Runs an inline callback — either a workflow dispatch, a redirect, or a window function call
The palette always closes before executing.
Component Details
| Property | Value |
|---|---|
| File | src/components/admin/CommandPalette.astro |
| Rendered in | CosmicLayout.astro (admin pages only) |
| Max width | 640px |
| Results height | 400px max, scrollable |
| Design | Glassmorphic — dark background with purple-tinted borders and backdrop blur |
| Animation | 150ms slide-in (scale 0.98→1.0, translateY -10px→0) |
Adding New Commands
New page entry
Add to the PAGES array in CommandPalette.astro:
{ type: 'page', icon: 'fa-database', title: 'Data Backup', href: '/admin/backup' }
New action
Add to the ACTIONS array:
{
type: 'action',
icon: 'fa-download',
title: 'Export Data',
sub: 'Download content as JSON',
action: () => { fetch('/api/admin/export').then(r => r.blob()).then(b => { /* download */ }); }
}
New content types
Content items are auto-discovered from /api/admin/content-index. Add markdown files to src/content/posts/ or src/content/journal/ with a title field and they appear on next fetch.