diff --git a/apps/studio/components/grid/components/footer/operations/SaveQueueActionBar.tsx b/apps/studio/components/grid/components/footer/operations/SaveQueueActionBar.tsx index 65be243d127..c554f2065dc 100644 --- a/apps/studio/components/grid/components/footer/operations/SaveQueueActionBar.tsx +++ b/apps/studio/components/grid/components/footer/operations/SaveQueueActionBar.tsx @@ -1,21 +1,22 @@ -import { Eye } from 'lucide-react' +import { useOperationQueueActions } from 'components/grid/hooks/useOperationQueueActions' +import { useOperationQueueShortcuts } from 'components/grid/hooks/useOperationQueueShortcuts' +import { useIsQueueOperationsEnabled } from 'components/interfaces/App/FeaturePreview/FeaturePreviewContext' import { AnimatePresence, motion } from 'framer-motion' +import { Eye } from 'lucide-react' import { createPortal } from 'react-dom' +import { useTableEditorStateSnapshot } from 'state/table-editor' import { Button } from 'ui' -import { - useOperationQueueShortcuts, - getModKey, -} from 'components/grid/hooks/useOperationQueueShortcuts' -import { useIsQueueOperationsEnabled } from 'components/interfaces/App/FeaturePreview/FeaturePreviewContext' -import { useTableEditorStateSnapshot } from 'state/table-editor' -import { useOperationQueueActions } from 'components/grid/hooks/useOperationQueueActions' +import { getModKeyLabel } from '@/lib/helpers' export const SaveQueueActionBar = () => { + const modKey = getModKeyLabel() const snap = useTableEditorStateSnapshot() const isQueueOperationsEnabled = useIsQueueOperationsEnabled() const { handleSave } = useOperationQueueActions() + useOperationQueueShortcuts() + const operationCount = snap.operationQueue.operations.length const isSaving = snap.operationQueue.status === 'saving' const isOperationQueuePanelOpen = snap.sidePanel?.type === 'operation-queue' @@ -23,16 +24,6 @@ export const SaveQueueActionBar = () => { const isVisible = isQueueOperationsEnabled && snap.hasPendingOperations && !isOperationQueuePanelOpen - useOperationQueueShortcuts({ - enabled: isQueueOperationsEnabled && snap.hasPendingOperations, - onSave: handleSave, - onTogglePanel: () => snap.onViewOperationQueue(), - isSaving, - hasOperations: operationCount > 0, - }) - - const modKey = getModKey() - const content = ( {isVisible && ( @@ -49,7 +40,7 @@ export const SaveQueueActionBar = () => {
-