From 0efa4eb8d1e0718cc1f9fcd51b3acc301b047053 Mon Sep 17 00:00:00 2001 From: "henry.liu" Date: Tue, 15 Oct 2024 18:39:09 +0800 Subject: [PATCH 1/4] [Dashboard] show fullscreen mode when url has fullScreenMode param --- src/plugins/dashboard/common/dashboard_container/types.ts | 1 + .../embeddable/create/create_dashboard.ts | 5 +++++ 2 files changed, 6 insertions(+) diff --git a/src/plugins/dashboard/common/dashboard_container/types.ts b/src/plugins/dashboard/common/dashboard_container/types.ts index bcb7670f18e12..8324c6cb8400b 100644 --- a/src/plugins/dashboard/common/dashboard_container/types.ts +++ b/src/plugins/dashboard/common/dashboard_container/types.ts @@ -53,6 +53,7 @@ export interface DashboardContainerInput extends EmbeddableInput { timeRange?: TimeRange; timeslice?: [number, number]; refreshInterval?: RefreshInterval; + fullScreenMode?: boolean; // dashboard meta info title: string; diff --git a/src/plugins/dashboard/public/dashboard_container/embeddable/create/create_dashboard.ts b/src/plugins/dashboard/public/dashboard_container/embeddable/create/create_dashboard.ts index 3eab6c641ee87..780c715b20c06 100644 --- a/src/plugins/dashboard/public/dashboard_container/embeddable/create/create_dashboard.ts +++ b/src/plugins/dashboard/public/dashboard_container/embeddable/create/create_dashboard.ts @@ -284,6 +284,7 @@ export const initializeDashboard = async ({ query, filters, timeRestore, + fullScreenMode, timeRange: savedTimeRange, refreshInterval: savedRefreshInterval, } = initialDashboardInput; @@ -327,6 +328,10 @@ export const initializeDashboard = async ({ stopSyncingUnifiedSearchState(); stopSyncingQueryServiceStateWithUrl(); }; + + if (fullScreenMode != null) { + setTimeout(() => dashboardContainer.setFullScreenMode(fullScreenMode), 500); + } }); } From 772e8a322b2fca97f0be917f711e002da7420e40 Mon Sep 17 00:00:00 2001 From: "henry.liu" Date: Fri, 18 Oct 2024 18:29:09 +0800 Subject: [PATCH 2/4] [Dashboard] save fullScreenMode state in type InitialComponentState --- .../dashboard/public/dashboard_api/get_dashboard_api.ts | 3 ++- .../dashboard/public/dashboard_app/dashboard_app.tsx | 2 +- .../embeddable/create/create_dashboard.ts | 6 +----- .../dashboard_top_nav/internal_dashboard_top_nav.tsx | 7 ------- 4 files changed, 4 insertions(+), 14 deletions(-) diff --git a/src/plugins/dashboard/public/dashboard_api/get_dashboard_api.ts b/src/plugins/dashboard/public/dashboard_api/get_dashboard_api.ts index 3db6129c7c6f9..3eb4427230ef0 100644 --- a/src/plugins/dashboard/public/dashboard_api/get_dashboard_api.ts +++ b/src/plugins/dashboard/public/dashboard_api/get_dashboard_api.ts @@ -19,6 +19,7 @@ export interface InitialComponentState { lastSavedInput: DashboardContainerInput; lastSavedId: string | undefined; managed: boolean; + fullScreenMode: boolean | undefined; } export function getDashboardApi( @@ -26,7 +27,7 @@ export function getDashboardApi( untilEmbeddableLoaded: (id: string) => Promise ) { const animatePanelTransforms$ = new BehaviorSubject(false); // set panel transforms to false initially to avoid panels animating on initial render. - const fullScreenMode$ = new BehaviorSubject(false); + const fullScreenMode$ = new BehaviorSubject(initialComponentState.fullScreenMode); const managed$ = new BehaviorSubject(initialComponentState.managed); const savedObjectId$ = new BehaviorSubject(initialComponentState.lastSavedId); diff --git a/src/plugins/dashboard/public/dashboard_app/dashboard_app.tsx b/src/plugins/dashboard/public/dashboard_app/dashboard_app.tsx index f7ca6b552893b..f65ee8f7a80ca 100644 --- a/src/plugins/dashboard/public/dashboard_app/dashboard_app.tsx +++ b/src/plugins/dashboard/public/dashboard_app/dashboard_app.tsx @@ -119,9 +119,9 @@ export function DashboardApp({ */ const getCreationOptions = useCallback((): Promise => { const searchSessionIdFromURL = getSearchSessionIdFromURL(history); + const initialUrlState = loadAndRemoveDashboardState(kbnUrlStateStorage); const getInitialInput = () => { const stateFromLocator = loadDashboardHistoryLocationState(getScopedHistory); - const initialUrlState = loadAndRemoveDashboardState(kbnUrlStateStorage); // Override all state with URL + Locator input return { diff --git a/src/plugins/dashboard/public/dashboard_container/embeddable/create/create_dashboard.ts b/src/plugins/dashboard/public/dashboard_container/embeddable/create/create_dashboard.ts index 780c715b20c06..d491d907c67b8 100644 --- a/src/plugins/dashboard/public/dashboard_container/embeddable/create/create_dashboard.ts +++ b/src/plugins/dashboard/public/dashboard_container/embeddable/create/create_dashboard.ts @@ -110,6 +110,7 @@ export const createDashboard = async ( }, lastSavedId: savedObjectId, managed: savedObjectResult.managed ?? false, + fullScreenMode: creationOptions?.getInitialInput?.().fullScreenMode ?? false, }; const dashboardContainer = new DashboardContainer( @@ -284,7 +285,6 @@ export const initializeDashboard = async ({ query, filters, timeRestore, - fullScreenMode, timeRange: savedTimeRange, refreshInterval: savedRefreshInterval, } = initialDashboardInput; @@ -328,10 +328,6 @@ export const initializeDashboard = async ({ stopSyncingUnifiedSearchState(); stopSyncingQueryServiceStateWithUrl(); }; - - if (fullScreenMode != null) { - setTimeout(() => dashboardContainer.setFullScreenMode(fullScreenMode), 500); - } }); } diff --git a/src/plugins/dashboard/public/dashboard_top_nav/internal_dashboard_top_nav.tsx b/src/plugins/dashboard/public/dashboard_top_nav/internal_dashboard_top_nav.tsx index bdbb506dfc713..7cd4f699186ae 100644 --- a/src/plugins/dashboard/public/dashboard_top_nav/internal_dashboard_top_nav.tsx +++ b/src/plugins/dashboard/public/dashboard_top_nav/internal_dashboard_top_nav.tsx @@ -123,13 +123,6 @@ export function InternalDashboardTopNav({ dashboardTitleRef.current?.focus(); }, [title, viewMode]); - /** - * Manage chrome visibility when dashboard is embedded. - */ - useEffect(() => { - if (!embedSettings) coreServices.chrome.setIsVisible(viewMode !== 'print'); - }, [embedSettings, viewMode]); - /** * populate recently accessed, and set is chrome visible. */ From 267aab2d7b73ca37d310ab2634ba4317aba96b4c Mon Sep 17 00:00:00 2001 From: "henry.liu" Date: Tue, 22 Oct 2024 00:08:54 +0800 Subject: [PATCH 3/4] [Dashboard] put fullScreenMode as a top level key in creationOptions --- src/plugins/dashboard/common/dashboard_container/types.ts | 1 - src/plugins/dashboard/public/dashboard_api/types.ts | 1 + src/plugins/dashboard/public/dashboard_app/dashboard_app.tsx | 5 ++++- .../embeddable/create/create_dashboard.ts | 2 +- 4 files changed, 6 insertions(+), 3 deletions(-) diff --git a/src/plugins/dashboard/common/dashboard_container/types.ts b/src/plugins/dashboard/common/dashboard_container/types.ts index 8324c6cb8400b..bcb7670f18e12 100644 --- a/src/plugins/dashboard/common/dashboard_container/types.ts +++ b/src/plugins/dashboard/common/dashboard_container/types.ts @@ -53,7 +53,6 @@ export interface DashboardContainerInput extends EmbeddableInput { timeRange?: TimeRange; timeslice?: [number, number]; refreshInterval?: RefreshInterval; - fullScreenMode?: boolean; // dashboard meta info title: string; diff --git a/src/plugins/dashboard/public/dashboard_api/types.ts b/src/plugins/dashboard/public/dashboard_api/types.ts index e0b6b8d3e4824..ec89a93dcd66e 100644 --- a/src/plugins/dashboard/public/dashboard_api/types.ts +++ b/src/plugins/dashboard/public/dashboard_api/types.ts @@ -68,6 +68,7 @@ export interface DashboardCreationOptions { validateLoadedSavedObject?: (result: LoadDashboardReturn) => 'valid' | 'invalid' | 'redirected'; + fullScreenMode?: boolean; isEmbeddedExternally?: boolean; getEmbeddableAppContext?: (dashboardId?: string) => EmbeddableAppContext; diff --git a/src/plugins/dashboard/public/dashboard_app/dashboard_app.tsx b/src/plugins/dashboard/public/dashboard_app/dashboard_app.tsx index f65ee8f7a80ca..400d56e97df09 100644 --- a/src/plugins/dashboard/public/dashboard_app/dashboard_app.tsx +++ b/src/plugins/dashboard/public/dashboard_app/dashboard_app.tsx @@ -119,9 +119,9 @@ export function DashboardApp({ */ const getCreationOptions = useCallback((): Promise => { const searchSessionIdFromURL = getSearchSessionIdFromURL(history); - const initialUrlState = loadAndRemoveDashboardState(kbnUrlStateStorage); const getInitialInput = () => { const stateFromLocator = loadDashboardHistoryLocationState(getScopedHistory); + const initialUrlState = loadAndRemoveDashboardState(kbnUrlStateStorage); // Override all state with URL + Locator input return { @@ -157,6 +157,9 @@ export function DashboardApp({ }, getInitialInput, validateLoadedSavedObject: validateOutcome, + fullScreenMode: + kbnUrlStateStorage.get<{ fullScreenMode?: boolean }>(DASHBOARD_STATE_STORAGE_KEY) + ?.fullScreenMode ?? false, isEmbeddedExternally: Boolean(embedSettings), // embed settings are only sent if the dashboard URL has `embed=true` getEmbeddableAppContext: (dashboardId) => ({ currentAppId: DASHBOARD_APP_ID, diff --git a/src/plugins/dashboard/public/dashboard_container/embeddable/create/create_dashboard.ts b/src/plugins/dashboard/public/dashboard_container/embeddable/create/create_dashboard.ts index d491d907c67b8..2510f2e015dfb 100644 --- a/src/plugins/dashboard/public/dashboard_container/embeddable/create/create_dashboard.ts +++ b/src/plugins/dashboard/public/dashboard_container/embeddable/create/create_dashboard.ts @@ -110,7 +110,7 @@ export const createDashboard = async ( }, lastSavedId: savedObjectId, managed: savedObjectResult.managed ?? false, - fullScreenMode: creationOptions?.getInitialInput?.().fullScreenMode ?? false, + fullScreenMode: creationOptions?.fullScreenMode ?? false, }; const dashboardContainer = new DashboardContainer( From 3bd11cead5b31312d019a05e61824548a680b5bf Mon Sep 17 00:00:00 2001 From: "henry.liu" Date: Tue, 22 Oct 2024 16:07:40 +0800 Subject: [PATCH 4/4] [Dashboard] fix type lint --- src/plugins/dashboard/public/dashboard_api/get_dashboard_api.ts | 2 +- .../dashboard_container/embeddable/dashboard_container.test.tsx | 1 + .../dashboard_container/embeddable/dashboard_container.tsx | 1 + src/plugins/dashboard/public/mocks.tsx | 1 + 4 files changed, 4 insertions(+), 1 deletion(-) diff --git a/src/plugins/dashboard/public/dashboard_api/get_dashboard_api.ts b/src/plugins/dashboard/public/dashboard_api/get_dashboard_api.ts index 3eb4427230ef0..2af37846eecdb 100644 --- a/src/plugins/dashboard/public/dashboard_api/get_dashboard_api.ts +++ b/src/plugins/dashboard/public/dashboard_api/get_dashboard_api.ts @@ -19,7 +19,7 @@ export interface InitialComponentState { lastSavedInput: DashboardContainerInput; lastSavedId: string | undefined; managed: boolean; - fullScreenMode: boolean | undefined; + fullScreenMode: boolean; } export function getDashboardApi( diff --git a/src/plugins/dashboard/public/dashboard_container/embeddable/dashboard_container.test.tsx b/src/plugins/dashboard/public/dashboard_container/embeddable/dashboard_container.test.tsx index 4805c890f5e95..167ee26055166 100644 --- a/src/plugins/dashboard/public/dashboard_container/embeddable/dashboard_container.test.tsx +++ b/src/plugins/dashboard/public/dashboard_container/embeddable/dashboard_container.test.tsx @@ -178,6 +178,7 @@ test('searchSessionId propagates to children', async () => { lastSavedInput: sampleInput, lastSavedId: undefined, managed: false, + fullScreenMode: false, } ); container?.setControlGroupApi(mockControlGroupApi); diff --git a/src/plugins/dashboard/public/dashboard_container/embeddable/dashboard_container.tsx b/src/plugins/dashboard/public/dashboard_container/embeddable/dashboard_container.tsx index e508e511d41cb..a6765732c064c 100644 --- a/src/plugins/dashboard/public/dashboard_container/embeddable/dashboard_container.tsx +++ b/src/plugins/dashboard/public/dashboard_container/embeddable/dashboard_container.tsx @@ -314,6 +314,7 @@ export class DashboardContainer isEmbeddedExternally: false, lastSavedInput: initialInput, lastSavedId: undefined, + fullScreenMode: false, managed: false, }, (id: string) => this.untilEmbeddableLoaded(id) diff --git a/src/plugins/dashboard/public/mocks.tsx b/src/plugins/dashboard/public/mocks.tsx index 17081084d5dec..2374788e60ea8 100644 --- a/src/plugins/dashboard/public/mocks.tsx +++ b/src/plugins/dashboard/public/mocks.tsx @@ -99,6 +99,7 @@ export function buildMockDashboard({ lastSavedInput: initialInput, lastSavedId: savedObjectId, managed: false, + fullScreenMode: false, } ); dashboardContainer?.setControlGroupApi(mockControlGroupApi);