mirror of
https://github.com/OFFIS-ESC/constellation-analyzer
synced 2026-01-26 23:43:40 +00:00
refactor: replace redundant window.confirm with custom dialog
Removes duplicate confirmation dialogs when deleting documents. Previously, users were asked twice: once by the UI component's custom dialog and again by window.confirm in the store. Changes: - Remove window.confirm from workspaceStore deleteDocument function - Add useConfirm hook to DocumentTabs component for delete action - Consistent confirmation UX across DocumentManager and DocumentTabs Both components now show the same styled confirmation dialog with proper handling of unsaved changes warnings. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
parent
28f8224284
commit
94c7845ca7
2 changed files with 27 additions and 8 deletions
|
|
@ -1,6 +1,7 @@
|
|||
import { useCallback, useState } from 'react';
|
||||
import { useWorkspaceStore } from '../../stores/workspaceStore';
|
||||
import { useCreateDocument } from '../../hooks/useCreateDocument';
|
||||
import { useConfirm } from '../../hooks/useConfirm';
|
||||
import Tab from './Tab';
|
||||
import AddIcon from '@mui/icons-material/Add';
|
||||
import EditIcon from '@mui/icons-material/Edit';
|
||||
|
|
@ -37,6 +38,7 @@ const DocumentTabs = () => {
|
|||
} = useWorkspaceStore();
|
||||
|
||||
const { handleNewDocument, NewDocumentDialog } = useCreateDocument();
|
||||
const { confirm, ConfirmDialogComponent } = useConfirm();
|
||||
|
||||
const [draggedIndex, setDraggedIndex] = useState<number | null>(null);
|
||||
const [contextMenu, setContextMenu] = useState<{
|
||||
|
|
@ -124,11 +126,30 @@ const DocumentTabs = () => {
|
|||
setContextMenu(null);
|
||||
}, [contextMenu, closeDocument]);
|
||||
|
||||
const handleDeleteFromMenu = useCallback(() => {
|
||||
const handleDeleteFromMenu = useCallback(async () => {
|
||||
if (!contextMenu) return;
|
||||
deleteDocument(contextMenu.documentId);
|
||||
|
||||
const meta = documentMetadata.get(contextMenu.documentId);
|
||||
if (!meta) return;
|
||||
|
||||
const confirmTitle = 'Delete Document';
|
||||
const confirmMessage = meta.isDirty
|
||||
? `"${meta.title}" has unsaved changes. Delete anyway?`
|
||||
: `Are you sure you want to delete "${meta.title}"?`;
|
||||
|
||||
const confirmed = await confirm({
|
||||
title: confirmTitle,
|
||||
message: confirmMessage,
|
||||
confirmLabel: 'Delete',
|
||||
severity: 'danger',
|
||||
});
|
||||
|
||||
if (confirmed) {
|
||||
deleteDocument(contextMenu.documentId);
|
||||
}
|
||||
|
||||
setContextMenu(null);
|
||||
}, [contextMenu, deleteDocument]);
|
||||
}, [contextMenu, documentMetadata, deleteDocument, confirm]);
|
||||
|
||||
return (
|
||||
<div className="flex items-center bg-gray-100 border-b border-gray-300 overflow-x-auto">
|
||||
|
|
@ -219,6 +240,9 @@ const DocumentTabs = () => {
|
|||
/>
|
||||
)}
|
||||
|
||||
{/* Confirmation Dialog */}
|
||||
{ConfirmDialogComponent}
|
||||
|
||||
{/* New Document Dialog */}
|
||||
{NewDocumentDialog}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -367,11 +367,6 @@ export const useWorkspaceStore = create<Workspace & WorkspaceActions>((set, get)
|
|||
const state = get();
|
||||
|
||||
const metadata = state.documentMetadata.get(documentId);
|
||||
const confirmed = window.confirm(
|
||||
`Are you sure you want to delete "${metadata?.title}"? This cannot be undone.`
|
||||
);
|
||||
if (!confirmed) return false;
|
||||
|
||||
const docTitle = metadata?.title || 'Untitled';
|
||||
|
||||
// Delete from storage
|
||||
|
|
|
|||
Loading…
Reference in a new issue