useFunctionsListShortcuts.ts 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. import { Dispatch, RefObject, SetStateAction } from 'react'
  2. import type { EdgeFunctionsSort } from '@/components/interfaces/EdgeFunctions/EdgeFunctionsSortDropdown'
  3. import { SHORTCUT_IDS } from '@/state/shortcuts/registry'
  4. import { useShortcut } from '@/state/shortcuts/useShortcut'
  5. const DEFAULT_SORT: EdgeFunctionsSort = 'name:asc'
  6. interface UseFunctionsListShortcutsParams {
  7. searchInputRef: RefObject<HTMLInputElement | null>
  8. setSearch: Dispatch<SetStateAction<string>> | ((value: string) => void)
  9. sort: EdgeFunctionsSort
  10. setSort: (value: EdgeFunctionsSort) => void
  11. canCreateNew: boolean
  12. onCreateNew: () => void
  13. onRefresh: () => void
  14. }
  15. export function useFunctionsListShortcuts({
  16. searchInputRef,
  17. setSearch,
  18. sort,
  19. setSort,
  20. canCreateNew,
  21. onCreateNew,
  22. onRefresh,
  23. }: UseFunctionsListShortcutsParams) {
  24. useShortcut(
  25. SHORTCUT_IDS.LIST_PAGE_FOCUS_SEARCH,
  26. () => {
  27. searchInputRef.current?.focus()
  28. searchInputRef.current?.select()
  29. },
  30. { label: 'Search functions' }
  31. )
  32. useShortcut(SHORTCUT_IDS.LIST_PAGE_NEW_ITEM, onCreateNew, {
  33. enabled: canCreateNew,
  34. label: 'Deploy a new function',
  35. })
  36. useShortcut(SHORTCUT_IDS.LIST_PAGE_RESET_FILTERS, () => {
  37. setSearch('')
  38. })
  39. useShortcut(SHORTCUT_IDS.FUNCTIONS_LIST_REFRESH, onRefresh)
  40. useShortcut(SHORTCUT_IDS.FUNCTIONS_LIST_CLEAR_SORT, () => setSort(DEFAULT_SORT), {
  41. enabled: sort !== DEFAULT_SORT,
  42. })
  43. }