feat(welcome): add SQL snippets to saved queries card #11678

pkdotson · 2020-11-12T21:58:29Z

SUMMARY

This Pr update the savedqueries card to the new proposed layout on welcome page. Also, updated media queries to keep text from expanding the cards to weird widths.

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

Before:

After:

TEST PLAN

ADDITIONAL INFORMATION

Has associated issue:
[x ] Changes UI
Requires DB Migration.
Confirm DB Migration upgrade and downgrade tested.
Introduces new feature or API
Removes existing feature or API

nytai · 2020-11-12T22:30:04Z

FYI, I discovered #11679 while testing this. You'll want to handle the null case in this PR too

nytai · 2020-11-12T22:40:28Z

Also, it looks card size changes based on the content. I'm not sure whether this is desirable or not. I just worked on query history page added a truncation function you might be interested in

https://github.com/apache/incubator-superset/blob/432e5ab4607fe4743562101336c63dcfd18b0867/superset-frontend/src/views/CRUD/data/query/QueryList.tsx#L52

codecov-io · 2020-11-13T17:39:55Z

Codecov Report

Merging #11678 (483821f) into master (84c8a62) will decrease coverage by 0.32%.
The diff coverage is 77.77%.

@@            Coverage Diff             @@
##           master   #11678      +/-   ##
==========================================
- Coverage   63.54%   63.22%   -0.33%     
==========================================
  Files         915      916       +1     
  Lines       44358    44476     +118     
  Branches     4221     4228       +7     
==========================================
- Hits        28189    28120      -69     
- Misses      15990    16177     +187     
  Partials      179      179

Flag	Coverage Δ
javascript	`62.94% <77.77%> (-0.02%)`	⬇️
python	`63.38% <ø> (-0.51%)`	⬇️

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

Impacted Files	Coverage Δ
...set-frontend/src/components/ListViewCard/index.tsx	`94.54% <ø> (ø)`
superset-frontend/src/views/CRUD/utils.tsx	`48.88% <60.00%> (+0.10%)`	⬆️
...t-frontend/src/views/CRUD/welcome/SavedQueries.tsx	`62.88% <80.00%> (+3.58%)`	⬆️
...t-frontend/src/views/CRUD/data/query/QueryList.tsx	`72.72% <100.00%> (+0.34%)`	⬆️
superset/db_engines/hive.py	`0.00% <0.00%> (-85.72%)`	⬇️
superset/db_engine_specs/hive.py	`54.08% <0.00%> (-29.97%)`	⬇️
superset/db_engine_specs/presto.py	`69.76% <0.00%> (-12.53%)`	⬇️
superset-frontend/src/utils/hostNamesConfig.js	`33.33% <0.00%> (-4.17%)`	⬇️
superset-frontend/src/featureFlags.ts	`86.36% <0.00%> (-3.64%)`	⬇️
superset/examples/world_bank.py	`97.10% <0.00%> (-2.90%)`	⬇️
... and 34 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 84c8a62...483821f. Read the comment docs.

junlincc · 2020-11-17T16:33:33Z

adding tooltip for long title display on hover. don't merge yet @rusackas

junlincc · 2020-11-18T06:07:27Z

just checked out this branch

can we get rid of the default Note in the query card?
what is "3"? it's not part of the query
add tooltip to show entire title

junlincc · 2020-11-24T03:56:56Z

LGTM, @rusackas let's merge! tooltip will come from a separate PR

superset-frontend/src/views/CRUD/utils.tsx

superset-frontend/images/empty-query.svg

superset-frontend/src/views/CRUD/welcome/SavedQueries.tsx

rusackas · 2020-11-24T07:41:32Z

superset-frontend/src/views/CRUD/welcome/SavedQueries.tsx

