[8.16] [Dashboard] show fullscreen mode when url has fullScreenMode p…

…aram (#196275) (#197728)

# Backport

This will backport the following commits from `main` to `8.16`:
- [[Dashboard] show fullscreen mode when url has fullScreenMode param
(#196275)](#196275)

<!--- Backport version: 9.4.3 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sqren/backport)

<!--BACKPORT [{"author":{"name":"Henry
Liu","email":"[email protected]"},"sourceCommit":{"committedDate":"2024-10-24T20:49:39Z","message":"[Dashboard]
show fullscreen mode when url has fullScreenMode param (#196275)\n\n##
Summary\r\n\r\nCloses #174561\r\n\r\nShow fullscreen mode when url has
fullScreenMode param\r\n`&_a=(fullScreenMode:!t)`\r\n\r\n###
Screenshot\r\n\r\n\r\n![20241015-184503](https://github.com/user-attachments/assets/fae01dcc-f081-4314-84f9-3923adc76e5b)\r\n\r\n---------\r\n\r\nCo-authored-by:
Elastic Machine
<[email protected]>\r\nCo-authored-by: Hannah
Mudge
<[email protected]>","sha":"72c0b81994d28f3983c2d21d662bd025653054fa","branchLabelMapping":{"^v9.0.0$":"main","^v8.17.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:fix","Team:Presentation","loe:small","impact:medium","💝community","v9.0.0","backport:prev-major"],"title":"[Dashboard]
show fullscreen mode when url has fullScreenMode
param","number":196275,"url":"https://github.com/elastic/kibana/pull/196275","mergeCommit":{"message":"[Dashboard]
show fullscreen mode when url has fullScreenMode param (#196275)\n\n##
Summary\r\n\r\nCloses #174561\r\n\r\nShow fullscreen mode when url has
fullScreenMode param\r\n`&_a=(fullScreenMode:!t)`\r\n\r\n###
Screenshot\r\n\r\n\r\n![20241015-184503](https://github.com/user-attachments/assets/fae01dcc-f081-4314-84f9-3923adc76e5b)\r\n\r\n---------\r\n\r\nCo-authored-by:
Elastic Machine
<[email protected]>\r\nCo-authored-by: Hannah
Mudge
<[email protected]>","sha":"72c0b81994d28f3983c2d21d662bd025653054fa"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.0.0","branchLabelMappingKey":"^v9.0.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/196275","number":196275,"mergeCommit":{"message":"[Dashboard]
show fullscreen mode when url has fullScreenMode param (#196275)\n\n##
Summary\r\n\r\nCloses #174561\r\n\r\nShow fullscreen mode when url has
fullScreenMode param\r\n`&_a=(fullScreenMode:!t)`\r\n\r\n###
Screenshot\r\n\r\n\r\n![20241015-184503](https://github.com/user-attachments/assets/fae01dcc-f081-4314-84f9-3923adc76e5b)\r\n\r\n---------\r\n\r\nCo-authored-by:
Elastic Machine
<[email protected]>\r\nCo-authored-by: Hannah
Mudge
<[email protected]>","sha":"72c0b81994d28f3983c2d21d662bd025653054fa"}}]}]
BACKPORT-->

Co-authored-by: Henry Liu <[email protected]>

src/plugins/dashboard/public/dashboard_api/get_dashboard_api.ts

@@ -19,14 +19,15 @@ export interface InitialComponentState {
   lastSavedInput: DashboardContainerInput;
   lastSavedId: string | undefined;
   managed: boolean;
+  fullScreenMode: boolean;
 }
 
 export function getDashboardApi(
   initialComponentState: InitialComponentState,
   untilEmbeddableLoaded: (id: string) => Promise<unknown>
 ) {
   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<string | undefined>(initialComponentState.lastSavedId);
 

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;

src/plugins/dashboard/public/dashboard_app/dashboard_app.tsx

@@ -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,

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?.fullScreenMode ?? false,
   };
 
   const dashboardContainer = new DashboardContainer(

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);

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)

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.
    */

src/plugins/dashboard/public/mocks.tsx

@@ -99,6 +99,7 @@ export function buildMockDashboard({
       lastSavedInput: initialInput,
       lastSavedId: savedObjectId,
       managed: false,
+      fullScreenMode: false,
     }
   );
   dashboardContainer?.setControlGroupApi(mockControlGroupApi);