Fix Interactive embedding dashboard with multiple tabs and parameter header=false will not load

[WiNloSt]

Note

This fix is required in order to work on #38429

Closes #39002

Description

The problem came from the way we use header=false.

metabase/frontend/src/metabase/dashboard/components/Dashboard/Dashboard.tsx

Lines 487 to 492 in ac37348

	{isHeaderVisible && (
	<DashboardHeaderContainer
	isFullscreen={isFullscreen}
	isNightMode={shouldRenderAsNightMode}
	>
	<DashboardHeader

Here we see that we don't render DashboardHeader when !isHeaderVisible and this property is read from the header parameter.

metabase/frontend/src/metabase/dashboard/selectors.ts

Lines 415 to 418 in 02be470

	export const getIsHeaderVisible = createSelector(
	[getIsEmbedded, getEmbedOptions],
	(isEmbedded, embedOptions) => !isEmbedded || !!embedOptions.header,
	);

Inside DashboardHeader it calls useDashboardTabs

metabase/frontend/src/metabase/dashboard/components/DashboardTabs/DashboardTabs.tsx

Line 36 in 02be470

} = useDashboardTabs({ location, dashboardId });

which will initiate the Redux state dashboard.selectedTabId, without this value, the dashboard card will never load.

metabase/frontend/src/metabase/dashboard/components/Dashboard/Dashboard.tsx

Lines 373 to 377 in 02be470

	if (previousTabId !== selectedTabId) {
	fetchDashboardCardData();
	fetchDashboardCardMetadata();
	return;
	}

How to verify

• Follow the repro steps in Interactive embedding dashboard with multiple tabs and parameter header=false will not load #39002
• Or run e2e/test/scenarios/embedding/interactive-embedding.cy.spec.js's should hide the dashboard with multiple tabs header by a param (metabase#39002) test.

Demo

Before

The dashboard card will never start loading

After

Checklist

• Tests have been added/updated to cover changes in this PR

[WiNloSt]

Please read the PR description for full details.

[replay-io]

Status	In Progress ↗︎ 51 / 52
Commit	02be470
Results	❌ 4 Failed ⚠️ 7 Flaky ✅ 2264 Passed

[WiNloSt]

Superseded by #39007