import { useCallback } from 'react';
import { CommandPaletteDialog } from '../components/CommandPaletteDialog';
import { toggleDialog } from '../lib/dialog';

export function useToggleCommandPalette() {
  const togglePalette = useCallback(() => {
    toggleDialog({
      id: 'command_palette',
      size: 'dynamic',
      hideX: true,
      className: 'mb-auto mt-[4rem] !max-h-[min(30rem,calc(100vh-4rem))]',
      vAlign: 'top',
      noPadding: true,
      noScroll: true,
      render: ({ hide }) => <CommandPaletteDialog onClose={hide} />,
    });
  }, []);

  return togglePalette;
}