random-mirrors/cosmos-explorer
1
0
Fork 0
mirror of https://github.com/Azure/cosmos-explorer.git synced 2025-06-04 22:52:31 +01: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]);
const onNewDocumentClick = useCallback((): void => {
const confirmDiscardingChange = (onDiscard: () => void, onCancelDiscard?: () => void): void => {
if (isEditorDirty()) {
useDialog
.getState()
.showOkCancelModalDialog(
"Unsaved changes",
"Changes will be lost. Do you want to continue?",
"Your unsaved changes will be lost. Do you want to continue?",
"OK",
() => initializeNewDocument(),
onDiscard,
"Cancel",
undefined,
onCancelDiscard,
);
} 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 => {
// this.selectedDocumentId(null);
@ -992,21 +997,7 @@ const DocumentsTabComponent: React.FunctionComponent<{
const onDocumentClicked = (tabRowId: TableRowId) => {
const index = tabRowId as number;
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]);
}
};
const loadDocument = (documentId: DocumentId) =>
@ -1102,24 +1093,29 @@ const DocumentsTabComponent: React.FunctionComponent<{
};
const onSelectedRowsChange = (selectedRows: Set<TableRowId>) => {
confirmDiscardingChange(() => {
if (selectedRows.size === 0) {
setSelectedDocumentContent(undefined);
setClickedRow(undefined);
setEditorState(ViewModels.DocumentExplorerState.noDocumentSelected);
}
// Find if clickedRow is in selectedRows.If not, clear clickedRow and content
if (clickedRow !== undefined && !selectedRows.has(clickedRow)) {
setClickedRow(undefined);
setSelectedDocumentContent(undefined);
setEditorState(ViewModels.DocumentExplorerState.noDocumentSelected);
}
// If only one selection, we consider as a click
if (selectedRows.size === 1) {
const selectedRow = Array.from(selectedRows)[0];
onDocumentClicked(selectedRow);
setEditorState(ViewModels.DocumentExplorerState.exisitingDocumentNoEdits);
}
setSelectedRows(selectedRows);
});
};
return (