Connect.Commands.tsx 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. import { Plug } from 'lucide-react'
  2. import { parseAsBoolean, parseAsString, useQueryState } from 'nuqs'
  3. import type { ICommand } from 'ui-patterns/CommandMenu'
  4. import { useRegisterCommands, useSetCommandMenuOpen } from 'ui-patterns/CommandMenu'
  5. import { COMMAND_MENU_SECTIONS } from '@/components/interfaces/App/CommandMenu/CommandMenu.utils'
  6. import { orderCommandSectionsByPriority } from '@/components/interfaces/App/CommandMenu/ordering'
  7. import { useSelectedProjectQuery } from '@/hooks/misc/useSelectedProject'
  8. import { PROJECT_STATUS } from '@/lib/constants'
  9. export function useConnectCommands() {
  10. const setIsOpen = useSetCommandMenuOpen()
  11. const { data: selectedProject } = useSelectedProjectQuery()
  12. const isActiveHealthy = selectedProject?.status === PROJECT_STATUS.ACTIVE_HEALTHY
  13. const [, setShowConnect] = useQueryState('showConnect', parseAsBoolean.withDefault(false))
  14. const [, setConnectTab] = useQueryState('connectTab', parseAsString)
  15. useRegisterCommands(
  16. COMMAND_MENU_SECTIONS.ACTIONS,
  17. [
  18. {
  19. id: 'connect-to-project',
  20. name: 'Connect to your project',
  21. action: () => {
  22. setShowConnect(true)
  23. setIsOpen(false)
  24. },
  25. icon: () => <Plug className="rotate-90" />,
  26. },
  27. {
  28. id: 'connect-mcp',
  29. name: 'Connect via MCP',
  30. action: () => {
  31. setShowConnect(true)
  32. setConnectTab('mcp')
  33. setIsOpen(false)
  34. },
  35. icon: () => <Plug className="rotate-90" />,
  36. },
  37. ] as ICommand[],
  38. {
  39. enabled: !!selectedProject && isActiveHealthy,
  40. orderSection: orderCommandSectionsByPriority,
  41. sectionMeta: { priority: 2 },
  42. }
  43. )
  44. }