feat: add sticky state to tables and loadingcards state.

[pkdotson]

SUMMARY

This pr enhances homepage with sticky states for the tables and add loadingcards states and fix padding issues on minified cards.

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

Screen.Recording.2021-08-05.at.6.00.49.PM.mov

TESTING INSTRUCTIONS

Go to homepage and and clip collapse tables to ensure they stick.

ADDITIONAL INFORMATION

• Has associated issue:
• 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]

Codecov Report

Merging #16102 (4c2d99a) into master (11a2d4d) will decrease coverage by 0.03%.
The diff coverage is 92.30%.

@@            Coverage Diff             @@
##           master   #16102      +/-   ##
==========================================
- Coverage   76.87%   76.83%   -0.04%     
==========================================
  Files         995      995              
  Lines       52876    52916      +40     
  Branches     6720     6734      +14     
==========================================
+ Hits        40647    40660      +13     
- Misses      12003    12031      +28     
+ Partials      226      225       -1     

Flag	Coverage Δ
javascript	71.21% <92.30%> (-0.07%)	⬇️

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

Impacted Files	Coverage Δ
...-frontend/src/views/CRUD/welcome/ActivityTable.tsx	78.26% <50.00%> (ø)
...perset-frontend/src/views/CRUD/welcome/Welcome.tsx	82.96% <93.33%> (+0.01%)	⬆️
superset-frontend/src/views/CRUD/storageKeys.ts	100.00% <100.00%> (ø)
superset-frontend/src/views/CRUD/utils.tsx	68.85% <100.00%> (+0.25%)	⬆️
...set-frontend/src/views/CRUD/welcome/ChartTable.tsx	75.00% <100.00%> (+0.31%)	⬆️
...frontend/src/views/CRUD/welcome/DashboardTable.tsx	66.30% <100.00%> (+0.37%)	⬆️
...t-frontend/src/views/CRUD/welcome/SavedQueries.tsx	59.59% <100.00%> (ø)
...ontrols/DndColumnSelectControl/DndColumnSelect.tsx	47.36% <0.00%> (-13.75%)	⬇️
...src/dashboard/components/PropertiesModal/index.jsx	83.09% <0.00%> (-2.52%)	⬇️
...plore/components/controls/OptionControls/index.tsx	88.88% <0.00%> (-1.54%)	⬇️
... and 16 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 11a2d4d...4c2d99a. Read the comment docs.

[pkdotson]

/testenv up FEATURE_THUMBNAILS=true

[github-actions]

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

[michael-s-molina]

@pkdotson When the panels are collapsed and you refresh, it first renders all the cards and then collapses. Can we make it not render any panels for collapsed cards?

[pkdotson]

/testenv up FEATURE_THUMBNAILS=true

[github-actions]

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

[rusackas]

Looking good! And approving! I made one more comment about a const, and also noticed this little issue, which could be tackled in a separate PR or this one (since the issue is ALMOST fixed by this PR):

As you can barely see in this GIF, when changing tabs, the loading state looks great, but goes higher up very briefly because the row containing the tabs very briefly disappears from the layout when switching tabs. If that disappearance can be solved, so it just changes without "blinking" we should be in awesome shape! Again, maybe this is a follow-up PR and not a blocker for this one. CC @junlincc for any ticketing/prioritization awareness.

[github-actions]

Ephemeral environment shutdown and build artifacts deleted.

[rosemarie-chiu]

🏷 2021.31