From e951c37322068ed922e3f2c082d342661153a23c Mon Sep 17 00:00:00 2001 From: Tim Sullivan Date: Thu, 18 Apr 2024 16:36:08 -0700 Subject: [PATCH] [Core] Remove usage of deprecated React rendering utilities (#180973) ## Summary Partially addresses https://github.com/elastic/kibana-team/issues/805 Follows https://github.com/elastic/kibana/pull/180331 These changes come up from searching in the code and finding where certain kinds of deprecated AppEx-SharedUX modules are imported. **Reviewers: Please interact with critical paths through the UI components touched in this PR, ESPECIALLY in terms of testing dark mode and i18n.** This focuses on code within Kibana Core. image Note: this also makes inclusion of `i18n` and `analytics` dependencies consistent. Analytics is an optional dependency for the SharedUX modules, which wrap `KibanaErrorBoundaryProvider` and is designed to capture telemetry about errors that are caught in the error boundary. ### Checklist Delete any items that are not applicable to this PR. - [x] [Unit or functional tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html) were updated or added to match the most common scenarios - [ ] This renders correctly on smaller devices using a responsive layout. (You can test this [in your browser](https://www.browserstack.com/guide/responsive-testing-on-local-server)) - [ ] This was checked for [cross-browser compatibility](https://www.elastic.co/support/matrix#matrix_browsers) --------- Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com> --- .../src/errors/error_application.tsx | 6 +- .../src/status/render_app.tsx | 6 +- .../core-apps-browser-internal/tsconfig.json | 2 +- .../src/toasts/error_toast.tsx | 25 +++---- .../src/banners/banners_service.test.ts | 4 + .../src/banners/banners_service.tsx | 13 +++- .../src/banners/user_banner_service.test.ts | 4 + .../src/banners/user_banner_service.tsx | 18 +++-- .../src/overlay_service.ts | 2 +- .../src/rendering_service.tsx | 18 ++--- .../tsconfig.json | 6 +- src/plugins/newsfeed/kibana.jsonc | 4 +- src/plugins/newsfeed/public/plugin.tsx | 32 +++----- src/plugins/newsfeed/tsconfig.json | 2 +- src/plugins/saved_objects/kibana.jsonc | 3 +- .../saved_objects/public/kibana_services.ts | 1 + src/plugins/saved_objects/public/plugin.ts | 1 + .../show_saved_object_save_modal.tsx | 8 +- .../helpers/build_saved_object.ts | 4 +- .../helpers/check_for_duplicate_title.ts | 8 +- .../helpers/confirm_modal_promise.tsx | 12 ++- .../saved_object/helpers/create_source.ts | 7 +- .../display_duplicate_title_confirm_modal.ts | 7 +- .../saved_object/helpers/save_saved_object.ts | 11 ++- .../helpers/save_with_confirmation.test.ts | 51 +++++++++++-- .../helpers/save_with_confirmation.ts | 6 +- .../public/saved_object/saved_object.test.ts | 14 +++- .../public/saved_object/saved_object.ts | 11 ++- src/plugins/saved_objects/public/types.ts | 3 + src/plugins/saved_objects/tsconfig.json | 3 +- .../management_section/mount_section.tsx | 75 +++++++++---------- .../saved_objects_management/tsconfig.json | 1 + src/plugins/telemetry/kibana.jsonc | 3 +- src/plugins/telemetry/public/mocks.ts | 4 + src/plugins/telemetry/public/plugin.ts | 5 +- ...render_opt_in_status_notice_banner.test.ts | 12 ++- .../render_opt_in_status_notice_banner.tsx | 11 ++- .../telemetry_notifications.ts | 14 ++-- src/plugins/telemetry/tsconfig.json | 2 +- .../cloud_chat/public/plugin.tsx | 4 +- x-pack/plugins/licensing/kibana.jsonc | 4 +- .../licensing/public/expired_banner.tsx | 9 ++- .../plugins/licensing/public/plugin.test.ts | 13 +++- x-pack/plugins/licensing/public/plugin.ts | 8 +- x-pack/plugins/licensing/tsconfig.json | 4 +- 45 files changed, 279 insertions(+), 182 deletions(-) diff --git a/packages/core/apps/core-apps-browser-internal/src/errors/error_application.tsx b/packages/core/apps/core-apps-browser-internal/src/errors/error_application.tsx index 02ef568f1830..35b562b0d97d 100644 --- a/packages/core/apps/core-apps-browser-internal/src/errors/error_application.tsx +++ b/packages/core/apps/core-apps-browser-internal/src/errors/error_application.tsx @@ -13,7 +13,7 @@ import { i18n } from '@kbn/i18n'; import { I18nProvider } from '@kbn/i18n-react'; import { EuiPageTemplate } from '@elastic/eui'; -import { CoreThemeProvider } from '@kbn/core-theme-browser-internal'; +import { KibanaThemeProvider } from '@kbn/react-kibana-context-theme'; import type { IBasePath } from '@kbn/core-http-browser'; import type { AppMountParameters } from '@kbn/core-application-browser'; import { UrlOverflowUi } from './url_overflow_ui'; @@ -77,9 +77,9 @@ interface Deps { export const renderApp = ({ element, history, theme$ }: AppMountParameters, { basePath }: Deps) => { ReactDOM.render( - + - + , element ); diff --git a/packages/core/apps/core-apps-browser-internal/src/status/render_app.tsx b/packages/core/apps/core-apps-browser-internal/src/status/render_app.tsx index a2af773a239a..90d38e8e2511 100644 --- a/packages/core/apps/core-apps-browser-internal/src/status/render_app.tsx +++ b/packages/core/apps/core-apps-browser-internal/src/status/render_app.tsx @@ -9,7 +9,7 @@ import React from 'react'; import ReactDOM from 'react-dom'; import { I18nProvider } from '@kbn/i18n-react'; -import { CoreThemeProvider } from '@kbn/core-theme-browser-internal'; +import { KibanaThemeProvider } from '@kbn/react-kibana-context-theme'; import type { InternalHttpSetup } from '@kbn/core-http-browser-internal'; import type { NotificationsSetup } from '@kbn/core-notifications-browser'; import type { AppMountParameters } from '@kbn/core-application-browser'; @@ -26,9 +26,9 @@ export const renderApp = ( ) => { ReactDOM.render( - + - + , element ); diff --git a/packages/core/apps/core-apps-browser-internal/tsconfig.json b/packages/core/apps/core-apps-browser-internal/tsconfig.json index 46a1b4b6a629..35e25675fe07 100644 --- a/packages/core/apps/core-apps-browser-internal/tsconfig.json +++ b/packages/core/apps/core-apps-browser-internal/tsconfig.json @@ -23,7 +23,6 @@ "@kbn/core-notifications-browser", "@kbn/core-application-browser", "@kbn/core-application-browser-internal", - "@kbn/core-theme-browser-internal", "@kbn/core-mount-utils-browser-internal", "@kbn/core-status-common-internal", "@kbn/core-http-browser-internal", @@ -35,6 +34,7 @@ "@kbn/core-status-common", "@kbn/core-doc-links-browser-mocks", "@kbn/test-jest-helpers", + "@kbn/react-kibana-context-theme", ], "exclude": [ "target/**/*", diff --git a/packages/core/notifications/core-notifications-browser-internal/src/toasts/error_toast.tsx b/packages/core/notifications/core-notifications-browser-internal/src/toasts/error_toast.tsx index 0b40fc5425cf..e494b0294f94 100644 --- a/packages/core/notifications/core-notifications-browser-internal/src/toasts/error_toast.tsx +++ b/packages/core/notifications/core-notifications-browser-internal/src/toasts/error_toast.tsx @@ -17,8 +17,8 @@ import { EuiModalFooter, EuiModalHeader, EuiModalHeaderTitle, + EuiSpacer, } from '@elastic/eui'; -import { EuiSpacer } from '@elastic/eui'; import { FormattedMessage } from '@kbn/i18n-react'; import type { AnalyticsServiceStart } from '@kbn/core-analytics-browser'; import type { I18nStart } from '@kbn/core-i18n-browser'; @@ -26,14 +26,17 @@ import type { OverlayStart } from '@kbn/core-overlays-browser'; import { ThemeServiceStart } from '@kbn/core-theme-browser'; import { KibanaRenderContextProvider } from '@kbn/react-kibana-context-render'; -interface ErrorToastProps { +interface StartServices { + analytics: AnalyticsServiceStart; + i18n: I18nStart; + theme: ThemeServiceStart; +} + +interface ErrorToastProps extends StartServices { title: string; error: Error; toastMessage: string; openModal: OverlayStart['openModal']; - analytics: AnalyticsServiceStart; - i18n: I18nStart; - theme: ThemeServiceStart; } interface RequestError extends Error { @@ -57,9 +60,7 @@ export function showErrorDialog({ title, error, openModal, - analytics, - i18n, - theme, + ...startServices }: Pick) { let text = ''; @@ -74,7 +75,7 @@ export function showErrorDialog({ const modal = openModal( mount( - + {title} @@ -107,9 +108,7 @@ export function ErrorToast({ error, toastMessage, openModal, - analytics, - i18n, - theme, + ...startServices }: ErrorToastProps) { return ( @@ -119,7 +118,7 @@ export function ErrorToast({ size="s" color="danger" data-test-subj="errorToastBtn" - onClick={() => showErrorDialog({ title, error, openModal, analytics, i18n, theme })} + onClick={() => showErrorDialog({ title, error, openModal, ...startServices })} > { let service: InternalOverlayBannersStart; beforeEach(() => { service = new OverlayBannersService().start({ + analytics: analyticsServiceMock.createAnalyticsServiceStart(), i18n: i18nServiceMock.createStartContract(), + theme: themeServiceMock.createStartContract(), uiSettings: uiSettingsServiceMock.createStartContract(), }); }); diff --git a/packages/core/overlays/core-overlays-browser-internal/src/banners/banners_service.tsx b/packages/core/overlays/core-overlays-browser-internal/src/banners/banners_service.tsx index 4ae4c6b18baa..d67d3b598a2e 100644 --- a/packages/core/overlays/core-overlays-browser-internal/src/banners/banners_service.tsx +++ b/packages/core/overlays/core-overlays-browser-internal/src/banners/banners_service.tsx @@ -10,7 +10,9 @@ import React from 'react'; import { BehaviorSubject, type Observable } from 'rxjs'; import { map } from 'rxjs'; +import type { AnalyticsServiceStart } from '@kbn/core-analytics-browser'; import type { I18nStart } from '@kbn/core-i18n-browser'; +import type { ThemeServiceStart } from '@kbn/core-theme-browser'; import type { IUiSettingsClient } from '@kbn/core-ui-settings-browser'; import type { MountPoint } from '@kbn/core-mount-utils-browser'; import type { OverlayBannersStart } from '@kbn/core-overlays-browser'; @@ -18,8 +20,13 @@ import { PriorityMap } from './priority_map'; import { BannersList } from './banners_list'; import { UserBannerService } from './user_banner_service'; -interface StartDeps { +interface StartServices { + analytics: AnalyticsServiceStart; i18n: I18nStart; + theme: ThemeServiceStart; +} + +interface StartDeps extends StartServices { uiSettings: IUiSettingsClient; } @@ -39,7 +46,7 @@ export interface OverlayBanner { export class OverlayBannersService { private readonly userBanner = new UserBannerService(); - public start({ i18n, uiSettings }: StartDeps): InternalOverlayBannersStart { + public start({ uiSettings, ...startServices }: StartDeps): InternalOverlayBannersStart { let uniqueId = 0; const genId = () => `${uniqueId++}`; const banners$ = new BehaviorSubject(new PriorityMap()); @@ -79,7 +86,7 @@ export class OverlayBannersService { }, }; - this.userBanner.start({ banners: service, i18n, uiSettings }); + this.userBanner.start({ banners: service, uiSettings, ...startServices }); return service; } diff --git a/packages/core/overlays/core-overlays-browser-internal/src/banners/user_banner_service.test.ts b/packages/core/overlays/core-overlays-browser-internal/src/banners/user_banner_service.test.ts index a0143b37c04b..105958ab8727 100644 --- a/packages/core/overlays/core-overlays-browser-internal/src/banners/user_banner_service.test.ts +++ b/packages/core/overlays/core-overlays-browser-internal/src/banners/user_banner_service.test.ts @@ -9,7 +9,9 @@ import { uiSettingsServiceMock } from '@kbn/core-ui-settings-browser-mocks'; import { UserBannerService } from './user_banner_service'; import { overlayBannersServiceMock } from './banners_service.test.mocks'; +import { analyticsServiceMock } from '@kbn/core-analytics-browser-mocks'; import { i18nServiceMock } from '@kbn/core-i18n-browser-mocks'; +import { themeServiceMock } from '@kbn/core-theme-browser-mocks'; import { Subject } from 'rxjs'; describe('OverlayBannersService', () => { @@ -33,7 +35,9 @@ describe('OverlayBannersService', () => { service = new UserBannerService(); service.start({ banners, + analytics: analyticsServiceMock.createAnalyticsServiceStart(), i18n: i18nServiceMock.createStartContract(), + theme: themeServiceMock.createStartContract(), uiSettings, }); }; diff --git a/packages/core/overlays/core-overlays-browser-internal/src/banners/user_banner_service.tsx b/packages/core/overlays/core-overlays-browser-internal/src/banners/user_banner_service.tsx index b4eb687f604b..6ae9d5736c0e 100644 --- a/packages/core/overlays/core-overlays-browser-internal/src/banners/user_banner_service.tsx +++ b/packages/core/overlays/core-overlays-browser-internal/src/banners/user_banner_service.tsx @@ -14,13 +14,21 @@ import { Subscription } from 'rxjs'; import { FormattedMessage } from '@kbn/i18n-react'; import { EuiCallOut, EuiButton, EuiLoadingSpinner } from '@elastic/eui'; +import type { AnalyticsServiceStart } from '@kbn/core-analytics-browser'; +import type { ThemeServiceStart } from '@kbn/core-theme-browser'; import type { I18nStart } from '@kbn/core-i18n-browser'; import type { IUiSettingsClient } from '@kbn/core-ui-settings-browser'; import type { OverlayBannersStart } from '@kbn/core-overlays-browser'; +import { KibanaRenderContextProvider } from '@kbn/react-kibana-context-render'; -interface StartDeps { - banners: OverlayBannersStart; +interface StartServices { + analytics: AnalyticsServiceStart; i18n: I18nStart; + theme: ThemeServiceStart; +} + +interface StartDeps extends StartServices { + banners: OverlayBannersStart; uiSettings: IUiSettingsClient; } @@ -33,7 +41,7 @@ const ReactMarkdownLazy = React.lazy(() => import('react-markdown')); export class UserBannerService { private settingsSubscription?: Subscription; - public start({ banners, i18n, uiSettings }: StartDeps) { + public start({ banners, uiSettings, ...startServices }: StartDeps) { let id: string | undefined; let timeout: any; @@ -55,7 +63,7 @@ export class UserBannerService { id, (el) => { ReactDOM.render( - + - , + , el ); diff --git a/packages/core/overlays/core-overlays-browser-internal/src/overlay_service.ts b/packages/core/overlays/core-overlays-browser-internal/src/overlay_service.ts index 4860a84559d4..ca1a932564f1 100644 --- a/packages/core/overlays/core-overlays-browser-internal/src/overlay_service.ts +++ b/packages/core/overlays/core-overlays-browser-internal/src/overlay_service.ts @@ -39,7 +39,7 @@ export class OverlayService { targetDomElement: flyoutElement, }); - const banners = this.bannersService.start({ i18n, uiSettings }); + const banners = this.bannersService.start({ uiSettings, analytics, i18n, theme }); const modalElement = document.createElement('div'); targetDomElement.appendChild(modalElement); diff --git a/packages/core/rendering/core-rendering-browser-internal/src/rendering_service.tsx b/packages/core/rendering/core-rendering-browser-internal/src/rendering_service.tsx index 38a7dec34690..0cfa0a0da2bc 100644 --- a/packages/core/rendering/core-rendering-browser-internal/src/rendering_service.tsx +++ b/packages/core/rendering/core-rendering-browser-internal/src/rendering_service.tsx @@ -19,14 +19,17 @@ import type { ThemeServiceStart } from '@kbn/core-theme-browser'; import { KibanaRootContextProvider } from '@kbn/react-kibana-context-root'; import { AppWrapper } from './app_containers'; -export interface StartDeps { +interface StartServices { analytics: AnalyticsServiceStart; + i18n: I18nStart; + theme: ThemeServiceStart; +} + +export interface StartDeps extends StartServices { application: InternalApplicationStart; chrome: InternalChromeStart; overlays: OverlayStart; targetDomElement: HTMLDivElement; - theme: ThemeServiceStart; - i18n: I18nStart; } /** @@ -38,7 +41,7 @@ export interface StartDeps { * @internal */ export class RenderingService { - start({ analytics, application, chrome, overlays, theme, i18n, targetDomElement }: StartDeps) { + start({ application, chrome, overlays, targetDomElement, ...startServices }: StartDeps) { const chromeHeader = chrome.getHeaderComponent(); const appComponent = application.getComponent(); const bannerComponent = overlays.banners.getComponent(); @@ -53,12 +56,7 @@ export class RenderingService { }); ReactDOM.render( - + <> {/* Fixed headers */} {chromeHeader} diff --git a/packages/core/rendering/core-rendering-browser-internal/tsconfig.json b/packages/core/rendering/core-rendering-browser-internal/tsconfig.json index 7a02ff379609..42c59f96b247 100644 --- a/packages/core/rendering/core-rendering-browser-internal/tsconfig.json +++ b/packages/core/rendering/core-rendering-browser-internal/tsconfig.json @@ -15,8 +15,6 @@ "kbn_references": [ "@kbn/core-application-common", "@kbn/core-application-browser-internal", - "@kbn/core-theme-browser", - "@kbn/core-i18n-browser", "@kbn/core-overlays-browser", "@kbn/core-chrome-browser-internal", "@kbn/core-application-browser-mocks", @@ -25,8 +23,10 @@ "@kbn/core-theme-browser-mocks", "@kbn/core-i18n-browser-mocks", "@kbn/react-kibana-context-root", - "@kbn/core-analytics-browser", "@kbn/core-analytics-browser-mocks", + "@kbn/core-analytics-browser", + "@kbn/core-i18n-browser", + "@kbn/core-theme-browser" ], "exclude": [ "target/**/*", diff --git a/src/plugins/newsfeed/kibana.jsonc b/src/plugins/newsfeed/kibana.jsonc index b4d3ea1ad1d8..b0c9e21b8fa5 100644 --- a/src/plugins/newsfeed/kibana.jsonc +++ b/src/plugins/newsfeed/kibana.jsonc @@ -9,8 +9,6 @@ "requiredPlugins": [ "screenshotMode" ], - "requiredBundles": [ - "kibanaReact" - ] + "requiredBundles": [] } } diff --git a/src/plugins/newsfeed/public/plugin.tsx b/src/plugins/newsfeed/public/plugin.tsx index 31d99501a6fb..b78d5c110a16 100644 --- a/src/plugins/newsfeed/public/plugin.tsx +++ b/src/plugins/newsfeed/public/plugin.tsx @@ -11,15 +11,8 @@ import { catchError, takeUntil } from 'rxjs'; import ReactDOM from 'react-dom'; import React from 'react'; import moment from 'moment'; -import { I18nProvider } from '@kbn/i18n-react'; -import { - PluginInitializerContext, - CoreSetup, - CoreStart, - CoreTheme, - Plugin, -} from '@kbn/core/public'; -import { KibanaThemeProvider } from '@kbn/kibana-react-plugin/public'; +import { PluginInitializerContext, CoreSetup, CoreStart, Plugin } from '@kbn/core/public'; +import { KibanaRenderContextProvider } from '@kbn/react-kibana-context-render'; import { NewsfeedPluginBrowserConfig, NewsfeedPluginStartDependencies } from './types'; import { NewsfeedNavButton } from './components/newsfeed_header_nav_button'; import { getApi, NewsfeedApi, NewsfeedApiEndpoint } from './lib/api'; @@ -45,7 +38,7 @@ export class NewsfeedPublicPlugin }); } - public setup(core: CoreSetup) { + public setup(_core: CoreSetup) { return {}; } @@ -55,8 +48,7 @@ export class NewsfeedPublicPlugin const api = this.createNewsfeedApi(this.config, NewsfeedApiEndpoint.KIBANA, isScreenshotMode); core.chrome.navControls.registerRight({ order: 1000, - mount: (target) => - this.mount(api, target, core.theme.theme$, core.customBranding.hasCustomBranding$), + mount: (target) => this.mount(api, target, core), }); return { @@ -92,18 +84,12 @@ export class NewsfeedPublicPlugin }; } - private mount( - api: NewsfeedApi, - targetDomElement: HTMLElement, - theme$: Rx.Observable, - hasCustomBranding$: Rx.Observable - ) { + private mount(api: NewsfeedApi, targetDomElement: HTMLElement, core: CoreStart) { + const hasCustomBranding$ = core.customBranding.hasCustomBranding$; ReactDOM.render( - - - - - , + + + , targetDomElement ); return () => ReactDOM.unmountComponentAtNode(targetDomElement); diff --git a/src/plugins/newsfeed/tsconfig.json b/src/plugins/newsfeed/tsconfig.json index b10a878fb295..8c97a4420c48 100644 --- a/src/plugins/newsfeed/tsconfig.json +++ b/src/plugins/newsfeed/tsconfig.json @@ -6,12 +6,12 @@ "include": ["public/**/*", "server/**/*", "common/*", "../../../typings/**/*"], "kbn_references": [ "@kbn/core", - "@kbn/kibana-react-plugin", "@kbn/screenshot-mode-plugin", "@kbn/i18n-react", "@kbn/i18n", "@kbn/utility-types", "@kbn/config-schema", + "@kbn/react-kibana-context-render", ], "exclude": [ "target/**/*", diff --git a/src/plugins/saved_objects/kibana.jsonc b/src/plugins/saved_objects/kibana.jsonc index feb59248c049..aa1c9aae3119 100644 --- a/src/plugins/saved_objects/kibana.jsonc +++ b/src/plugins/saved_objects/kibana.jsonc @@ -11,8 +11,7 @@ "dataViews" ], "requiredBundles": [ - "kibanaUtils", - "kibanaReact" + "kibanaUtils" ] } } diff --git a/src/plugins/saved_objects/public/kibana_services.ts b/src/plugins/saved_objects/public/kibana_services.ts index aae1769afd72..90a2aa0e5cd3 100644 --- a/src/plugins/saved_objects/public/kibana_services.ts +++ b/src/plugins/saved_objects/public/kibana_services.ts @@ -13,5 +13,6 @@ export function setStartServices(core: CoreStart) { coreStart = core; } +export const getAnalytics = () => coreStart.analytics; export const getI18n = () => coreStart.i18n; export const getTheme = () => coreStart.theme; diff --git a/src/plugins/saved_objects/public/plugin.ts b/src/plugins/saved_objects/public/plugin.ts index 51c1711184c1..df6b7991f1c3 100644 --- a/src/plugins/saved_objects/public/plugin.ts +++ b/src/plugins/saved_objects/public/plugin.ts @@ -57,6 +57,7 @@ export class SavedObjectsPublicPlugin chrome: core.chrome, overlays: core.overlays, }, + core, this.decoratorRegistry ), }; diff --git a/src/plugins/saved_objects/public/save_modal/show_saved_object_save_modal.tsx b/src/plugins/saved_objects/public/save_modal/show_saved_object_save_modal.tsx index 55c45e276230..a58848f06c98 100644 --- a/src/plugins/saved_objects/public/save_modal/show_saved_object_save_modal.tsx +++ b/src/plugins/saved_objects/public/save_modal/show_saved_object_save_modal.tsx @@ -9,8 +9,8 @@ import React from 'react'; import ReactDOM from 'react-dom'; -import { KibanaThemeProvider } from '@kbn/kibana-react-plugin/public'; -import { getI18n, getTheme } from '../kibana_services'; +import { KibanaRenderContextProvider } from '@kbn/react-kibana-context-render'; +import { getAnalytics, getI18n, getTheme } from '../kibana_services'; /** * Represents the result of trying to persist the saved object. @@ -59,9 +59,9 @@ export function showSaveModal( const I18nContext = getI18n().Context; ReactDOM.render( - + {Wrapper ? {element} : element} - , + , container ); } diff --git a/src/plugins/saved_objects/public/saved_object/helpers/build_saved_object.ts b/src/plugins/saved_objects/public/saved_object/helpers/build_saved_object.ts index 647eece25752..7fb8c6941fa2 100644 --- a/src/plugins/saved_objects/public/saved_object/helpers/build_saved_object.ts +++ b/src/plugins/saved_objects/public/saved_object/helpers/build_saved_object.ts @@ -17,6 +17,7 @@ import { SavedObjectConfig, SavedObjectKibanaServices, SavedObjectSaveOpts, + StartServices, } from '../../types'; import { applyESResp } from './apply_es_resp'; import { saveSavedObject } from './save_saved_object'; @@ -37,6 +38,7 @@ export function buildSavedObject( savedObject: SavedObject, config: SavedObjectConfig, services: SavedObjectKibanaServices, + startServices: StartServices, decorators: SavedObjectDecorator[] = [] ) { applyDecorators(savedObject, config, decorators); @@ -110,7 +112,7 @@ export function buildSavedObject( savedObject.save = async (opts: SavedObjectSaveOpts) => { try { - const result = await saveSavedObject(savedObject, config, opts, services); + const result = await saveSavedObject(savedObject, config, opts, services, startServices); return Promise.resolve(result); } catch (e) { return Promise.reject(e); diff --git a/src/plugins/saved_objects/public/saved_object/helpers/check_for_duplicate_title.ts b/src/plugins/saved_objects/public/saved_object/helpers/check_for_duplicate_title.ts index 763b94c949da..e87f8e6fb7a7 100644 --- a/src/plugins/saved_objects/public/saved_object/helpers/check_for_duplicate_title.ts +++ b/src/plugins/saved_objects/public/saved_object/helpers/check_for_duplicate_title.ts @@ -6,7 +6,7 @@ * Side Public License, v 1. */ -import { SavedObject, SavedObjectKibanaServices } from '../../types'; +import { SavedObject, SavedObjectKibanaServices, StartServices } from '../../types'; import { findObjectByTitle } from './find_object_by_title'; import { SAVE_DUPLICATE_REJECTED } from '../../constants'; import { displayDuplicateTitleConfirmModal } from './display_duplicate_title_confirm_modal'; @@ -19,6 +19,7 @@ import { displayDuplicateTitleConfirmModal } from './display_duplicate_title_con * @param isTitleDuplicateConfirmed * @param onTitleDuplicate * @param services + * @param startServices */ export async function checkForDuplicateTitle( savedObject: Pick< @@ -27,7 +28,8 @@ export async function checkForDuplicateTitle( >, isTitleDuplicateConfirmed: boolean, onTitleDuplicate: (() => void) | undefined, - services: Pick + services: Pick, + startServices: StartServices ): Promise { const { savedObjectsClient, overlays } = services; // Don't check for duplicates if user has already confirmed save with duplicate title @@ -58,5 +60,5 @@ export async function checkForDuplicateTitle( // TODO: make onTitleDuplicate a required prop and remove UI components from this class // Need to leave here until all users pass onTitleDuplicate. - return displayDuplicateTitleConfirmModal(savedObject, overlays); + return displayDuplicateTitleConfirmModal(savedObject, overlays, startServices); } diff --git a/src/plugins/saved_objects/public/saved_object/helpers/confirm_modal_promise.tsx b/src/plugins/saved_objects/public/saved_object/helpers/confirm_modal_promise.tsx index 6b09d4118d7d..aa943a7778ea 100644 --- a/src/plugins/saved_objects/public/saved_object/helpers/confirm_modal_promise.tsx +++ b/src/plugins/saved_objects/public/saved_object/helpers/confirm_modal_promise.tsx @@ -7,16 +7,19 @@ */ import React from 'react'; -import { OverlayStart } from '@kbn/core/public'; +import { CoreStart, OverlayStart } from '@kbn/core/public'; import { i18n } from '@kbn/i18n'; import { EuiConfirmModal } from '@elastic/eui'; -import { toMountPoint } from '@kbn/kibana-react-plugin/public'; +import { toMountPoint } from '@kbn/react-kibana-mount'; + +type StartServices = Pick; export function confirmModalPromise( message = '', title = '', confirmBtnText = '', - overlays: OverlayStart + overlays: OverlayStart, + startServices: StartServices ): Promise { return new Promise((resolve, reject) => { const cancelButtonText = i18n.translate('savedObjects.confirmModal.cancelButtonLabel', { @@ -39,7 +42,8 @@ export function confirmModalPromise( title={title} > {message} - + , + startServices ) ); }); diff --git a/src/plugins/saved_objects/public/saved_object/helpers/create_source.ts b/src/plugins/saved_objects/public/saved_object/helpers/create_source.ts index 66d67b049642..f559490ff328 100644 --- a/src/plugins/saved_objects/public/saved_object/helpers/create_source.ts +++ b/src/plugins/saved_objects/public/saved_object/helpers/create_source.ts @@ -9,7 +9,7 @@ import { get } from 'lodash'; import { i18n } from '@kbn/i18n'; import { SavedObjectAttributes } from '@kbn/core/public'; -import { SavedObject, SavedObjectKibanaServices } from '../../types'; +import { SavedObject, SavedObjectKibanaServices, StartServices } from '../../types'; import { OVERWRITE_REJECTED } from '../../constants'; import { confirmModalPromise } from './confirm_modal_promise'; @@ -33,7 +33,8 @@ export async function createSource( savedObject: SavedObject, esType: string, options = {}, - services: SavedObjectKibanaServices + services: SavedObjectKibanaServices, + startServices: StartServices ) { const { savedObjectsClient, overlays } = services; try { @@ -57,7 +58,7 @@ export async function createSource( defaultMessage: 'Overwrite', }); - return confirmModalPromise(confirmMessage, title, confirmButtonText, overlays) + return confirmModalPromise(confirmMessage, title, confirmButtonText, overlays, startServices) .then(() => savedObjectsClient.create( esType, diff --git a/src/plugins/saved_objects/public/saved_object/helpers/display_duplicate_title_confirm_modal.ts b/src/plugins/saved_objects/public/saved_object/helpers/display_duplicate_title_confirm_modal.ts index 0957400e9f95..4a545561a7f2 100644 --- a/src/plugins/saved_objects/public/saved_object/helpers/display_duplicate_title_confirm_modal.ts +++ b/src/plugins/saved_objects/public/saved_object/helpers/display_duplicate_title_confirm_modal.ts @@ -10,11 +10,12 @@ import { i18n } from '@kbn/i18n'; import { OverlayStart } from '@kbn/core/public'; import { SAVE_DUPLICATE_REJECTED } from '../../constants'; import { confirmModalPromise } from './confirm_modal_promise'; -import { SavedObject } from '../../types'; +import { SavedObject, StartServices } from '../../types'; export function displayDuplicateTitleConfirmModal( savedObject: Pick, - overlays: OverlayStart + overlays: OverlayStart, + startServices: StartServices ): Promise { const confirmMessage = i18n.translate( 'savedObjects.confirmModal.saveDuplicateConfirmationMessage', @@ -29,7 +30,7 @@ export function displayDuplicateTitleConfirmModal( values: { name: savedObject.getDisplayName() }, }); try { - return confirmModalPromise(confirmMessage, '', confirmButtonText, overlays); + return confirmModalPromise(confirmMessage, '', confirmButtonText, overlays, startServices); } catch (_) { return Promise.reject(new Error(SAVE_DUPLICATE_REJECTED)); } diff --git a/src/plugins/saved_objects/public/saved_object/helpers/save_saved_object.ts b/src/plugins/saved_objects/public/saved_object/helpers/save_saved_object.ts index d6e7030ce26f..3ccd2433e2ed 100644 --- a/src/plugins/saved_objects/public/saved_object/helpers/save_saved_object.ts +++ b/src/plugins/saved_objects/public/saved_object/helpers/save_saved_object.ts @@ -11,6 +11,7 @@ import { SavedObjectConfig, SavedObjectKibanaServices, SavedObjectSaveOpts, + StartServices, } from '../../types'; import { OVERWRITE_REJECTED, SAVE_DUPLICATE_REJECTED } from '../../constants'; import { createSource } from './create_source'; @@ -38,6 +39,7 @@ export function isErrorNonFatal(error: { message: string }) { * @property {func} [options.onTitleDuplicate] - function called if duplicate title exists. * When not provided, confirm modal will be displayed asking user to confirm or cancel save. * @param {SavedObjectKibanaServices} [services] + * @param {StartServices} [startServices] * @return {Promise} * @resolved {String} - The id of the doc */ @@ -49,7 +51,8 @@ export async function saveSavedObject( isTitleDuplicateConfirmed = false, onTitleDuplicate, }: SavedObjectSaveOpts = {}, - services: SavedObjectKibanaServices + services: SavedObjectKibanaServices, + startServices: StartServices ): Promise { const { savedObjectsClient, chrome } = services; @@ -79,7 +82,8 @@ export async function saveSavedObject( savedObject, isTitleDuplicateConfirmed, onTitleDuplicate, - services + services, + startServices ); savedObject.isSaving = true; const resp = confirmOverwrite @@ -88,7 +92,8 @@ export async function saveSavedObject( savedObject, esType, savedObject.creationOpts({ references }), - services + services, + startServices ) : await savedObjectsClient.create( esType, diff --git a/src/plugins/saved_objects/public/saved_object/helpers/save_with_confirmation.test.ts b/src/plugins/saved_objects/public/saved_object/helpers/save_with_confirmation.test.ts index bc51775dda42..c835962f1e64 100644 --- a/src/plugins/saved_objects/public/saved_object/helpers/save_with_confirmation.test.ts +++ b/src/plugins/saved_objects/public/saved_object/helpers/save_with_confirmation.test.ts @@ -8,6 +8,7 @@ import { SavedObjectAttributes, SavedObjectsCreateOptions, OverlayStart } from '@kbn/core/public'; import { SavedObjectsClientContract } from '@kbn/core/public'; +import { analyticsServiceMock, i18nServiceMock, themeServiceMock } from '@kbn/core/public/mocks'; import { saveWithConfirmation } from './save_with_confirmation'; import * as deps from './confirm_modal_promise'; import { OVERWRITE_REJECTED } from '../../constants'; @@ -22,6 +23,11 @@ describe('saveWithConfirmation', () => { title: 'test title', displayName: 'test display name', }; + const startServices = { + analytics: analyticsServiceMock.createAnalyticsServiceStart(), + i18n: i18nServiceMock.createStartContract(), + theme: themeServiceMock.createStartContract(), + }; beforeEach(() => { savedObjectsClient.create = jest.fn(); @@ -29,7 +35,13 @@ describe('saveWithConfirmation', () => { }); test('should call create of savedObjectsClient', async () => { - await saveWithConfirmation(source, savedObject, options, { savedObjectsClient, overlays }); + await saveWithConfirmation( + source, + savedObject, + options, + { savedObjectsClient, overlays }, + startServices + ); expect(savedObjectsClient.create).toHaveBeenCalledWith( savedObject.getEsType(), source, @@ -44,12 +56,23 @@ describe('saveWithConfirmation', () => { opt && opt.overwrite ? Promise.resolve({} as any) : Promise.reject({ res: { status: 409 } }) ); - await saveWithConfirmation(source, savedObject, options, { savedObjectsClient, overlays }); + await saveWithConfirmation( + source, + savedObject, + options, + { savedObjectsClient, overlays }, + startServices + ); expect(deps.confirmModalPromise).toHaveBeenCalledWith( expect.any(String), expect.any(String), expect.any(String), - overlays + overlays, + expect.objectContaining({ + analytics: expect.any(Object), + i18n: expect.any(Object), + theme: expect.any(Object), + }) ); }); @@ -60,7 +83,13 @@ describe('saveWithConfirmation', () => { opt && opt.overwrite ? Promise.resolve({} as any) : Promise.reject({ res: { status: 409 } }) ); - await saveWithConfirmation(source, savedObject, options, { savedObjectsClient, overlays }); + await saveWithConfirmation( + source, + savedObject, + options, + { savedObjectsClient, overlays }, + startServices + ); expect(savedObjectsClient.create).toHaveBeenLastCalledWith(savedObject.getEsType(), source, { overwrite: true, ...options, @@ -73,10 +102,16 @@ describe('saveWithConfirmation', () => { expect.assertions(1); await expect( - saveWithConfirmation(source, savedObject, options, { - savedObjectsClient, - overlays, - }) + saveWithConfirmation( + source, + savedObject, + options, + { + savedObjectsClient, + overlays, + }, + startServices + ) ).rejects.toThrow(OVERWRITE_REJECTED); }); }); diff --git a/src/plugins/saved_objects/public/saved_object/helpers/save_with_confirmation.ts b/src/plugins/saved_objects/public/saved_object/helpers/save_with_confirmation.ts index 3f4ddbf9836d..a29f11d2abe5 100644 --- a/src/plugins/saved_objects/public/saved_object/helpers/save_with_confirmation.ts +++ b/src/plugins/saved_objects/public/saved_object/helpers/save_with_confirmation.ts @@ -15,6 +15,7 @@ import { SavedObjectsClientContract, } from '@kbn/core/public'; import { OVERWRITE_REJECTED } from '../../constants'; +import type { StartServices } from '../../types'; import { confirmModalPromise } from './confirm_modal_promise'; /** @@ -38,7 +39,8 @@ export async function saveWithConfirmation( displayName: string; }, options: SavedObjectsCreateOptions, - services: { savedObjectsClient: SavedObjectsClientContract; overlays: OverlayStart } + services: { savedObjectsClient: SavedObjectsClientContract; overlays: OverlayStart }, + startServices: StartServices ) { const { savedObjectsClient, overlays } = services; try { @@ -62,7 +64,7 @@ export async function saveWithConfirmation( defaultMessage: 'Overwrite', }); - return confirmModalPromise(confirmMessage, title, confirmButtonText, overlays) + return confirmModalPromise(confirmMessage, title, confirmButtonText, overlays, startServices) .then(() => savedObjectsClient.create(savedObject.getEsType(), source, { overwrite: true, diff --git a/src/plugins/saved_objects/public/saved_object/saved_object.test.ts b/src/plugins/saved_objects/public/saved_object/saved_object.test.ts index 52e35772ba59..0ceb0ad32a9d 100644 --- a/src/plugins/saved_objects/public/saved_object/saved_object.test.ts +++ b/src/plugins/saved_objects/public/saved_object/saved_object.test.ts @@ -15,7 +15,12 @@ import { } from '../types'; import { SavedObjectDecorator } from './decorators'; -import { coreMock } from '@kbn/core/public/mocks'; +import { + analyticsServiceMock, + coreMock, + i18nServiceMock, + themeServiceMock, +} from '@kbn/core/public/mocks'; import { dataPluginMock, createSearchSourceMock } from '@kbn/data-plugin/public/mocks'; import { createStubIndexPattern } from '@kbn/data-plugin/common/stubs'; import { SavedObjectAttributes, SimpleSavedObject } from '@kbn/core/public'; @@ -27,6 +32,11 @@ describe('Saved Object', () => { const dataStartMock = dataPluginMock.createStartContract(); const saveOptionsMock = {} as SavedObjectSaveOpts; const savedObjectsClientStub = startMock.savedObjects.client; + const startServices = { + analytics: analyticsServiceMock.createAnalyticsServiceStart(), + i18n: i18nServiceMock.createStartContract(), + theme: themeServiceMock.createStartContract(), + }; let decoratorRegistry: ReturnType; let SavedObjectClass: new (config: SavedObjectConfig) => SavedObject; @@ -104,6 +114,7 @@ describe('Saved Object', () => { }, }, } as unknown as SavedObjectKibanaServices, + startServices, decoratorRegistry ); }; @@ -660,6 +671,7 @@ describe('Saved Object', () => { ...dataStartMock.search, }, } as unknown as SavedObjectKibanaServices, + startServices, decoratorRegistry ); const savedObject = new SavedObjectClass({ type: 'dashboard', searchSource: true }); diff --git a/src/plugins/saved_objects/public/saved_object/saved_object.ts b/src/plugins/saved_objects/public/saved_object/saved_object.ts index a437431a9d82..581eb752e0dc 100644 --- a/src/plugins/saved_objects/public/saved_object/saved_object.ts +++ b/src/plugins/saved_objects/public/saved_object/saved_object.ts @@ -16,12 +16,13 @@ * This class seems to interface with ES primarily through the es Angular * service and the saved object api. */ -import { SavedObject, SavedObjectConfig, SavedObjectKibanaServices } from '../types'; +import { SavedObject, SavedObjectConfig, SavedObjectKibanaServices, StartServices } from '../types'; import { ISavedObjectDecoratorRegistry } from './decorators'; import { buildSavedObject } from './helpers/build_saved_object'; export function createSavedObjectClass( services: SavedObjectKibanaServices, + startServices: StartServices, decoratorRegistry: ISavedObjectDecoratorRegistry ) { /** @@ -35,7 +36,13 @@ export function createSavedObjectClass( constructor(config: SavedObjectConfig = {}) { // @ts-ignore const self: SavedObject = this; - buildSavedObject(self, config, services, decoratorRegistry.getOrderedDecorators(services)); + buildSavedObject( + self, + config, + services, + startServices, + decoratorRegistry.getOrderedDecorators(services) + ); } } diff --git a/src/plugins/saved_objects/public/types.ts b/src/plugins/saved_objects/public/types.ts index ce3f41e5bb62..f3322bf89628 100644 --- a/src/plugins/saved_objects/public/types.ts +++ b/src/plugins/saved_objects/public/types.ts @@ -8,6 +8,7 @@ import { ChromeStart, + CoreStart, OverlayStart, SavedObjectsClientContract, SavedObjectAttributes, @@ -68,6 +69,8 @@ export interface SavedObjectKibanaServices { overlays: OverlayStart; } +export type StartServices = Pick; + export interface SavedObjectAttributesAndRefs { attributes: SavedObjectAttributes; references: SavedObjectReference[]; diff --git a/src/plugins/saved_objects/tsconfig.json b/src/plugins/saved_objects/tsconfig.json index ffbf2b88e543..39557cef8c5b 100644 --- a/src/plugins/saved_objects/tsconfig.json +++ b/src/plugins/saved_objects/tsconfig.json @@ -8,12 +8,13 @@ "@kbn/core", "@kbn/data-plugin", "@kbn/kibana-utils-plugin", - "@kbn/kibana-react-plugin", "@kbn/i18n", "@kbn/data-views-plugin", "@kbn/i18n-react", "@kbn/utility-types", "@kbn/ui-theme", + "@kbn/react-kibana-context-render", + "@kbn/react-kibana-mount", ], "exclude": [ "target/**/*", diff --git a/src/plugins/saved_objects_management/public/management_section/mount_section.tsx b/src/plugins/saved_objects_management/public/management_section/mount_section.tsx index fd284c7ea306..fe11eccbf861 100644 --- a/src/plugins/saved_objects_management/public/management_section/mount_section.tsx +++ b/src/plugins/saved_objects_management/public/management_section/mount_section.tsx @@ -9,12 +9,11 @@ import React, { lazy, Suspense } from 'react'; import ReactDOM from 'react-dom'; import { Router, Routes, Route } from '@kbn/shared-ux-router'; -import { I18nProvider } from '@kbn/i18n-react'; import { i18n } from '@kbn/i18n'; import { EuiLoadingSpinner } from '@elastic/eui'; import { CoreSetup } from '@kbn/core/public'; -import { wrapWithTheme } from '@kbn/kibana-react-plugin/public'; import { ManagementAppMountParams } from '@kbn/management-plugin/public'; +import { KibanaRenderContextProvider } from '@kbn/react-kibana-context-render'; import type { SavedObjectManagementTypeInfo } from '../../common/types'; import { StartDependencies, SavedObjectsManagementPluginStart } from '../plugin'; import { getAllowedTypes } from '../lib'; @@ -37,7 +36,6 @@ export const mountManagementSection = async ({ core, mountParams }: MountParams) await core.getStartServices(); const { capabilities } = coreStart.application; const { element, history, setBreadcrumbs } = mountParams; - const { theme$ } = core.theme; if (!allowedObjectTypes) { allowedObjectTypes = await getAllowedTypes(coreStart.http); @@ -56,43 +54,40 @@ export const mountManagementSection = async ({ core, mountParams }: MountParams) }; ReactDOM.render( - wrapWithTheme( - - - - - - }> - - - - - - - }> - - - - - - - , - theme$ - ), + + + + + + }> + + + + + + + }> + + + + + + + , element ); diff --git a/src/plugins/saved_objects_management/tsconfig.json b/src/plugins/saved_objects_management/tsconfig.json index 90f9ddae93a6..42c30216b58a 100644 --- a/src/plugins/saved_objects_management/tsconfig.json +++ b/src/plugins/saved_objects_management/tsconfig.json @@ -31,6 +31,7 @@ "@kbn/core-saved-objects-api-server", "@kbn/shared-ux-link-redirect-app", "@kbn/code-editor", + "@kbn/react-kibana-context-render", ], "exclude": [ "target/**/*", diff --git a/src/plugins/telemetry/kibana.jsonc b/src/plugins/telemetry/kibana.jsonc index 44162c1189c2..a5edcdde85d9 100644 --- a/src/plugins/telemetry/kibana.jsonc +++ b/src/plugins/telemetry/kibana.jsonc @@ -17,8 +17,7 @@ "security" ], "requiredBundles": [ - "kibanaUtils", - "kibanaReact" + "kibanaUtils" ], "extraPublicDirs": [ "common/constants" diff --git a/src/plugins/telemetry/public/mocks.ts b/src/plugins/telemetry/public/mocks.ts index c4ecd11426b9..478c9729dfe9 100644 --- a/src/plugins/telemetry/public/mocks.ts +++ b/src/plugins/telemetry/public/mocks.ts @@ -8,7 +8,9 @@ import { overlayServiceMock, + analyticsServiceMock, httpServiceMock, + i18nServiceMock, notificationServiceMock, themeServiceMock, } from '@kbn/core/public/mocks'; @@ -76,6 +78,8 @@ export function mockTelemetryNotifications({ return new TelemetryNotifications({ http: httpServiceMock.createSetupContract(), overlays: overlayServiceMock.createStartContract(), + analytics: analyticsServiceMock.createAnalyticsServiceStart(), + i18n: i18nServiceMock.createStartContract(), theme: themeServiceMock.createStartContract(), telemetryService, telemetryConstants: mockTelemetryConstants(), diff --git a/src/plugins/telemetry/public/plugin.ts b/src/plugins/telemetry/public/plugin.ts index 588a532ffa6a..26a4f50af96c 100644 --- a/src/plugins/telemetry/public/plugin.ts +++ b/src/plugins/telemetry/public/plugin.ts @@ -229,7 +229,7 @@ export class TelemetryPlugin } public start( - { analytics, http, overlays, theme, application, docLinks }: CoreStart, + { analytics, http, overlays, application, docLinks, ...startServices }: CoreStart, { screenshotMode }: TelemetryPluginStartDependencies ): TelemetryPluginStart { if (!this.telemetryService) { @@ -243,9 +243,10 @@ export class TelemetryPlugin const telemetryNotifications = new TelemetryNotifications({ http, overlays, - theme, telemetryService: this.telemetryService, telemetryConstants, + analytics, + ...startServices, }); this.telemetryNotifications = telemetryNotifications; diff --git a/src/plugins/telemetry/public/services/telemetry_notifications/render_opt_in_status_notice_banner.test.ts b/src/plugins/telemetry/public/services/telemetry_notifications/render_opt_in_status_notice_banner.test.ts index 74e5d8f48849..84455f85704c 100644 --- a/src/plugins/telemetry/public/services/telemetry_notifications/render_opt_in_status_notice_banner.test.ts +++ b/src/plugins/telemetry/public/services/telemetry_notifications/render_opt_in_status_notice_banner.test.ts @@ -7,7 +7,13 @@ */ import { renderOptInStatusNoticeBanner } from './render_opt_in_status_notice_banner'; -import { overlayServiceMock, httpServiceMock, themeServiceMock } from '@kbn/core/public/mocks'; +import { + analyticsServiceMock, + httpServiceMock, + i18nServiceMock, + overlayServiceMock, + themeServiceMock, +} from '@kbn/core/public/mocks'; import { mockTelemetryConstants, mockTelemetryService } from '../../mocks'; describe('renderOptInStatusNoticeBanner', () => { @@ -15,6 +21,8 @@ describe('renderOptInStatusNoticeBanner', () => { const bannerID = 'brucer-wayne'; const overlays = overlayServiceMock.createStartContract(); const mockHttp = httpServiceMock.createStartContract(); + const analytics = analyticsServiceMock.createAnalyticsServiceStart(); + const i18n = i18nServiceMock.createStartContract(); const theme = themeServiceMock.createStartContract(); const telemetryConstants = mockTelemetryConstants(); const telemetryService = mockTelemetryService(); @@ -24,6 +32,8 @@ describe('renderOptInStatusNoticeBanner', () => { http: mockHttp, onSeen: jest.fn(), overlays, + analytics, + i18n, theme, telemetryConstants, telemetryService, diff --git a/src/plugins/telemetry/public/services/telemetry_notifications/render_opt_in_status_notice_banner.tsx b/src/plugins/telemetry/public/services/telemetry_notifications/render_opt_in_status_notice_banner.tsx index 7b48e0646d4e..1c604b51ee30 100644 --- a/src/plugins/telemetry/public/services/telemetry_notifications/render_opt_in_status_notice_banner.tsx +++ b/src/plugins/telemetry/public/services/telemetry_notifications/render_opt_in_status_notice_banner.tsx @@ -7,16 +7,15 @@ */ import React from 'react'; -import type { HttpStart, OverlayStart, ThemeServiceStart } from '@kbn/core/public'; -import { toMountPoint } from '@kbn/kibana-react-plugin/public'; +import type { CoreStart, HttpStart, OverlayStart } from '@kbn/core/public'; +import { toMountPoint } from '@kbn/react-kibana-mount'; import { withSuspense } from '@kbn/shared-ux-utility'; import { TelemetryService } from '..'; import type { TelemetryConstants } from '../..'; -interface RenderBannerConfig { +interface RenderBannerConfig extends Pick { http: HttpStart; overlays: OverlayStart; - theme: ThemeServiceStart; onSeen: () => void; telemetryConstants: TelemetryConstants; telemetryService: TelemetryService; @@ -26,9 +25,9 @@ export function renderOptInStatusNoticeBanner({ onSeen, overlays, http, - theme, telemetryConstants, telemetryService, + ...startServices }: RenderBannerConfig) { const OptedInNoticeBannerLazy = withSuspense( React.lazy(() => @@ -47,7 +46,7 @@ export function renderOptInStatusNoticeBanner({ telemetryConstants={telemetryConstants} telemetryService={telemetryService} />, - { theme$: theme.theme$ } + startServices ); const bannerId = overlays.banners.add(mount, 10000); diff --git a/src/plugins/telemetry/public/services/telemetry_notifications/telemetry_notifications.ts b/src/plugins/telemetry/public/services/telemetry_notifications/telemetry_notifications.ts index 9259735170bf..d4e44a20a48f 100644 --- a/src/plugins/telemetry/public/services/telemetry_notifications/telemetry_notifications.ts +++ b/src/plugins/telemetry/public/services/telemetry_notifications/telemetry_notifications.ts @@ -6,15 +6,15 @@ * Side Public License, v 1. */ -import type { HttpStart, OverlayStart, ThemeServiceStart } from '@kbn/core/public'; +import type { CoreStart, HttpStart, OverlayStart } from '@kbn/core/public'; import type { TelemetryService } from '../telemetry_service'; import type { TelemetryConstants } from '../..'; import { renderOptInStatusNoticeBanner } from './render_opt_in_status_notice_banner'; -interface TelemetryNotificationsConstructor { +interface TelemetryNotificationsConstructor + extends Pick { http: HttpStart; overlays: OverlayStart; - theme: ThemeServiceStart; telemetryService: TelemetryService; telemetryConstants: TelemetryConstants; } @@ -25,7 +25,7 @@ interface TelemetryNotificationsConstructor { export class TelemetryNotifications { private readonly http: HttpStart; private readonly overlays: OverlayStart; - private readonly theme: ThemeServiceStart; + private readonly startServices: Pick; private readonly telemetryConstants: TelemetryConstants; private readonly telemetryService: TelemetryService; private optInStatusNoticeBannerId?: string; @@ -33,14 +33,14 @@ export class TelemetryNotifications { constructor({ http, overlays, - theme, telemetryService, telemetryConstants, + ...startServices }: TelemetryNotificationsConstructor) { this.telemetryService = telemetryService; this.http = http; this.overlays = overlays; - this.theme = theme; + this.startServices = startServices; this.telemetryConstants = telemetryConstants; } @@ -61,9 +61,9 @@ export class TelemetryNotifications { http: this.http, onSeen: this.setOptInStatusNoticeSeen, overlays: this.overlays, - theme: this.theme, telemetryConstants: this.telemetryConstants, telemetryService: this.telemetryService, + ...this.startServices, }); this.optInStatusNoticeBannerId = bannerId; diff --git a/src/plugins/telemetry/tsconfig.json b/src/plugins/telemetry/tsconfig.json index 81ce6168d0b9..89d15d4f5a0a 100644 --- a/src/plugins/telemetry/tsconfig.json +++ b/src/plugins/telemetry/tsconfig.json @@ -15,7 +15,6 @@ "kbn_references": [ "@kbn/core", "@kbn/home-plugin", - "@kbn/kibana-react-plugin", "@kbn/kibana-utils-plugin", "@kbn/screenshot-mode-plugin", "@kbn/telemetry-collection-manager-plugin", @@ -36,6 +35,7 @@ "@kbn/core-http-browser", "@kbn/core-http-server", "@kbn/analytics-collection-utils", + "@kbn/react-kibana-mount", "@kbn/core-node-server", ], "exclude": [ diff --git a/x-pack/plugins/cloud_integrations/cloud_chat/public/plugin.tsx b/x-pack/plugins/cloud_integrations/cloud_chat/public/plugin.tsx index 84fb5c3e1c32..7f6471f1229c 100755 --- a/x-pack/plugins/cloud_integrations/cloud_chat/public/plugin.tsx +++ b/x-pack/plugins/cloud_integrations/cloud_chat/public/plugin.tsx @@ -57,7 +57,7 @@ export class CloudChatPlugin implements Plugin { // There's a risk that the request for chat config will take too much time to complete, and the provider // will maintain a stale value. To avoid this, we'll use an Observable. @@ -67,7 +67,7 @@ export class CloudChatPlugin implements Plugin - + = (props) => ( ); -export const mountExpiredBanner = (props: Props) => - toMountPoint(); +type MountProps = Props & Pick; + +export const mountExpiredBanner = ({ type, uploadUrl, ...startServices }: MountProps) => + toMountPoint(, startServices); diff --git a/x-pack/plugins/licensing/public/plugin.test.ts b/x-pack/plugins/licensing/public/plugin.test.ts index ba7e2cd6936e..439be2410e9d 100644 --- a/x-pack/plugins/licensing/public/plugin.test.ts +++ b/x-pack/plugins/licensing/public/plugin.test.ts @@ -406,10 +406,15 @@ describe('licensing plugin', () => { expect(coreStart.overlays.banners.add).toHaveBeenCalledTimes(1); await refresh(); expect(coreStart.overlays.banners.add).toHaveBeenCalledTimes(1); - expect(mountExpiredBannerMock).toHaveBeenCalledWith({ - type: 'gold', - uploadUrl: '/app/management/stack/license_management/upload_license', - }); + expect(mountExpiredBannerMock).toHaveBeenCalledWith( + expect.objectContaining({ + type: 'gold', + uploadUrl: '/app/management/stack/license_management/upload_license', + analytics: expect.any(Object), + i18n: expect.any(Object), + theme: expect.any(Object), + }) + ); }); }); diff --git a/x-pack/plugins/licensing/public/plugin.ts b/x-pack/plugins/licensing/public/plugin.ts index 3953a29a0821..2a56bedf67b0 100644 --- a/x-pack/plugins/licensing/public/plugin.ts +++ b/x-pack/plugins/licensing/public/plugin.ts @@ -46,7 +46,7 @@ export class LicensingPlugin implements Plugin