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

chore(newchart): update chart creation dataset selection help text, styles #20369

Conversation

codyml
Copy link
Member

@codyml codyml commented Jun 13, 2022

SUMMARY

  • Update help text to be "Add a dataset or view instructions."
  • Make "Add a dataset" link to the dataset CRUD page in a new tab with the + Dataset modal open
    • Add support for a #create URL hash on the dataset CRUD page that opens the + Dataset modal at load
  • Make "view instructions" link to the documentation in a new tab, as before
  • Update font styles and spacing on page

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

Before:
before

After:
after

TESTING INSTRUCTIONS

  • Visit /chart/add and open the "Choose a dataset" select.
  • Confirm that clicking "Add a dataset" opens /tablemodelview/list in a new tab with the "Add dataset" modal open.

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

@codyml codyml marked this pull request as draft June 13, 2022 23:03
@codecov
Copy link

codecov bot commented Jun 13, 2022

Codecov Report

Merging #20369 (ab28ae4) into master (f53018c) will decrease coverage by 0.14%.
The diff coverage is 85.31%.

❗ Current head ab28ae4 differs from pull request most recent head 105ee69. Consider uploading reports for the commit 105ee69 to get more accurate results

@@            Coverage Diff             @@
##           master   #20369      +/-   ##
==========================================
- Coverage   66.70%   66.56%   -0.15%     
==========================================
  Files        1739     1738       -1     
  Lines       65148    65119      -29     
  Branches     6897     6899       +2     
==========================================
- Hits        43457    43345     -112     
- Misses      19938    20020      +82     
- Partials     1753     1754       +1     
Flag Coverage Δ
hive ?
mysql 82.33% <88.73%> (+0.07%) ⬆️
postgres 82.40% <88.73%> (+0.07%) ⬆️
presto ?
python 82.48% <88.73%> (-0.29%) ⬇️
sqlite 82.19% <88.73%> (+0.07%) ⬆️
unit ?

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

Impacted Files Coverage Δ
...chart-controls/src/shared-controls/dndControls.tsx 26.92% <ø> (ø)
...ui-core/src/chart/components/FallbackComponent.tsx 100.00% <ø> (ø)
...packages/superset-ui-core/src/query/types/Query.ts 100.00% <ø> (ø)
.../plugins/plugin-chart-echarts/src/BoxPlot/types.ts 0.00% <ø> (ø)
.../plugin-chart-echarts/src/Funnel/transformProps.ts 71.73% <ø> (ø)
...d/plugins/plugin-chart-echarts/src/Funnel/types.ts 100.00% <ø> (ø)
...nd/plugins/plugin-chart-echarts/src/Gauge/types.ts 100.00% <ø> (ø)
...nd/plugins/plugin-chart-echarts/src/Graph/types.ts 100.00% <ø> (ø)
...chart-echarts/src/MixedTimeseries/controlPanel.tsx 65.00% <ø> (ø)
.../plugin-chart-echarts/src/MixedTimeseries/types.ts 100.00% <ø> (ø)
... and 103 more

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update f53018c...105ee69. Read the comment docs.

@michael-s-molina
Copy link
Member

Make "Choose a dataset" select element refresh its options on load so newly-added datasets are included

@codyml I think adding an option to disable the cache is not the optimal solution. Especially because users will not create new datasets most of the time. A better solution is to provide a way for invalidating the cache when necessary, giving more control to the developers. We can use the ref for this purpose. Let me submit a PR adding this feature and you can rebase your PR on top of it.

@codyml codyml changed the title [WIP] chore(newchart): update chart creation dataset selection help text, dropdown, styles chore(newchart): update chart creation dataset selection help text, styles Jun 15, 2022
@codyml codyml changed the title chore(newchart): update chart creation dataset selection help text, styles [WIP] chore(newchart): update chart creation dataset selection help text, styles Jun 15, 2022
@codyml codyml force-pushed the codyml/sc-47187/update-dataset-help-text-docs-link-on-chart branch from 5b460da to cb38b1f Compare June 15, 2022 19:21
@codyml codyml changed the title [WIP] chore(newchart): update chart creation dataset selection help text, styles chore(newchart): update chart creation dataset selection help text, styles Jun 15, 2022
@codyml
Copy link
Member Author

codyml commented Jun 15, 2022

@michael-s-molina Re: opening the + Dataset modal via URL: I tried changing the trigger from hash #create to query param (create=true), but the table on the page clears the query params and sets its own as soon as it renders and though I didn't dig into it too deeply, it seemed like adjusting that behavior to allow my create=true one to survive long enough to be read would be a challenge. OK to leave it as a hash or want me to keep working on making it a query param?

@codyml codyml marked this pull request as ready for review June 15, 2022 19:35
@ktmud
Copy link
Member

ktmud commented Jun 15, 2022

Can we maybe make the "Add dataset" modal reusable and open the modal directly from the "Add a dataset" link here?

Also, it seems the current "Add a dataset" modal supports only adding a physical dataset. We should probably design a way for users to create virtual datasets here, too.

@codyml
Copy link
Member Author

codyml commented Jun 15, 2022

Can we maybe make the "Add dataset" modal reusable and open the modal directly from the "Add a dataset" link here?

