chore(Explore): Change text when saving a chart in a new dashboard (a…

…pache#19467) * Change text when new dashboard * Test buttons behavior
ValtechMobility · Jun 9, 2022 · 3e2014d · 3e2014d
1 parent 5df39a2
commit 3e2014d
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 1 deletion.
diff --git a/superset-frontend/src/explore/components/SaveModal.test.jsx b/superset-frontend/src/explore/components/SaveModal.test.jsx
@@ -95,9 +95,36 @@ describe('SaveModal', () => {
     expect(wrapper.find(Radio)).toHaveLength(2);
 
     const footerWrapper = shallow(wrapper.find(StyledModal).props().footer);
+
     expect(footerWrapper.find(Button)).toHaveLength(3);
   });
 
+  it('renders the right footer buttons when an existing dashboard', () => {
+    const wrapper = getWrapper();
+    const footerWrapper = shallow(wrapper.find(StyledModal).props().footer);
+    const saveAndGoDash = footerWrapper
+      .find('#btn_modal_save_goto_dash')
+      .getElement();
+    const save = footerWrapper.find('#btn_modal_save').getElement();
+    expect(save.props.children).toBe('Save');
+    expect(saveAndGoDash.props.children).toBe('Save & go to dashboard');
+  });
+
+  it('renders the right footer buttons when a new dashboard', () => {
+    const wrapper = getWrapper();
+    wrapper.setState({
+      saveToDashboardId: null,
+      newDashboardName: 'Test new dashboard',
+    });
+    const footerWrapper = shallow(wrapper.find(StyledModal).props().footer);
+    const saveAndGoDash = footerWrapper
+      .find('#btn_modal_save_goto_dash')
+      .getElement();
+    const save = footerWrapper.find('#btn_modal_save').getElement();
+    expect(save.props.children).toBe('Save to new dashboard');
+    expect(saveAndGoDash.props.children).toBe('Save & go to new dashboard');
+  });
+
   it('overwrite radio button is disabled for new slice', () => {
     const wrapper = getWrapper();
     wrapper.setProps({ slice: null });

diff --git a/superset-frontend/src/explore/components/SaveModal.tsx b/superset-frontend/src/explore/components/SaveModal.tsx
@@ -76,6 +76,11 @@ class SaveModal extends React.Component<SaveModalProps, SaveModalState> {
     this.onSliceNameChange = this.onSliceNameChange.bind(this);
     this.changeAction = this.changeAction.bind(this);
     this.saveOrOverwrite = this.saveOrOverwrite.bind(this);
+    this.isNewDashboard = this.isNewDashboard.bind(this);
+  }
+
+  isNewDashboard(): boolean {
+    return !!(!this.state.saveToDashboardId && this.state.newDashboardName);
   }
 
   canOverwriteSlice(): boolean {
@@ -195,7 +200,9 @@ class SaveModal extends React.Component<SaveModalProps, SaveModalState> {
               }
               onClick={() => this.saveOrOverwrite(true)}
             >
-              {t('Save & go to dashboard')}
+              {this.isNewDashboard()
+                ? t('Save & go to new dashboard')
+                : t('Save & go to dashboard')}
             </Button>
             <Button
               id="btn_modal_save"
@@ -207,6 +214,8 @@ class SaveModal extends React.Component<SaveModalProps, SaveModalState> {
             >
               {!this.canOverwriteSlice() && this.props.slice
                 ? t('Save as new chart')
+                : this.isNewDashboard()
+                ? t('Save to new dashboard')
                 : t('Save')}
             </Button>
           </div>