random-mirrors/cosmos-explorer
1
0
Fork 0
mirror of https://github.com/Azure/cosmos-explorer.git synced 2025-02-01 13:46:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix UX issue with not discarding edit changes

Browse Source
This commit is contained in:
Laurent Nguyen 2024-03-28 11:43:04 +01:00
parent 8d099b9c1b
commit 98c4d31717
1 changed files with 42 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/Explorer/Tabs/DocumentsTabV2/DocumentsTabV2.tsx
View File

@ -350,22 +350,27 @@ const DocumentsTabComponent: React.FunctionComponent<{
} }
}, [documentsIterator]); }, [documentsIterator]);
const onNewDocumentClick = useCallback((): void => { const confirmDiscardingChange = (onDiscard: () => void, onCancelDiscard?: () => void): void => {
if (isEditorDirty()) { if (isEditorDirty()) {
useDialog useDialog
.getState() .getState()
.showOkCancelModalDialog( .showOkCancelModalDialog(
"Unsaved changes", "Unsaved changes",
"Changes will be lost. Do you want to continue?", "Your unsaved changes will be lost. Do you want to continue?",
"OK", "OK",
() => initializeNewDocument(), onDiscard,
"Cancel", "Cancel",
undefined, onCancelDiscard,
); );
} else { } else {
initializeNewDocument(); onDiscard();
} }
}, [editorState /* TODO isEditorDirty depends on more than just editorState */]); };
const onNewDocumentClick = useCallback(
(): void => confirmDiscardingChange(() => initializeNewDocument()),
[editorState /* TODO isEditorDirty depends on more than just editorState */],
);
const initializeNewDocument = (): void => { const initializeNewDocument = (): void => {
// this.selectedDocumentId(null); // this.selectedDocumentId(null);
@ -992,21 +997,7 @@ const DocumentsTabComponent: React.FunctionComponent<{
const onDocumentClicked = (tabRowId: TableRowId) => { const onDocumentClicked = (tabRowId: TableRowId) => {
const index = tabRowId as number; const index = tabRowId as number;
setClickedRow(index); setClickedRow(index);
if (isEditorDirty()) {
useDialog
.getState()
.showOkCancelModalDialog(
"Unsaved changes",
"Your unsaved changes will be lost. Do you want to continue?",
"OK",
() => loadDocument(documentIds[index]),
"Cancel",
undefined,
);
} else {
loadDocument(documentIds[index]); loadDocument(documentIds[index]);
}
}; };
const loadDocument = (documentId: DocumentId) => const loadDocument = (documentId: DocumentId) =>
@ -1102,24 +1093,29 @@ const DocumentsTabComponent: React.FunctionComponent<{
}; };
const onSelectedRowsChange = (selectedRows: Set<TableRowId>) => { const onSelectedRowsChange = (selectedRows: Set<TableRowId>) => {
confirmDiscardingChange(() => {
if (selectedRows.size === 0) { if (selectedRows.size === 0) {
setSelectedDocumentContent(undefined); setSelectedDocumentContent(undefined);
setClickedRow(undefined); setClickedRow(undefined);
setEditorState(ViewModels.DocumentExplorerState.noDocumentSelected);
} }
// Find if clickedRow is in selectedRows.If not, clear clickedRow and content // Find if clickedRow is in selectedRows.If not, clear clickedRow and content
if (clickedRow !== undefined && !selectedRows.has(clickedRow)) { if (clickedRow !== undefined && !selectedRows.has(clickedRow)) {
setClickedRow(undefined); setClickedRow(undefined);
setSelectedDocumentContent(undefined); setSelectedDocumentContent(undefined);
setEditorState(ViewModels.DocumentExplorerState.noDocumentSelected);
} }
// If only one selection, we consider as a click // If only one selection, we consider as a click
if (selectedRows.size === 1) { if (selectedRows.size === 1) {
const selectedRow = Array.from(selectedRows)[0]; const selectedRow = Array.from(selectedRows)[0];
onDocumentClicked(selectedRow); onDocumentClicked(selectedRow);
setEditorState(ViewModels.DocumentExplorerState.exisitingDocumentNoEdits);
} }
setSelectedRows(selectedRows); setSelectedRows(selectedRows);
});
}; };
return ( return (