feat(chart): add feature flag that displays the data pane closed by default

[victorarbuesmallada]

SUMMARY

Currently the Data section in the Chart screen is open or not depending on what the user has done previously in other charts (i.e. a flag is kept in the local storage that determines if theData section will need to be render or not depending of what the user's done in other chart screens).
Our team decided that we want that screen to have that section collapsed until the user clicks on the caret that opens it.

TESTING INSTRUCTIONS

After setting the new flag (DATAPANEL_CLOSED_BY_DEFAULT) to true, every time the chart screen is loaded it should have the Data section collapsed.

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]

Codecov Report

Merging #21649 (9179253) into master (3057e42) will decrease coverage by 11.37%.
The diff coverage is 60.00%.

@@             Coverage Diff             @@
##           master   #21649       +/-   ##
===========================================
- Coverage   66.82%   55.45%   -11.38%     
===========================================
  Files        1799     1799               
  Lines       68867    68874        +7     
  Branches     7314     7318        +4     
===========================================
- Hits        46022    38192     -7830     
- Misses      20966    28798     +7832     
- Partials     1879     1884        +5     

Flag	Coverage Δ
hive	52.91% <ø> (ø)
javascript	53.14% <60.00%> (-0.02%)	⬇️
postgres	?
presto	52.81% <ø> (ø)
python	57.91% <ø> (-23.49%)	⬇️
sqlite	?
unit	50.95% <ø> (ø)

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

Impacted Files	Coverage Δ
...ackages/superset-ui-core/src/utils/featureFlags.ts	100.00% <ø> (ø)
...ntend/src/explore/components/ExploreChartPanel.jsx	69.73% <0.00%> (-1.89%)	⬇️
superset/config.py	90.96% <ø> (-0.65%)	⬇️
...plore/components/DataTablesPane/DataTablesPane.tsx	81.39% <100.00%> (+0.90%)	⬆️
superset/utils/dashboard_import_export.py	0.00% <0.00%> (-100.00%)	⬇️
superset/tags/core.py	4.54% <0.00%> (-95.46%)	⬇️
superset/key_value/commands/update.py	0.00% <0.00%> (-88.89%)	⬇️
superset/key_value/commands/delete.py	0.00% <0.00%> (-85.30%)	⬇️
superset/key_value/commands/delete_expired.py	0.00% <0.00%> (-80.77%)	⬇️
superset/dashboards/commands/importers/v0.py	15.62% <0.00%> (-76.25%)	⬇️
... and 291 more

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

[zhaoyongjie]

@Painyjames Thanks for the PR. It's a pretty useful feature for increasing the loading pace on Explore.

I found an issue when I tested this on my local environment. First, setting FF was enabled. Then, opened an existent Chart, the DataPanel was expected as closed for now. Next, opened the DataPanel and return to the Charts list. Finally, reopened the previous Chart but the DataPanel was white and seemed opened.

[victorarbuesmallada]

@zhaoyongjie I was not able to reproduce that issue locally, as it seems to be working fine. Could you spin up a testing instance with that flag on?

[victorarbuesmallada]

I've replicated that locally and recorded the behaviour on this PR's branch:
gif

[zhaoyongjie]

Hi @Painyjames I recorded the screen on the ephemeral environment.

test.record.mov

[victorarbuesmallada]

hi @zhaoyongjie , it appears collapsed when you enter into that chart, I think the carets might be odd in the new version though. I'll take a video shortly.

[victorarbuesmallada]

cannot upload videos directly on github, but I've uploaded that here

[victorarbuesmallada]

@zhaoyongjie you were right, I needed to make sure the padding was right on the ExploreChartPanel component as well.
I've committed some changes that amend that and hopefully it's all fine now.

[zhaoyongjie]

/testenv up FEATURE_DATAPANEL_CLOSED_BY_DEFAULT=true

[github-actions]

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

[zhaoyongjie]

LGTM! I love this new feature since it reduces explore page loading time.

[github-actions]

Ephemeral environment shutdown and build artifacts deleted.