[Graph] Add KibanaThemeProvider (#119802)

* [Graph] Add ThemeProvider

* Wrap top_nav_menu in kibana theme

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
This commit is contained in:
Maja Grubic 2021-12-02 20:39:03 +01:00 committed by GitHub
parent 2ef888f3e3
commit 2d13b7be3c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 12 additions and 6 deletions

View file

@ -20,6 +20,7 @@ import {
ScopedHistory,
} from 'kibana/public';
import ReactDOM from 'react-dom';
import React from 'react';
import { DataPlugin, IndexPatternsContract } from '../../../../src/plugins/data/public';
import { LicensingPluginStart } from '../../licensing/public';
import { checkLicense } from '../common/check_license';
@ -32,6 +33,7 @@ import { SavedObjectsStart } from '../../../../src/plugins/saved_objects/public'
import { GraphSavePolicy } from './types';
import { graphRouter } from './router';
import { SpacesApi } from '../../spaces/public';
import { KibanaThemeProvider } from '../../../../src/plugins/kibana_react/public';
/**
* These are dependencies of the Graph app besides the base dependencies
@ -69,7 +71,8 @@ export interface GraphDependencies {
export type GraphServices = Omit<GraphDependencies, 'element' | 'history'>;
export const renderApp = ({ history, element, ...deps }: GraphDependencies) => {
const { chrome, capabilities } = deps;
const { chrome, capabilities, core } = deps;
const { theme$ } = core.theme;
if (!capabilities.graph.save) {
chrome.setBadge({
@ -107,7 +110,7 @@ export const renderApp = ({ history, element, ...deps }: GraphDependencies) => {
window.dispatchEvent(new HashChangeEvent('hashchange'));
});
const app = graphRouter(deps);
const app = <KibanaThemeProvider theme$={theme$}>{graphRouter(deps)}</KibanaThemeProvider>;
ReactDOM.render(app, element);
element.setAttribute('class', 'gphAppWrapper');

View file

@ -11,7 +11,7 @@ import { Provider, useStore } from 'react-redux';
import { AppMountParameters, Capabilities, CoreStart } from 'kibana/public';
import { useHistory, useLocation } from 'react-router-dom';
import { NavigationPublicPluginStart as NavigationStart } from '../../../../../../src/plugins/navigation/public';
import { toMountPoint } from '../../../../../../src/plugins/kibana_react/public';
import { toMountPoint, wrapWithTheme } from '../../../../../../src/plugins/kibana_react/public';
import { datasourceSelector, hasFieldsSelector } from '../../state_management';
import { GraphSavePolicy, GraphWorkspaceSavedObject, Workspace } from '../../types';
import { AsObservable, Settings, SettingsWorkspaceProps } from '../settings';
@ -145,9 +145,12 @@ export const WorkspaceTopNavMenu = (props: WorkspaceTopNavMenuProps) => {
props.coreStart.overlays.openFlyout(
toMountPoint(
<Provider store={store}>
<Settings observable={settingsObservable} />
</Provider>
wrapWithTheme(
<Provider store={store}>
<Settings observable={settingsObservable} />
</Provider>,
props.coreStart.theme.theme$
)
),
{
size: 'm',