fix(dashboard): offer Exit edit mode when there is nothing to discard (#42208)
Co-authored-by: Claude Code <noreply@anthropic.com>
diff --git a/superset-frontend/src/dashboard/components/Header/Header.test.tsx b/superset-frontend/src/dashboard/components/Header/Header.test.tsx
index 98397ec..6a6e5e4 100644
--- a/superset-frontend/src/dashboard/components/Header/Header.test.tsx
+++ b/superset-frontend/src/dashboard/components/Header/Header.test.tsx
@@ -522,12 +522,15 @@
expect(onRedo).not.toHaveBeenCalled();
});
-test('should render the "Discard" button as disabled', () => {
+test('should render an enabled "Exit edit mode" button when there are no unsaved changes', () => {
setup(editableState);
- expect(screen.getByRole('button', { name: /discard/i })).toBeDisabled();
+ expect(screen.getByRole('button', { name: /exit edit mode/i })).toBeEnabled();
+ expect(
+ screen.queryByRole('button', { name: /discard/i }),
+ ).not.toBeInTheDocument();
});
-test('should enable the "Discard" button when there are unsaved changes', () => {
+test('should render an enabled "Discard" button when there are unsaved changes', () => {
const unsavedState = {
...editableState,
dashboardState: {
@@ -537,6 +540,9 @@
};
setup(unsavedState);
expect(screen.getByRole('button', { name: /discard/i })).toBeEnabled();
+ expect(
+ screen.queryByRole('button', { name: /exit edit mode/i }),
+ ).not.toBeInTheDocument();
});
test('should render the "Save" button as disabled', () => {
diff --git a/superset-frontend/src/dashboard/components/Header/index.tsx b/superset-frontend/src/dashboard/components/Header/index.tsx
index ca3b875..283ff04 100644
--- a/superset-frontend/src/dashboard/components/Header/index.tsx
+++ b/superset-frontend/src/dashboard/components/Header/index.tsx
@@ -722,13 +722,14 @@
<Button
css={discardBtnStyle}
buttonSize="small"
- disabled={!hasUnsavedChanges}
onClick={discardChanges}
buttonStyle="secondary"
data-test="discard-changes-button"
- aria-label={t('Discard')}
+ aria-label={
+ hasUnsavedChanges ? t('Discard') : t('Exit edit mode')
+ }
>
- {t('Discard')}
+ {hasUnsavedChanges ? t('Discard') : t('Exit edit mode')}
</Button>
<Button
css={saveBtnStyle}