Reports.Commands.tsx 2.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. import { useParams } from 'common'
  2. import { useMemo } from 'react'
  3. import type { CommandOptions, ICommand } from 'ui-patterns/CommandMenu'
  4. import { orderSectionFirst, useQuery, useRegisterCommands } from 'ui-patterns/CommandMenu'
  5. import { COMMAND_MENU_SECTIONS } from '@/components/interfaces/App/CommandMenu/CommandMenu.utils'
  6. import { useIsFeatureEnabled } from '@/hooks/misc/useIsFeatureEnabled'
  7. const QUERY_PERFORMANCE_COMMAND_ID = 'nav-reports-query-performance'
  8. export function useReportsGotoCommands(options?: CommandOptions) {
  9. let { ref } = useParams()
  10. ref ||= '_'
  11. const { reportsAll } = useIsFeatureEnabled(['reports:all'])
  12. const commandQuery = useQuery()?.toLowerCase() ?? ''
  13. const prioritizeQueryPerformance = commandQuery.includes('query')
  14. const orderQueryPerformanceCommand = useMemo(() => {
  15. if (!prioritizeQueryPerformance) return undefined
  16. return (existingCommands: ICommand[], incomingCommands: ICommand[]) => {
  17. const filteredExisting = existingCommands.filter(
  18. (command) => command.id !== QUERY_PERFORMANCE_COMMAND_ID
  19. )
  20. return [...incomingCommands, ...filteredExisting]
  21. }
  22. }, [prioritizeQueryPerformance])
  23. const orderNavigateSection = useMemo<CommandOptions['orderSection'] | undefined>(() => {
  24. return prioritizeQueryPerformance ? orderSectionFirst : options?.orderSection
  25. }, [options?.orderSection, prioritizeQueryPerformance])
  26. useRegisterCommands(
  27. COMMAND_MENU_SECTIONS.NAVIGATE,
  28. reportsAll
  29. ? [
  30. {
  31. id: 'nav-reports',
  32. name: 'Reports',
  33. route: `/project/${ref}/reports`,
  34. defaultHidden: true,
  35. },
  36. {
  37. id: 'nav-reports-api',
  38. name: 'API Reports',
  39. route: `/project/${ref}/reports/api-overview`,
  40. defaultHidden: true,
  41. },
  42. {
  43. id: 'nav-reports-storage',
  44. name: 'Storage Reports',
  45. route: `/project/${ref}/reports/storage`,
  46. defaultHidden: true,
  47. },
  48. {
  49. id: 'nav-reports-database',
  50. name: 'Database Reports',
  51. route: `/project/${ref}/reports/database`,
  52. defaultHidden: true,
  53. },
  54. ]
  55. : [],
  56. {
  57. ...options,
  58. orderSection: orderNavigateSection,
  59. deps: [ref, orderNavigateSection, ...(options?.deps ?? [])],
  60. }
  61. )
  62. useRegisterCommands(
  63. COMMAND_MENU_SECTIONS.NAVIGATE,
  64. reportsAll
  65. ? [
  66. {
  67. id: QUERY_PERFORMANCE_COMMAND_ID,
  68. name: 'Query Performance Reports',
  69. route: `/project/${ref}/reports/query-performance`,
  70. defaultHidden: true,
  71. },
  72. ]
  73. : [],
  74. {
  75. ...options,
  76. orderCommands: orderQueryPerformanceCommand ?? options?.orderCommands,
  77. orderSection: orderNavigateSection,
  78. deps: [ref, orderQueryPerformanceCommand, orderNavigateSection, ...(options?.deps ?? [])],
  79. }
  80. )
  81. }