+const QueryContainer = styled.div`
+  pre {
+    height: ${({ theme }) => theme.gridUnit * 40}px;
+    border: none !important;


Ping me when you have a chance, we can pair up and see if there's a better selector to remove the need for !important here.

superset-frontend/src/views/CRUD/welcome/SavedQueries.tsx

rusackas · 2020-11-25T21:58:06Z

superset-frontend/src/views/CRUD/welcome/SavedQueries.tsx

+  .ant-card-cover {
+    border-bottom: 1px solid ${({ theme }) => theme.colors.grayscale.light2};
+    & > div {
+      height: 171px;


This can be an experiment for another PR, but if this card is basically a text box, we may be able to base its height on the number of lines set elsewhere in the JS. That is, if line-height is pulled from the Theme variables, the height could be numLines * lineHeight. Anyway, something to fiddle with to make this a little more dynamic.

rusackas

Lookin' good to me, just one little nit to fix (I made a code suggestion)

superset-frontend/images/empty-query.svg

Co-authored-by: Evan Rusackas <evan@preset.io>

junlincc · 2020-11-30T22:09:59Z

#11659

superset-github-bot bot added the preset-io label Nov 12, 2020

pull-request-size bot added the size/L label Nov 12, 2020

pkdotson closed this Nov 12, 2020

pkdotson reopened this Nov 12, 2020

pkdotson marked this pull request as draft November 12, 2020 22:04

pkdotson force-pushed the phillip/saved-queries-card-fix branch from 4fb8811 to 9c67b4f Compare November 13, 2020 17:19

pkdotson force-pushed the phillip/saved-queries-card-fix branch from e4abfde to 52c093b Compare November 16, 2020 19:40

pkdotson marked this pull request as ready for review November 16, 2020 20:00

junlincc requested review from rusackas, nytai and ktmud November 16, 2020 22:39

junlincc added rush! Requires immediate attention and removed rush! Requires immediate attention labels Nov 16, 2020

pkdotson force-pushed the phillip/saved-queries-card-fix branch from 2d5c4df to f717b71 Compare November 24, 2020 00:09

junlincc requested review from junlincc and removed request for nytai November 24, 2020 03:57

junlincc approved these changes Nov 24, 2020

View reviewed changes

ktmud changed the title ~~chore: update savedqueries card to new layout~~ feat(welcome): add SQL snippets to saved queries card Nov 24, 2020

ktmud reviewed Nov 24, 2020

View reviewed changes

superset-frontend/src/views/CRUD/utils.tsx Show resolved Hide resolved

rusackas reviewed Nov 24, 2020

View reviewed changes

superset-frontend/images/empty-query.svg Show resolved Hide resolved

rusackas reviewed Nov 24, 2020

View reviewed changes

superset-frontend/src/views/CRUD/welcome/SavedQueries.tsx Outdated Show resolved Hide resolved

rusackas reviewed Nov 24, 2020

View reviewed changes

pkdotson requested review from nytai and rusackas November 25, 2020 01:35

pkdotson requested a review from ktmud November 25, 2020 01:35

pkdotson added 10 commits November 25, 2020 07:33

update savedqueries card to new layout

bfd6ad6

update card

cc7b6fc

update card to latest mock

e9bbb11

update empty state

f12ebbe

remove fallback

1e28fa2

fix query statement

4956464

update card styles

443ae67

remove double import

3b0857f

use fallbackurl prop for emptystate

16f00d6

update line lenth

d611270

pkdotson force-pushed the phillip/saved-queries-card-fix branch from 301975c to d611270 Compare November 25, 2020 15:41

rusackas reviewed Nov 25, 2020

View reviewed changes

superset-frontend/src/views/CRUD/welcome/SavedQueries.tsx Outdated Show resolved Hide resolved

rusackas reviewed Nov 25, 2020

View reviewed changes

rusackas requested changes Nov 25, 2020

View reviewed changes

rusackas reviewed Nov 25, 2020

View reviewed changes

superset-frontend/images/empty-query.svg Outdated Show resolved Hide resolved

Update superset-frontend/src/views/CRUD/welcome/SavedQueries.tsx

483821f

Co-authored-by: Evan Rusackas <evan@preset.io>

rusackas approved these changes Nov 26, 2020

View reviewed changes

update styles and svg

22060d5

rusackas merged commit 0e9898c into apache:master Nov 30, 2020

rusackas deleted the phillip/saved-queries-card-fix branch November 30, 2020 19:53

junlincc added the rush! Requires immediate attention label Nov 30, 2020

junlincc removed the rush! Requires immediate attention label Mar 18, 2021

mistercrunch added 🏷️ bot A label used by `supersetbot` to keep track of which PR where auto-tagged with release labels 🚢 1.0.0 labels Mar 12, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(welcome): add SQL snippets to saved queries card #11678

feat(welcome): add SQL snippets to saved queries card #11678

pkdotson commented Nov 12, 2020 •

edited

Loading

nytai commented Nov 12, 2020

nytai commented Nov 12, 2020

codecov-io commented Nov 13, 2020 •

edited

Loading

junlincc commented Nov 17, 2020

junlincc commented Nov 18, 2020 •

edited

Loading

junlincc commented Nov 24, 2020 •

edited

Loading

rusackas Nov 24, 2020

rusackas Nov 25, 2020

rusackas left a comment

junlincc commented Nov 30, 2020

feat(welcome): add SQL snippets to saved queries card #11678

feat(welcome): add SQL snippets to saved queries card #11678

Conversation

pkdotson commented Nov 12, 2020 • edited Loading

SUMMARY

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

TEST PLAN

ADDITIONAL INFORMATION

nytai commented Nov 12, 2020

nytai commented Nov 12, 2020

codecov-io commented Nov 13, 2020 • edited Loading

Codecov Report

junlincc commented Nov 17, 2020

junlincc commented Nov 18, 2020 • edited Loading

junlincc commented Nov 24, 2020 • edited Loading

rusackas Nov 24, 2020

Choose a reason for hiding this comment

rusackas Nov 25, 2020

Choose a reason for hiding this comment

rusackas left a comment

Choose a reason for hiding this comment

junlincc commented Nov 30, 2020

pkdotson commented Nov 12, 2020 •

edited

Loading

codecov-io commented Nov 13, 2020 •

edited

Loading

junlincc commented Nov 18, 2020 •

edited

Loading

junlincc commented Nov 24, 2020 •

edited

Loading