Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(explore-popover): Show disabled 'Save' button in explore popover #21318

Merged
merged 7 commits into from
Dec 7, 2022

Conversation

agl-developer
Copy link
Contributor

@agl-developer agl-developer commented Sep 3, 2022

SUMMARY

In the popover that we show in control panel, if there are no changes made we turn it into secondary button and user is still able to "save" the popover.

If there are no changes made in the popover use primary button in state "disabled"

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

Before:
Clipboard 2022-28-07 at 4 18 57 PM

After:
image

image

TESTING INSTRUCTIONS

  • Click on 'Charts' in the top menu bar
  • Select on option which shows a Popover

ADDITIONAL INFORMATION

  • Has associated issue:
  • Required feature flags:
  • Changes UI
  • Includes DB Migration (follow approval process in SIP-59)
    • Migration is atomic, supports rollback & is backwards-compatible
    • Confirm DB migration upgrade and downgrade tested
    • Runtime estimates and downtime expectations provided
  • Introduces new feature or API
  • Removes existing feature or API

@codecov
Copy link

codecov bot commented Sep 3, 2022

Codecov Report

Merging #21318 (02b2668) into master (4cf40fb) will increase coverage by 1.50%.
The diff coverage is 66.66%.

❗ Current head 02b2668 differs from pull request most recent head 2962bde. Consider uploading reports for the commit 2962bde to get more accurate results

@@            Coverage Diff             @@
##           master   #21318      +/-   ##
==========================================
+ Coverage   65.38%   66.88%   +1.50%     
==========================================
  Files        1847     1805      -42     
  Lines       70561    69034    -1527     
  Branches     7737     7368     -369     
==========================================
+ Hits        46137    46175      +38     
+ Misses      22417    20953    -1464     
+ Partials     2007     1906     -101     
Flag Coverage Δ
javascript 53.29% <66.66%> (-0.52%) ⬇️

Flags with carried forward coverage won't be shown. Click here to find out more.

Impacted Files Coverage Δ
...ols/DndColumnSelectControl/ColumnSelectPopover.tsx 3.37% <0.00%> (ø)
...ols/FilterControl/AdhocFilterEditPopover/index.jsx 70.21% <100.00%> (-0.63%) ⬇️
...ols/MetricControl/AdhocMetricEditPopover/index.jsx 76.59% <100.00%> (+1.06%) ⬆️
...trols/DateFilterControl/components/CommonFrame.tsx 0.00% <0.00%> (-57.15%) ⬇️
superset-frontend/src/utils/getDatasourceUid.ts 50.00% <0.00%> (-50.00%) ⬇️
...s/CRUD/data/dataset/AddDataset/LeftPanel/index.tsx 47.61% <0.00%> (-39.71%) ⬇️
...ontrols/DateFilterControl/utils/dateFilterUtils.ts 39.39% <0.00%> (-30.06%) ⬇️
...nts/controls/DateFilterControl/DateFilterLabel.tsx 35.71% <0.00%> (-19.61%) ⬇️
...-frontend/src/explore/reducers/saveModalReducer.js 30.00% <0.00%> (-15.46%) ⬇️
...t-frontend/src/dashboard/actions/dashboardState.js 37.05% <0.00%> (-15.40%) ⬇️
... and 448 more

📣 We’re building smart automated test selection to slash your CI/CD build times. Learn more

@geido
Copy link
Member

geido commented Sep 8, 2022

/testenv up

@github-actions
Copy link
Contributor

github-actions bot commented Sep 8, 2022

@geido Ephemeral environment spinning up at http://54.202.131.27:8080. Credentials are admin/admin. Please allow several minutes for bootstrapping and startup.

@geido
Copy link
Member

geido commented Sep 12, 2022

Hello @agl-developer a few things.

In other controls when the form is ready to be saved the buttons looks like the one in the screenshot. I think we shouldn't introduce inconsistencies unless we are going to change the behaviour for every control. Personally, I think what's shown in the screenshot is a clearer CTA.

Screenshot 2022-09-12 at 14 10 46

One more thing, when editing the SQL the control correctly allows me to save. However, if I revert the changes to the SQL statement to its original state before saving, it will still allow me to save even though there was no actual change compared to the previous state

@@ -118,26 +118,14 @@ test('Clicking on "Close" should call onClose', () => {
expect(props.onClose).toBeCalledTimes(1);
});

test('Clicking on "Save" should call onChange and onClose', () => {
test('Clicking on "Save" should not call onChange and onClose', () => {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I believe we need to separate the tests here for both calling and not calling

wrapper
.instance()
.onAdhocFilterChange(simpleAdhocFilter.duplicateWith({ operator: null }));
expect(wrapper.find(Button).find({ disabled: true })).toExist();
expect(wrapper.find(Button).find({ disabled: false })).toExist();
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Shouldn't the button be disabled at this point?

buttonStyle={
hasUnsavedChanges && stateIsValid ? 'primary' : 'default'
}
disabled={stateIsValid && !hasUnsavedChanges}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Shouldn't we account for an invalid state as well?

@geido
Copy link
Member

geido commented Oct 10, 2022

/testenv up

@github-actions
Copy link
Contributor

@geido Ephemeral environment spinning up at http://35.93.39.51:8080. Credentials are admin/admin. Please allow several minutes for bootstrapping and startup.

@geido
Copy link
Member

geido commented Oct 20, 2022

On top of the comments above to which I am still looking for an answer, I think there is another problem. When adding a new control the button shows enabled even though I haven't filled any of the required fields.

Screenshot 2022-10-20 at 16 30 20

@geido
Copy link
Member

geido commented Dec 7, 2022

/testenv up

@github-actions
Copy link
Contributor

github-actions bot commented Dec 7, 2022

@geido Ephemeral environment spinning up at http://54.245.47.220:8080. Credentials are admin/admin. Please allow several minutes for bootstrapping and startup.

Copy link
Member

@geido geido left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks @michael-s-molina LGTM!

@michael-s-molina michael-s-molina merged commit 0dbaaad into apache:master Dec 7, 2022
@github-actions
Copy link
Contributor

github-actions bot commented Dec 7, 2022

Ephemeral environment shutdown and build artifacts deleted.

@mistercrunch mistercrunch added 🏷️ bot A label used by `supersetbot` to keep track of which PR where auto-tagged with release labels 🚢 2.1.0 and removed 🚢 2.1.3 labels Mar 13, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🏷️ bot A label used by `supersetbot` to keep track of which PR where auto-tagged with release labels size/M 🚢 2.1.0
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants