Start of command palette

src-web/hooks/useCommandPalette.tsx

@@ -0,0 +1,24 @@
+import { CommandPalette } from '../components/CommandPalette';
+import { useDialog } from '../components/DialogContext';
+import { useAppInfo } from './useAppInfo';
+import { useHotKey } from './useHotKey';
+
+export function useCommandPalette() {
+  const dialog = useDialog();
+  const appInfo = useAppInfo();
+  useHotKey('command_palette.toggle', () => {
+    // Disabled in production for now
+    if (!appInfo.data?.isDev) {
+      return;
+    }
+
+    dialog.toggle({
+      id: 'command_palette',
+      size: 'md',
+      hideX: true,
+      noPadding: true,
+      noScroll: true,
+      render: () => <CommandPalette />,
+    });
+  });
+}