fix: dashboard top level tabs edit

[diegomedina248]

SUMMARY

This PR addresses several small issues detected when editing the top level tabs in the dashboard.

The main problem behind them is that the tab & the content, being different components, were not 100% in sync after re-order/add/remove actions on them.
This PR hoists the state handling up for this scenarios and ensure the state is driven in the same way.

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

Issue 1

When adding a new tab, the container gets selected & the "Collapse tab content" popup appears.

Before:

collapse-msg.mov

After:

Screen.Recording.2022-04-14.at.13.16.11.mov

Issue 2

When adding a new tab, said tab is selected, but the content still reflects the one from a previous tab

Before:

add-tab-content-does-not-change.mov

After:

Screen.Recording.2022-04-14.at.13.17.22.mov

Issue 3

Reordering tabs makes the tab & content out of sync, so the current tab content is lost.

Before:

switch-tabs-content.mov

After:

Screen.Recording.2022-04-14.at.13.18.25.mov

Issue 4

Deleting a tab always switches to the last one. This should only happen if the tab being deleted is the current one the user is seeing, otherwise, nothing should change.

Before:

delete-switches-tab.mov

After:

Screen.Recording.2022-04-14.at.13.20.07.mov

TESTING INSTRUCTIONS

Check each individual "Before" video for reproduction steps

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 #19722 (9fcea20) into master (e061955) will increase coverage by 0.00%.
The diff coverage is 80.00%.

@@           Coverage Diff           @@
##           master   #19722   +/-   ##
=======================================
  Coverage   66.51%   66.51%           
=======================================
  Files        1690     1690           
  Lines       64614    64618    +4     
  Branches     6655     6656    +1     
=======================================
+ Hits        42978    42983    +5     
  Misses      19936    19936           
+ Partials     1700     1699    -1     

Flag	Coverage Δ
javascript	51.20% <80.00%> (+<0.01%)	⬆️

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

Impacted Files	Coverage Δ
...d/components/DashboardBuilder/DashboardBuilder.tsx	70.10% <66.66%> (-0.36%)	⬇️
...d/src/dashboard/components/gridComponents/Tabs.jsx	82.55% <85.71%> (+3.90%)	⬆️
...components/DashboardBuilder/DashboardContainer.tsx	72.22% <100.00%> (-1.47%)	⬇️

---

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 e061955...9fcea20. Read the comment docs.

[rusackas]

Rebase needed... hopefully then it'll magically pass CI