Also, it seems the current "Add a dataset" modal supports only adding a physical dataset. We should probably design a way for users to create virtual datasets here, too.

That all sounds reasonable to me, but from what I can tell the addSlice page creates its own React tree so it might take some work to get the working modal to render there. Maybe as a separate issue?

@codyml codyml force-pushed the codyml/sc-47187/update-dataset-help-text-docs-link-on-chart branch from cb38b1f to 8198868 Compare June 15, 2022 21:22
@ktmud
Copy link
Member

ktmud commented Jun 15, 2022

Unless there is immediate urgency in adding this feature right now, I'd say we should implement the optimal user experience in one go instead of shipping something we'd likely to change again very soon. The redesign of the add dataset model should definitely be future work, but the reusing the modal shouldn't be that difficult as there are very limited number of input fields in it...

@codyml
Copy link
Member Author

codyml commented Jun 16, 2022

@ktmud After some digging it looks like bringing the addSlice page into the SPA is on the Preset roadmap for the near future, so if we hold off on bringing the modal in until that's done we won't have to reproduce its state and API dependencies.

@codyml codyml force-pushed the codyml/sc-47187/update-dataset-help-text-docs-link-on-chart branch from 8198868 to dfe7eb0 Compare June 17, 2022 16:26
@michael-s-molina
Copy link
Member

/testenv up

@github-actions
Copy link
Contributor

@michael-s-molina Ephemeral environment spinning up at http://34.221.182.114:8080. Credentials are admin/admin. Please allow several minutes for bootstrapping and startup.

@michael-s-molina
Copy link
Member

@michael-s-molina Re: opening the + Dataset modal via URL: I tried changing the trigger from hash #create to query param (create=true), but the table on the page clears the query params and sets its own as soon as it renders and though I didn't dig into it too deeply, it seemed like adjusting that behavior to allow my create=true one to survive long enough to be read would be a challenge. OK to leave it as a hash or want me to keep working on making it a query param?

I think it's ok to use the hash if we consider the modal as a subordinate of the listing.

@pull-request-size pull-request-size bot added size/L and removed size/M labels Jun 17, 2022
@codyml codyml force-pushed the codyml/sc-47187/update-dataset-help-text-docs-link-on-chart branch 2 times, most recently from 0818031 to bd35ee5 Compare June 17, 2022 21:43
@codyml codyml force-pushed the codyml/sc-47187/update-dataset-help-text-docs-link-on-chart branch from bd35ee5 to 33090fe Compare June 17, 2022 22:30
@michael-s-molina
Copy link
Member

/testenv up

@github-actions
Copy link
Contributor

@michael-s-molina Ephemeral environment spinning up at http://34.222.96.94:8080. Credentials are admin/admin. Please allow several minutes for bootstrapping and startup.

Copy link
Member

@michael-s-molina michael-s-molina left a comment

Choose a reason for hiding this comment

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

Thanks for the work @codyml! As agreed, we'll work on syncing the Select dataset and opening the modal in place in a follow-up PR after the SPA work. I left some non-blocking suggestions.

superset-frontend/src/addSlice/AddSliceContainer.test.tsx Outdated Show resolved Hide resolved
superset-frontend/src/addSlice/AddSliceContainer.test.tsx Outdated Show resolved Hide resolved
superset-frontend/src/addSlice/AddSliceContainer.test.tsx Outdated Show resolved Hide resolved
superset-frontend/src/addSlice/AddSliceContainer.test.tsx Outdated Show resolved Hide resolved
superset-frontend/src/addSlice/AddSliceContainer.test.tsx Outdated Show resolved Hide resolved
superset-frontend/src/addSlice/AddSliceContainer.test.tsx Outdated Show resolved Hide resolved
superset-frontend/src/addSlice/AddSliceContainer.test.tsx Outdated Show resolved Hide resolved
Co-authored-by: Michael S. Molina <70410625+michael-s-molina@users.noreply.github.com>
@michael-s-molina michael-s-molina merged commit 44c5e28 into apache:master Jun 21, 2022
@codyml codyml deleted the codyml/sc-47187/update-dataset-help-text-docs-link-on-chart branch June 21, 2022 17:02
@github-actions
Copy link
Contributor

Ephemeral environment shutdown and build artifacts deleted.

akshatsri pushed a commit to charan1314/superset that referenced this pull request Jul 19, 2022
…tyles (apache#20369)

* Update dataset selection help text.

* Update 'Create a new chart' flow styles.

* Add support for linking directly to Create Dataset modal via URL hash.

* Add support for linking directly to Create Dataset modal via URL hash.

* Update dataset help text to not include spaces in translated strings and only include an 'Add dataset' link when user has permission to add dataset.

* Clean up test file

Co-authored-by: Michael S. Molina <70410625+michael-s-molina@users.noreply.github.com>

Co-authored-by: Michael S. Molina <70410625+michael-s-molina@users.noreply.github.com>
@mistercrunch mistercrunch added 🏷️ bot A label used by `supersetbot` to keep track of which PR where auto-tagged with release labels 🚢 2.1.0 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/L 🚢 2.1.0
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants