feat: Adds the MetadataBar to the Explore header

[michael-s-molina]

SUMMARY

• Adds the MetadataBar to the Explore header
• Improves the MetadataBar resize capabilities and changes the component to work with server-side timestamps
• Changes the logic to get slice-related dashboards to use them in the metadata bar
• Adds and adjusts tests

@kasiazjc I didn't add a tooltip for the number of dashboards because it requires a future PR that will increment the 3 dots menu with the list of related dashboards. This will be made in a follow-up.

@codyml @rusackas

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

Screen.Recording.2022-09-22.at.6.30.27.PM.mov

TESTING INSTRUCTIONS

• Check the video for instructions on the general behavior
• Make sure that the previous logic of inheriting dashboard color schemes is not affected

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

[michael-s-molina]

@geido Can you please check if I didn't break anything here?

[codecov]

Codecov Report

Merging #21560 (40dd796) into master (dc53908) will decrease coverage by 1.25%.
The diff coverage is 53.11%.

❗ Current head 40dd796 differs from pull request most recent head 175ec3f. Consider uploading reports for the commit 175ec3f to get more accurate results

@@            Coverage Diff             @@
##           master   #21560      +/-   ##
==========================================
- Coverage   66.65%   65.40%   -1.26%     
==========================================
  Files        1793     1794       +1     
  Lines       68559    68751     +192     
  Branches     7294     7325      +31     
==========================================
- Hits        45701    44965     -736     
- Misses      20991    21921     +930     
+ Partials     1867     1865       -2     

Flag	Coverage Δ
javascript	52.92% <50.30%> (+0.09%)	⬆️
mysql	?
unit	?

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

Impacted Files	Coverage Δ
...d/packages/superset-ui-chart-controls/src/index.ts	100.00% <ø> (ø)
...chart-controls/src/shared-controls/dndControls.tsx	58.33% <ø> (+4.76%)	⬆️
...src/BigNumber/BigNumberWithTrendline/buildQuery.ts	0.00% <0.00%> (ø)
.../BigNumber/BigNumberWithTrendline/controlPanel.tsx	16.66% <0.00%> (-8.34%)	⬇️
...nd/plugins/plugin-chart-table/src/controlPanel.tsx	53.12% <0.00%> (-9.84%)	⬇️
...ntend/src/components/MetadataBar/ContentConfig.tsx	90.00% <ø> (+5.00%)	⬆️
...et-frontend/src/components/TableSelector/index.tsx	80.00% <ø> (ø)
...ard/components/DrillDetailPane/DrillDetailPane.tsx	81.01% <ø> (ø)
...d/src/explore/components/PropertiesModal/index.tsx	62.90% <ø> (ø)
...lUtils/getControlValuesCompatibleWithDatasource.ts	8.00% <0.00%> (+0.30%)	⬆️
... and 109 more

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

[michael-s-molina]

/testenv up

[geido]

Hey @michael-s-molina a few quick comments from a first look

Should we add a placeholder text when there are no available owners?

Spacing requires some improvement

Can we make the empty space equal on both ends?

[github-actions]

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

[michael-s-molina]

Should we add a placeholder text when there are no available owners?

Added None for this case. I thought Not available does not apply here because we have the information.

Spacing requires some improvement

Fixed

Can we make the empty space equal on both ends?

This is a little more complicated. Currently, we have a minimum width of 70px defined for metadata items according to the design system specs. We use this minimum width to calculate the breakpoint that will trigger the icons-only mode. We would need to define another way of calculating the breakpoint and update the specs. I'm pinging @kasiazjc for awareness here. I'll open a ticket for this and work on it in a separate PR because of the required changes.

[geido]

/testenv up

[geido]

Tested locally. LGTM!

[github-actions]

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

[github-actions]

Ephemeral environment shutdown and build artifacts deleted.