From 191c523f78e0c2cd010051be7f3f1b354c4e6fd8 Mon Sep 17 00:00:00 2001
From: pgayvallet <pierre.gayvallet@elastic.co>
Date: Wed, 5 Jan 2022 08:22:11 +0100
Subject: [PATCH] use `KibanaThemeProvider` for `pipelines` management app

---
 x-pack/plugins/logstash/kibana.json           |   2 +-
 .../logstash/public/application/index.tsx     | 119 +++++++++---------
 2 files changed, 62 insertions(+), 59 deletions(-)

diff --git a/x-pack/plugins/logstash/kibana.json b/x-pack/plugins/logstash/kibana.json
index 48391c9bc68c4..a051800d1f5a1 100644
--- a/x-pack/plugins/logstash/kibana.json
+++ b/x-pack/plugins/logstash/kibana.json
@@ -11,5 +11,5 @@
   "optionalPlugins": ["home", "monitoring", "security"],
   "server": true,
   "ui": true,
-  "requiredBundles": ["esUiShared", "home"]
+  "requiredBundles": ["esUiShared", "home", "kibanaReact"]
 }
diff --git a/x-pack/plugins/logstash/public/application/index.tsx b/x-pack/plugins/logstash/public/application/index.tsx
index 947e1d9c73f65..8b9aac2b3c341 100644
--- a/x-pack/plugins/logstash/public/application/index.tsx
+++ b/x-pack/plugins/logstash/public/application/index.tsx
@@ -13,6 +13,7 @@ import { first } from 'rxjs/operators';
 
 import { CoreStart } from 'src/core/public';
 import { ManagementAppMountParams } from '../../../../../src/plugins/management/public';
+import { KibanaThemeProvider } from '../../../../../src/plugins/kibana_react/public';
 import {
   ClusterService,
   MonitoringService,
@@ -30,7 +31,7 @@ import * as Breadcrumbs from './breadcrumbs';
 
 export const renderApp = async (
   core: CoreStart,
-  { history, element, setBreadcrumbs }: ManagementAppMountParams,
+  { history, element, setBreadcrumbs, theme$ }: ManagementAppMountParams,
   isMonitoringEnabled: boolean,
   licenseService$: Observable<any>
 ) => {
@@ -42,64 +43,66 @@ export const renderApp = async (
 
   ReactDOM.render(
     <core.i18n.Context>
-      <Router history={history}>
-        <Switch>
-          <Route
-            path={['/', '']}
-            exact
-            render={() => {
-              setBreadcrumbs(Breadcrumbs.getPipelineListBreadcrumbs());
-              return (
-                <PipelineList
-                  clusterService={clusterService}
-                  isReadOnly={logstashLicenseService.isReadOnly}
-                  isForbidden={true}
-                  isLoading={false}
-                  licenseService={logstashLicenseService}
-                  monitoringService={monitoringService}
-                  openPipeline={(id: string) => history.push(`/pipeline/${id}/edit`)}
-                  clonePipeline={(id: string) => history.push(`/pipeline/${id}/edit?clone`)}
-                  createPipeline={() => history.push(`pipeline/new-pipeline`)}
-                  pipelinesService={pipelinesService}
-                  toastNotifications={core.notifications.toasts}
+      <KibanaThemeProvider theme$={theme$}>
+        <Router history={history}>
+          <Switch>
+            <Route
+              path={['/', '']}
+              exact
+              render={() => {
+                setBreadcrumbs(Breadcrumbs.getPipelineListBreadcrumbs());
+                return (
+                  <PipelineList
+                    clusterService={clusterService}
+                    isReadOnly={logstashLicenseService.isReadOnly}
+                    isForbidden={true}
+                    isLoading={false}
+                    licenseService={logstashLicenseService}
+                    monitoringService={monitoringService}
+                    openPipeline={(id: string) => history.push(`/pipeline/${id}/edit`)}
+                    clonePipeline={(id: string) => history.push(`/pipeline/${id}/edit?clone`)}
+                    createPipeline={() => history.push(`pipeline/new-pipeline`)}
+                    pipelinesService={pipelinesService}
+                    toastNotifications={core.notifications.toasts}
+                  />
+                );
+              }}
+            />
+            <Route
+              path="/pipeline/new-pipeline"
+              exact
+              render={() => (
+                <PipelineEditView
+                  history={history}
+                  setBreadcrumbs={setBreadcrumbs}
+                  logstashLicenseService={logstashLicenseService}
+                  pipelineService={pipelineService}
+                  toasts={core.notifications.toasts}
                 />
-              );
-            }}
-          />
-          <Route
-            path="/pipeline/new-pipeline"
-            exact
-            render={() => (
-              <PipelineEditView
-                history={history}
-                setBreadcrumbs={setBreadcrumbs}
-                logstashLicenseService={logstashLicenseService}
-                pipelineService={pipelineService}
-                toasts={core.notifications.toasts}
-              />
-            )}
-          />
-          <Route
-            path="/pipeline/:id"
-            exact
-            render={({ match }) => <Redirect to={`/pipeline/${match.params.id}/edit`} />}
-          />
-          <Route
-            path="/pipeline/:id/edit"
-            exact
-            render={({ match }) => (
-              <PipelineEditView
-                history={history}
-                setBreadcrumbs={setBreadcrumbs}
-                logstashLicenseService={logstashLicenseService}
-                pipelineService={pipelineService}
-                toasts={core.notifications.toasts}
-                id={match.params.id}
-              />
-            )}
-          />
-        </Switch>
-      </Router>
+              )}
+            />
+            <Route
+              path="/pipeline/:id"
+              exact
+              render={({ match }) => <Redirect to={`/pipeline/${match.params.id}/edit`} />}
+            />
+            <Route
+              path="/pipeline/:id/edit"
+              exact
+              render={({ match }) => (
+                <PipelineEditView
+                  history={history}
+                  setBreadcrumbs={setBreadcrumbs}
+                  logstashLicenseService={logstashLicenseService}
+                  pipelineService={pipelineService}
+                  toasts={core.notifications.toasts}
+                  id={match.params.id}
+                />
+              )}
+            />
+          </Switch>
+        </Router>
+      </KibanaThemeProvider>
     </core.i18n.Context>,
     element
   );