♻️ add command palette trigger on the header

src/components/LayoutHeader.tsx

@@ -8,6 +8,7 @@ import { useTheme } from "next-themes";
 import BrandingLogo from "./BrandingLogo";
 import { useEnvContext } from "@app/hooks/useEnvContext";
 import { useLicenseStatusContext } from "@app/hooks/useLicenseStatusContext";
+import { CommandPaletteTrigger } from "@app/components/command-palette/CommandPaletteTrigger";
 
 interface LayoutHeaderProps {
     showTopBar: boolean;
@@ -67,6 +68,7 @@ export function LayoutHeader({ showTopBar }: LayoutHeaderProps) {
 
                         {showTopBar && (
                             <div className="flex items-center space-x-2">
+                                <CommandPaletteTrigger />
                                 <ThemeSwitcher />
                                 <ProfileIcon />
                             </div>

src/components/LayoutMobileMenu.tsx

@@ -1,27 +1,27 @@
 "use client";
 
-import React, { useState } from "react";
-import { SidebarNav } from "@app/components/SidebarNav";
-import { OrgSelector } from "@app/components/OrgSelector";
-import { cn } from "@app/lib/cn";
-import { ListUserOrgsResponse } from "@server/routers/org";
-import { Button } from "@app/components/ui/button";
-import { ArrowRight, Menu, Server } from "lucide-react";
-import Link from "next/link";
-import { usePathname } from "next/navigation";
-import { useUserContext } from "@app/hooks/useUserContext";
-import { useTranslations } from "next-intl";
-import ProfileIcon from "@app/components/ProfileIcon";
-import ThemeSwitcher from "@app/components/ThemeSwitcher";
 import type { SidebarNavSection } from "@app/app/navigation";
+import { CommandPaletteTrigger } from "@app/components/command-palette/CommandPaletteTrigger";
+import { OrgSelector } from "@app/components/OrgSelector";
+import ProfileIcon from "@app/components/ProfileIcon";
+import { SidebarNav } from "@app/components/SidebarNav";
+import ThemeSwitcher from "@app/components/ThemeSwitcher";
+import { Button } from "@app/components/ui/button";
 import {
     Sheet,
     SheetContent,
-    SheetTrigger,
+    SheetDescription,
     SheetTitle,
-    SheetDescription
+    SheetTrigger
 } from "@app/components/ui/sheet";
-import { Abel } from "next/font/google";
+import { useUserContext } from "@app/hooks/useUserContext";
+import { cn } from "@app/lib/cn";
+import { ListUserOrgsResponse } from "@server/routers/org";
+import { Menu, Server } from "lucide-react";
+import { useTranslations } from "next-intl";
+import Link from "next/link";
+import { usePathname } from "next/navigation";
+import { useState } from "react";
 
 interface LayoutMobileMenuProps {
     orgId?: string;
@@ -121,6 +121,7 @@ export function LayoutMobileMenu({
                 {showTopBar && (
                     <div className="ml-auto flex items-center justify-end">
                         <div className="flex items-center space-x-2">
+                            <CommandPaletteTrigger variant="mobile" />
                             <ThemeSwitcher />
                             <ProfileIcon />
                         </div>

src/components/command-palette/CommandPalette.tsx

@@ -100,7 +100,7 @@ export function CommandPalette({ orgId, orgs, navItems }: CommandPaletteProps) {
 
     return (
         <CommandDialog
-            open={open} // TODO: flip back to normal
+            open={open}
             onOpenChange={handleOpenChange}
             title={t("commandPaletteTitle")}
             description={t("commandPaletteDescription")}
@@ -433,7 +433,7 @@ export function CommandPaletteProvider({
     orgs,
     navItems
 }: CommandPaletteProviderProps) {
-    const [open, setOpen] = useState(true); // FIXME: should be set to `false` by default, this is temporary
+    const [open, setOpen] = useState(false);
 
     const toggle = useCallback(() => {
         setOpen((current) => !current);