Function CommandMenu

components/command-menu.tsx:32–133

()

};

export function CommandMenu() {
  const router = useRouter();
  const [open, setOpen] = useState(false);
  const { theme, setTheme } = useTheme();

  const navigateAndCloseDialog = useCallback(
    (path: string) => {
      router.push(path);
      setOpen(false);
    },
    [router]
  );

  const handleSignOut = async () => {
    const supabase = createClient();
    const { error } = await supabase.auth.signOut();
    if (error) clientLogger.error('Sign out error', { error });
    router.push("/login");
    router.refresh();
  };

  useEffect(() => {
    const down = (e: KeyboardEvent) => {
      if (!isTyping()) {
        if (e.key === "k" && (e.metaKey || e.ctrlKey)) {
          e.preventDefault();
          setOpen((open) => !open);
        } else {
          const pressedKey = e.key.toLowerCase();
          const allItems = [...menuItems, ...mainNavItems];
          const matchedItem = allItems.find(item => item.shortcut.toLowerCase() === pressedKey);
          
          if (matchedItem) {
            e.preventDefault();
            if (matchedItem.href) {
              navigateAndCloseDialog(matchedItem.href);
            } else if (matchedItem.action === 'theme') {
              setTheme(theme === "light" ? "dark" : "light");
            } else if (matchedItem.action === 'logout') {
              handleSignOut();
            }
          }
        }
      }
    };
    
    document.addEventListener("keydown", down);
    return () => document.removeEventListener("keydown", down);
  }, [router, theme, setTheme, navigateAndCloseDialog, handleSignOut]);

  const handleItemClick = (item: any) => {    
    if (item.href) {
      navigateAndCloseDialog(item.href);
    } else if (item.action === 'theme') {
      setTheme(theme === 'light' ? 'dark' : 'light');
      setOpen(false);
    } else if (item.action === 'logout') {
      handleSignOut();