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(dashboard): Implement empty states for empty tabs #19408

Merged
merged 5 commits into from
Apr 1, 2022

Conversation

kgabryje
Copy link
Member

SUMMARY

Add empty state to dashboard tabs (top level and normal ones) if they contain no components

  1. Top level tabs - if user has dashboard edit permissions, they see an additional description and a button that triggers edit mode. In edit mode, text changes and button redirects to "add chart" page
  2. Regular tabs - if user has dashboard edit permissions, they see an additional description. The description contains a link button that triggers edit mode. In edit mode, text changes and the link button redirects to "add chart" page.

Moreover, I added "Edit dashboard" button to 1 of old empty states (whole dashboard is empty) for consistency.

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

Screen.Recording.2022-03-29.at.14.34.12.mov

TESTING INSTRUCTIONS

  1. Create a dashboard
  2. Add top level tabs
  3. Verify that empty state appears and button redirects to add chart
  4. Save dashboard and verify that text changed and the button redirects to edit mode
  5. Add normal tabs
  6. Verify that "top level" empty state disappears, instead there's an empty state in newly added tabs. A link button in description should redirect to add chart page.
  7. Save chart, verify that text changed and link button redirects to edit mode.
  8. Change user to a one withtout dashboard edit permissions, verify that descriptions/buttons don't appear

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

CC @kasiazjc

@codecov
Copy link

codecov bot commented Mar 31, 2022

Codecov Report

Merging #19408 (8357c95) into master (6b136c2) will increase coverage by 0.00%.
The diff coverage is 63.63%.

@@           Coverage Diff           @@
##           master   #19408   +/-   ##
=======================================
  Coverage   66.57%   66.58%           
=======================================
  Files        1675     1675           
  Lines       64092    64112   +20     
  Branches     6519     6531   +12     
=======================================
+ Hits        42672    42688   +16     
- Misses      19729    19733    +4     
  Partials     1691     1691           
Flag Coverage Δ
javascript 51.27% <63.63%> (+0.01%) ⬆️

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

Impacted Files Coverage Δ
...erset-frontend/src/components/EmptyState/index.tsx 74.35% <ø> (+5.12%) ⬆️
...d/components/DashboardBuilder/DashboardBuilder.tsx 70.88% <0.00%> (-1.85%) ⬇️
...rontend/src/dashboard/containers/DashboardGrid.jsx 100.00% <ø> (ø)
...rontend/src/dashboard/components/DashboardGrid.jsx 62.50% <50.00%> (-0.55%) ⬇️
...nd/src/dashboard/components/gridComponents/Tab.jsx 83.67% <100.00%> (+3.18%) ⬆️

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 6b136c2...8357c95. Read the comment docs.

Copy link
Member

@villebro villebro left a comment

Choose a reason for hiding this comment

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

LGTM!

Comment on lines -58 to +64
const creteProps = () => ({
const createProps = () => ({
Copy link
Member

Choose a reason for hiding this comment

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

😆
image

@kgabryje kgabryje merged commit fc8cb22 into apache:master Apr 1, 2022
philipher29 pushed a commit to ValtechMobility/superset that referenced this pull request Jun 9, 2022
* feat(dashboard): Implement empty states in empty tabs

* Change button to in text link

* Add edit dashboard button to dashboard empty state

* Add tests

* Fix test
@mistercrunch mistercrunch added 🏷️ bot A label used by `supersetbot` to keep track of which PR where auto-tagged with release labels 🚢 2.0.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.0.0
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants