diff --git a/backend/src/routes/stellar.ts b/backend/src/routes/stellar.ts
index 9302d4d0..dbd424c4 100644
--- a/backend/src/routes/stellar.ts
+++ b/backend/src/routes/stellar.ts
@@ -36,4 +36,4 @@ stellarRouter.get('/tx/:hash', cacheControl({ maxAge: CacheTTL.IMMUTABLE }), asy
console.error('Stellar tx error:', error);
return res.status(500).json({ message: 'Failed to fetch transaction' });
}
-});
+});
\ No newline at end of file
diff --git a/frontend/components/layout/CommandMenu.tsx b/frontend/components/layout/CommandMenu.tsx
new file mode 100644
index 00000000..3dddc1d7
--- /dev/null
+++ b/frontend/components/layout/CommandMenu.tsx
@@ -0,0 +1,76 @@
+'use client';
+
+import { useEffect, useState } from 'react';
+import { Search, X } from 'lucide-react';
+import { Button } from '@/components/ui/button';
+
+export function CommandMenu() {
+ const [open, setOpen] = useState(false);
+
+ // 1. Listen for Cmd+K or Ctrl+K
+ useEffect(() => {
+ const down = (e: KeyboardEvent) => {
+ if (e.key === 'k' && (e.metaKey || e.ctrlKey)) {
+ e.preventDefault();
+ setOpen((open) => !open);
+ }
+ };
+ document.addEventListener('keydown', down);
+ return () => document.removeEventListener('keydown', down);
+ }, []);
+
+ // 2. Listen for Escape to close
+ useEffect(() => {
+ const down = (e: KeyboardEvent) => {
+ if (e.key === 'Escape') setOpen(false);
+ };
+ document.addEventListener('keydown', down);
+ return () => document.removeEventListener('keydown', down);
+ }, []);
+
+ return (
+ <>
+ {/* 3. The Visual Search Button with Shortcut Hint */}
+
+
+ {/* The Search Modal Overlay */}
+ {open && (
+
setOpen(false)}>
+
e.stopPropagation()}>
+
+
+
+
+
+
+
Start typing to search across your dashboard.
+
+ Navigate with ↑ ↓
+ Close with ESC
+
+
+
+
+ )}
+
+ );
+}
\ No newline at end of file
diff --git a/frontend/components/layout/Header.tsx b/frontend/components/layout/Header.tsx
index fc4d159e..b413d6ef 100644
--- a/frontend/components/layout/Header.tsx
+++ b/frontend/components/layout/Header.tsx
@@ -37,6 +37,10 @@ import { ThemeSettingsModal } from '@/components/theme/ThemeSettingsModal';
import { TimezoneSettingsModal } from '@/components/settings/TimezoneSettingsModal';
import { getBrowserTimeZone, isValidTimeZone } from '@/lib/utils';
+// Our new CommandMenu!
+import { CommandMenu } from './CommandMenu';
+
+// I built the isolated NetworkIndicator component right here
/* ---------------- TYPES ---------------- */
type BreadcrumbItemType = {
label: string;
@@ -152,6 +156,8 @@ export function Header() {
{/* RIGHT */}