From b8ba5138d53bb398a4281f261f4af7a45ef94db7 Mon Sep 17 00:00:00 2001
From: Shahzad <shahzad.muhammad@elastic.co>
Date: Mon, 25 May 2020 19:48:54 +0200
Subject: [PATCH] [7.x] [Uptime] Unmount uptime app properly (#66950) (#67287)

---
 x-pack/plugins/uptime/public/apps/plugin.ts   | 21 +++++++++++++------
 .../framework/new_platform_adapter.tsx        | 12 +++++------
 x-pack/plugins/uptime/public/lib/lib.ts       |  3 ++-
 x-pack/plugins/uptime/public/uptime_app.tsx   |  1 -
 4 files changed, 22 insertions(+), 15 deletions(-)

diff --git a/x-pack/plugins/uptime/public/apps/plugin.ts b/x-pack/plugins/uptime/public/apps/plugin.ts
index b589bd64591fc4..5d9bbacb490067 100644
--- a/x-pack/plugins/uptime/public/apps/plugin.ts
+++ b/x-pack/plugins/uptime/public/apps/plugin.ts
@@ -3,8 +3,14 @@
  * or more contributor license agreements. Licensed under the Elastic License;
  * you may not use this file except in compliance with the Elastic License.
  */
-import { CoreSetup, CoreStart, Plugin, PluginInitializerContext } from 'kibana/public';
-import { AppMountParameters, DEFAULT_APP_CATEGORIES } from '../../../../../src/core/public';
+import {
+  CoreSetup,
+  CoreStart,
+  Plugin,
+  PluginInitializerContext,
+  AppMountParameters,
+} from 'kibana/public';
+import { DEFAULT_APP_CATEGORIES } from '../../../../../src/core/public';
 import { UMFrontendLibs } from '../lib/lib';
 import { PLUGIN } from '../../common/constants';
 import { FeatureCatalogueCategory } from '../../../../../src/plugins/home/public';
@@ -23,7 +29,11 @@ export interface ClientPluginsStart {
   embeddable: EmbeddableStart;
 }
 
-export class UptimePlugin implements Plugin<void, void, ClientPluginsSetup, ClientPluginsStart> {
+export type ClientSetup = void;
+export type ClientStart = void;
+
+export class UptimePlugin
+  implements Plugin<ClientSetup, ClientStart, ClientPluginsSetup, ClientPluginsStart> {
   constructor(_context: PluginInitializerContext) {}
 
   public async setup(
@@ -49,7 +59,7 @@ export class UptimePlugin implements Plugin<void, void, ClientPluginsSetup, Clie
       order: 8900,
       title: PLUGIN.TITLE,
       category: DEFAULT_APP_CATEGORIES.observability,
-      async mount(params: AppMountParameters) {
+      mount: async (params: AppMountParameters) => {
         const [coreStart, corePlugins] = await core.getStartServices();
         const { getKibanaFrameworkAdapter } = await import(
           '../lib/adapters/framework/new_platform_adapter'
@@ -59,8 +69,7 @@ export class UptimePlugin implements Plugin<void, void, ClientPluginsSetup, Clie
         const libs: UMFrontendLibs = {
           framework: getKibanaFrameworkAdapter(coreStart, plugins, corePlugins),
         };
-        libs.framework.render(element);
-        return () => {};
+        return libs.framework.render(element);
       },
     });
   }
diff --git a/x-pack/plugins/uptime/public/lib/adapters/framework/new_platform_adapter.tsx b/x-pack/plugins/uptime/public/lib/adapters/framework/new_platform_adapter.tsx
index 5f045e8f15bd71..daf404937ca023 100644
--- a/x-pack/plugins/uptime/public/lib/adapters/framework/new_platform_adapter.tsx
+++ b/x-pack/plugins/uptime/public/lib/adapters/framework/new_platform_adapter.tsx
@@ -4,7 +4,7 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import { ChromeBreadcrumb, CoreStart } from 'src/core/public';
+import { CoreStart } from 'src/core/public';
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { get } from 'lodash';
@@ -46,11 +46,6 @@ export const getKibanaFrameworkAdapter = (
     }
   });
 
-  let breadcrumbs: ChromeBreadcrumb[] = [];
-  core.chrome.getBreadcrumbs$().subscribe((nextBreadcrumbs?: ChromeBreadcrumb[]) => {
-    breadcrumbs = nextBreadcrumbs || [];
-  });
-
   const { apm, infrastructure, logs } = getIntegratedAppAvailability(
     capabilities,
     INTEGRATED_SOLUTIONS
@@ -68,7 +63,6 @@ export const getKibanaFrameworkAdapter = (
     isApmAvailable: apm,
     isInfraAvailable: infrastructure,
     isLogsAvailable: logs,
-    kibanaBreadcrumbs: breadcrumbs,
     plugins,
     startPlugins,
     renderGlobalHelpControls: () =>
@@ -97,6 +91,10 @@ export const getKibanaFrameworkAdapter = (
       if (element) {
         ReactDOM.render(<UptimeApp {...props} />, element);
       }
+
+      return () => {
+        ReactDOM.unmountComponentAtNode(element);
+      };
     },
   };
 };
diff --git a/x-pack/plugins/uptime/public/lib/lib.ts b/x-pack/plugins/uptime/public/lib/lib.ts
index 7dd3aa9eed5ce0..187dcee7adb1a6 100644
--- a/x-pack/plugins/uptime/public/lib/lib.ts
+++ b/x-pack/plugins/uptime/public/lib/lib.ts
@@ -5,6 +5,7 @@
  */
 
 import { ReactElement } from 'react';
+import { AppUnmount } from 'kibana/public';
 import { UMBadge } from '../badge';
 import { UptimeAppProps } from '../uptime_app';
 
@@ -17,5 +18,5 @@ export type UMUpdateBadge = (badge: UMBadge) => void;
 export type BootstrapUptimeApp = (props: UptimeAppProps) => ReactElement<any>;
 
 export interface UMFrameworkAdapter {
-  render(element: any): void;
+  render(element: any): Promise<AppUnmount>;
 }
diff --git a/x-pack/plugins/uptime/public/uptime_app.tsx b/x-pack/plugins/uptime/public/uptime_app.tsx
index 2891a15510f31b..cc6475d6c9d90f 100644
--- a/x-pack/plugins/uptime/public/uptime_app.tsx
+++ b/x-pack/plugins/uptime/public/uptime_app.tsx
@@ -47,7 +47,6 @@ export interface UptimeAppProps {
   isApmAvailable: boolean;
   isInfraAvailable: boolean;
   isLogsAvailable: boolean;
-  kibanaBreadcrumbs: ChromeBreadcrumb[];
   plugins: ClientPluginsSetup;
   startPlugins: ClientPluginsStart;
   routerBasename: string;