Move getUiApi call to security start and pass core instead of getStartServices

Author: yakhinvadim

x-pack/plugins/security/public/plugin.tsx

@@ -29,7 +29,6 @@ import { SecurityNavControlService } from './nav_control';
 import { SecurityCheckupService } from './security_checkup';
 import { SessionExpired, SessionTimeout, UnauthorizedResponseHttpInterceptor } from './session';
 import { getUiApi } from './ui_api';
-import type { UiApi } from './ui_api';
 
 export interface PluginSetupDependencies {
   licensing: LicensingPluginSetup;
@@ -62,7 +61,6 @@ export class SecurityPlugin
   private readonly securityCheckupService = new SecurityCheckupService();
   private authc!: AuthenticationServiceSetup;
   private readonly config: ConfigType;
-  private uiApi!: UiApi;
 
   constructor(private readonly initializerContext: PluginInitializerContext) {
     this.config = this.initializerContext.config.get<ConfigType>();
@@ -100,10 +98,6 @@ export class SecurityPlugin
       logoutUrl,
     });
 
-    this.uiApi = getUiApi({
-      getStartServices: core.getStartServices,
-    });
-
     accountManagementApp.create({
       authc: this.authc,
       application: core.application,
@@ -154,7 +148,7 @@ export class SecurityPlugin
     }
 
     return {
-      uiApi: this.uiApi,
+      uiApi: getUiApi({ core }),
       navControlService: this.navControlService.start({ core }),
       authc: this.authc as AuthenticationServiceStart,
     };

x-pack/plugins/security/public/ui_api/components.tsx

@@ -8,24 +8,23 @@
 import type { FC, PropsWithChildren, PropsWithRef } from 'react';
 import React from 'react';
 
-import type { StartServicesAccessor } from 'src/core/public';
+import type { CoreStart } from 'src/core/public';
 
 import { getChangePasswordComponent } from '../account_management/change_password/change_password_async';
 import { getPersonalInfoComponent } from '../account_management/personal_info/personal_info_async';
-import type { PluginStartDependencies } from '../plugin';
 import { LazyWrapper } from './lazy_wrapper';
 
 export interface GetComponentsOptions {
-  getStartServices: StartServicesAccessor<PluginStartDependencies>;
+  core: CoreStart;
 }
 
-export const getComponents = ({ getStartServices }: GetComponentsOptions) => {
+export const getComponents = ({ core }: GetComponentsOptions) => {
   /**
    * Returns a function that creates a lazy-loading version of a component.
    */
   function wrapLazy<T>(fn: () => Promise<FC<T>>) {
     return (props: JSX.IntrinsicAttributes & PropsWithRef<PropsWithChildren<T>>) => (
-      <LazyWrapper fn={fn} getStartServices={getStartServices} props={props} />
+      <LazyWrapper fn={fn} core={core} props={props} />
     );
   }
 

x-pack/plugins/security/public/ui_api/index.ts

@@ -7,16 +7,15 @@
 
 import type { ReactElement } from 'react';
 
-import type { StartServicesAccessor } from 'src/core/public';
+import type { CoreStart } from 'src/core/public';
 
 import type { ChangePasswordProps } from '../account_management/change_password';
 import type { PersonalInfoProps } from '../account_management/personal_info';
 import { UserAPIClient } from '../management';
-import type { PluginStartDependencies } from '../plugin';
 import { getComponents } from './components';
 
 interface GetUiApiOptions {
-  getStartServices: StartServicesAccessor<PluginStartDependencies>;
+  core: CoreStart;
 }
 
 type LazyComponentFn<T> = (props: T) => ReactElement;
@@ -29,8 +28,8 @@ export interface UiApi {
   UserAPIClient: typeof UserAPIClient;
 }
 
-export const getUiApi = ({ getStartServices }: GetUiApiOptions): UiApi => {
-  const components = getComponents({ getStartServices });
+export const getUiApi = ({ core }: GetUiApiOptions): UiApi => {
+  const components = getComponents({ core });
 
   return {
     components,

x-pack/plugins/security/public/ui_api/lazy_wrapper.tsx

@@ -7,26 +7,23 @@
 
 import type { FC, PropsWithChildren, PropsWithRef, ReactElement } from 'react';
 import React, { lazy, useMemo } from 'react';
-import useAsync from 'react-use/lib/useAsync';
 
-import type { StartServicesAccessor } from 'src/core/public';
+import type { CoreStart } from 'src/core/public';
 
-import type { PluginStartDependencies } from '../plugin';
 import { SuspenseErrorBoundary } from '../suspense_error_boundary';
 
 interface InternalProps<T> {
   fn: () => Promise<FC<T>>;
-  getStartServices: StartServicesAccessor<PluginStartDependencies>;
+  core: CoreStart;
   props: JSX.IntrinsicAttributes & PropsWithRef<PropsWithChildren<T>>;
 }
 
 export const LazyWrapper: <T>(props: InternalProps<T>) => ReactElement | null = ({
   fn,
-  getStartServices,
+  core,
   props,
 }) => {
-  const { value: startServices = [{ notifications: undefined }] } = useAsync(getStartServices);
-  const [{ notifications }] = startServices;
+  const { notifications } = core;
 
   const LazyComponent = useMemo(() => lazy(() => fn().then((x) => ({ default: x }))), [fn]);