supabase/apps/studio/components/grid/hooks/useOperationQueueShortcuts.ts

import { useQueryClient } from '@tanstack/react-query'

import { useOperationQueueActions } from './useOperationQueueActions'
import { useIsQueueOperationsEnabled } from '@/components/interfaces/Account/Preferences/useDashboardSettings'
import { tableRowKeys } from '@/data/table-rows/keys'
import { useSelectedProjectQuery } from '@/hooks/misc/useSelectedProject'
import { useHotKey } from '@/hooks/ui/useHotKey'
import { useTableEditorStateSnapshot } from '@/state/table-editor'

/**
 * Hook that provides keyboard shortcuts for the operation queue.
 *
 * Shortcuts:
 * - Cmd/Ctrl + S: Save all pending changes
 * - Cmd/Ctrl + .: Toggle the operation queue side panel
 *
 * These shortcuts are registered on the capture phase to ensure they fire
 * before the data grid handles the keyboard event.
 */
export function useOperationQueueShortcuts() {
  const queryClient = useQueryClient()
  const { data: project } = useSelectedProjectQuery()
  const isQueueOperationsEnabled = useIsQueueOperationsEnabled()
  const snap = useTableEditorStateSnapshot()
  const { handleSave } = useOperationQueueActions()

  const isSaving = snap.operationQueue.status === 'saving'
  const hasOperations = snap.hasPendingOperations
  const isEnabled = isQueueOperationsEnabled && hasOperations

  useHotKey(
    (event) => {
      event.preventDefault()
      event.stopPropagation()
      if (!isSaving && hasOperations) {
        handleSave()
      }
    },
    's',
    { enabled: isEnabled }
  )

  useHotKey(
    (event) => {
      event.preventDefault()
      event.stopPropagation()
      snap.toggleViewOperationQueue()
    },
    '.',
    { enabled: isEnabled }
  )

  useHotKey(
    (event) => {
      event.preventDefault()
      event.stopPropagation()

      const tableIdLatestOperation = snap.operationQueue.operations.at(-1)?.tableId
      snap.undoLatestOperation()

      // Invalidate the query to revert the optimistic update
      if (project && tableIdLatestOperation) {
        queryClient.invalidateQueries({
          queryKey: tableRowKeys.tableRowsAndCount(project.ref, tableIdLatestOperation),
        })
      }
    },
    'z',
    { enabled: isEnabled }
  )
}