[Osquery] Add KibanaThemeProvider to the app (#122051)

elastic · Jan 7, 2022 · 119a2d7 · 119a2d7
1 parent ef2610a
commit 119a2d7
Show file tree

Hide file tree

Showing 3 changed files with 36 additions and 30 deletions.
diff --git a/x-pack/plugins/osquery/public/application.tsx b/x-pack/plugins/osquery/public/application.tsx
@@ -15,7 +15,7 @@ import { ThemeProvider } from 'styled-components';
 import { QueryClientProvider } from 'react-query';
 import { ReactQueryDevtools } from 'react-query/devtools';
 
-import { useUiSetting$ } from '../../../../src/plugins/kibana_react/public';
+import { useUiSetting$, KibanaThemeProvider } from './shared_imports';
 import { Storage } from '../../../../src/plugins/kibana_utils/public';
 import { AppMountParameters, CoreStart } from '../../../../src/core/public';
 import { AppPluginStartDependencies } from './types';
@@ -44,32 +44,34 @@ const OsqueryAppContext = () => {
 export const renderApp = (
   core: CoreStart,
   services: AppPluginStartDependencies,
-  { element, history }: AppMountParameters,
+  { element, history, theme$ }: AppMountParameters,
   storage: Storage,
   kibanaVersion: string
 ) => {
   ReactDOM.render(
-    <KibanaContextProvider
-      // eslint-disable-next-line react-perf/jsx-no-new-object-as-prop
-      services={{
-        appName: PLUGIN_NAME,
-        kibanaVersion,
-        ...core,
-        ...services,
-        storage,
-      }}
-    >
-      <EuiErrorBoundary>
-        <Router history={history}>
-          <I18nProvider>
-            <QueryClientProvider client={queryClient}>
-              <OsqueryAppContext />
-              <ReactQueryDevtools initialIsOpen={false} />
-            </QueryClientProvider>
-          </I18nProvider>
-        </Router>
-      </EuiErrorBoundary>
-    </KibanaContextProvider>,
+    <KibanaThemeProvider theme$={theme$}>
+      <KibanaContextProvider
+        // eslint-disable-next-line react-perf/jsx-no-new-object-as-prop
+        services={{
+          appName: PLUGIN_NAME,
+          kibanaVersion,
+          ...core,
+          ...services,
+          storage,
+        }}
+      >
+        <EuiErrorBoundary>
+          <Router history={history}>
+            <I18nProvider>
+              <QueryClientProvider client={queryClient}>
+                <OsqueryAppContext />
+                <ReactQueryDevtools initialIsOpen={false} />
+              </QueryClientProvider>
+            </I18nProvider>
+          </Router>
+        </EuiErrorBoundary>
+      </KibanaContextProvider>
+    </KibanaThemeProvider>,
     element
   );
 

diff --git a/x-pack/plugins/osquery/public/shared_components/osquery_action/index.tsx b/x-pack/plugins/osquery/public/shared_components/osquery_action/index.tsx
@@ -17,6 +17,7 @@ import { KibanaContextProvider, useKibana } from '../../common/lib/kibana';
 import { LiveQuery } from '../../live_queries';
 import { queryClient } from '../../query_client';
 import { OsqueryIcon } from '../../components/osquery_icon';
+import { KibanaThemeProvider } from '../../shared_imports';
 
 interface OsqueryActionProps {
   metadata?: {
@@ -134,13 +135,15 @@ export const OsqueryAction = React.memo(OsqueryActionComponent);
 
 // @ts-expect-error update types
 const OsqueryActionWrapperComponent = ({ services, ...props }) => (
-  <KibanaContextProvider services={services}>
-    <EuiErrorBoundary>
-      <QueryClientProvider client={queryClient}>
-        <OsqueryAction {...props} />
-      </QueryClientProvider>
-    </EuiErrorBoundary>
-  </KibanaContextProvider>
+  <KibanaThemeProvider theme$={services.theme.theme$}>
+    <KibanaContextProvider services={services}>
+      <EuiErrorBoundary>
+        <QueryClientProvider client={queryClient}>
+          <OsqueryAction {...props} />
+        </QueryClientProvider>
+      </EuiErrorBoundary>
+    </KibanaContextProvider>
+  </KibanaThemeProvider>
 );
 
 const OsqueryActionWrapper = React.memo(OsqueryActionWrapperComponent);

diff --git a/x-pack/plugins/osquery/public/shared_imports.ts b/x-pack/plugins/osquery/public/shared_imports.ts
@@ -43,3 +43,4 @@ export type { ERROR_CODE } from '../../../../src/plugins/es_ui_shared/static/for
 
 export { EuiCodeEditor } from '../../../../src/plugins/es_ui_shared/public';
 export type { EuiCodeEditorProps } from '../../../../src/plugins/es_ui_shared/public';
+export { useUiSetting$, KibanaThemeProvider } from '../../../../src/plugins/kibana_react/public';
Original file line number	Diff line number	Diff line change
Expand Up		@@ -43,3 +43,4 @@ export type { ERROR_CODE } from '../../../../src/plugins/es_ui_shared/static/for

		export { EuiCodeEditor } from '../../../../src/plugins/es_ui_shared/public';
		export type { EuiCodeEditorProps } from '../../../../src/plugins/es_ui_shared/public';
		export { useUiSetting$, KibanaThemeProvider } from '../../../../src/plugins/kibana_react/public';