Merge pull request #14 from eokoneyo/assign-roles-to-space

Further improvements to spaces role assignment tab

Author: tsullivan

Diff for: x-pack/packages/security/plugin_types_public/src/privileges/privileges_api_client.ts

@@ -15,7 +15,7 @@ export interface PrivilegesAPIClientGetAllArgs {
    */
   respectLicenseLevel: boolean;
 }
-// TODO: Eyo include the proper return types for contract
+
 export abstract class PrivilegesAPIClientPublicContract {
   abstract getAll(args: PrivilegesAPIClientGetAllArgs): Promise<RawKibanaPrivileges>;
 }

Diff for: x-pack/packages/security/plugin_types_public/src/roles/roles_api_client.ts

@@ -16,4 +16,5 @@ export interface RolesAPIClient {
   getRole: (roleName: string) => Promise<Role>;
   deleteRole: (roleName: string) => Promise<void>;
   saveRole: (payload: RolePutPayload) => Promise<void>;
+  bulkUpdateRoles: (payload: { rolesUpdate: Role[] }) => Promise<void>;
 }

Diff for: x-pack/packages/security/plugin_types_public/tsconfig.json

@@ -14,6 +14,6 @@
     "@kbn/core-user-profile-common",
     "@kbn/security-plugin-types-common",
     "@kbn/core-security-common",
-    "@kbn/security-authorization-core"
+    "@kbn/security-authorization-core",
   ]
 }

Diff for: x-pack/packages/security/ui_components/src/kibana_privilege_table/feature_table.test.tsx

@@ -15,10 +15,10 @@ import {
   kibanaFeatures,
 } from '@kbn/security-role-management-model/src/__fixtures__';
 import { findTestSubject, mountWithIntl } from '@kbn/test-jest-helpers';
+import type { Role } from '@kbn/security-plugin-types-common';
 
 import { getDisplayedFeaturePrivileges } from './__fixtures__';
 import { FeatureTable } from './feature_table';
-import type { Role } from '@kbn/security-plugin-types-common';
 import { PrivilegeFormCalculator } from '../privilege_form_calculator';
 
 const createRole = (kibana: Role['kibana'] = []): Role => {

Diff for: x-pack/packages/security/ui_components/src/kibana_privilege_table/feature_table_expanded_row.test.tsx

@@ -12,10 +12,10 @@ import {
   createKibanaPrivileges,
   kibanaFeatures,
 } from '@kbn/security-role-management-model/src/__fixtures__';
+import type { Role } from '@kbn/security-plugin-types-common';
 import { findTestSubject, mountWithIntl } from '@kbn/test-jest-helpers';
 
 import { FeatureTableExpandedRow } from './feature_table_expanded_row';
-import type { Role } from '@kbn/security-plugin-types-common';
 import { PrivilegeFormCalculator } from '../privilege_form_calculator';
 
 const createRole = (kibana: Role['kibana'] = []): Role => {

Diff for: x-pack/packages/security/ui_components/src/kibana_privilege_table/sub_feature_form.tsx

@@ -21,7 +21,6 @@ import type {
   SubFeaturePrivilege,
   SubFeaturePrivilegeGroup,
 } from '@kbn/security-role-management-model';
-
 import { NO_PRIVILEGE_VALUE } from '../constants';
 import type { PrivilegeFormCalculator } from '../privilege_form_calculator';
 

Diff for: x-pack/packages/security/ui_components/src/privilege_form_calculator/privilege_form_calculator.test.ts

@@ -9,9 +9,9 @@ import {
   createKibanaPrivileges,
   kibanaFeatures,
 } from '@kbn/security-role-management-model/src/__fixtures__';
+import type { Role } from '@kbn/security-plugin-types-common';
 
 import { PrivilegeFormCalculator } from './privilege_form_calculator';
-import type { Role } from '@kbn/security-plugin-types-common';
 
 const createRole = (kibana: Role['kibana'] = []): Role => {
   return {

Diff for: x-pack/plugins/security/public/authentication/index.mock.ts

@@ -31,6 +31,7 @@ export const authorizationMock = {
       getRole: jest.fn(),
       deleteRole: jest.fn(),
       saveRole: jest.fn(),
+      bulkUpdateRoles: jest.fn(),
     },
     privileges: {
       getAll: jest.fn(),
@@ -43,6 +44,7 @@ export const authorizationMock = {
       getRole: jest.fn(),
       deleteRole: jest.fn(),
       saveRole: jest.fn(),
+      bulkUpdateRoles: jest.fn(),
     },
     privileges: {
       getAll: jest.fn(),

Diff for: x-pack/plugins/security/public/authorization/authorization_service.ts

@@ -29,6 +29,7 @@ export class AuthorizationService {
         getRole: rolesAPIClient.getRole,
         deleteRole: rolesAPIClient.deleteRole,
         saveRole: rolesAPIClient.saveRole,
+        bulkUpdateRoles: rolesAPIClient.bulkUpdateRoles,
       },
       privileges: {
         getAll: privilegesAPIClient.getAll.bind(privilegesAPIClient),

Diff for: x-pack/plugins/security/public/management/roles/roles_api_client.mock.ts

@@ -11,5 +11,6 @@ export const rolesAPIClientMock = {
     getRole: jest.fn(),
     deleteRole: jest.fn(),
     saveRole: jest.fn(),
+    bulkUpdateRoles: jest.fn(),
   }),
 };

Diff for: x-pack/plugins/security/public/management/roles/roles_api_client.ts

@@ -32,6 +32,17 @@ export class RolesAPIClient {
     });
   };
 
+  public bulkUpdateRoles = async ({ rolesUpdate }: { rolesUpdate: Role[] }) => {
+    await this.http.post('/api/security/roles', {
+      body: JSON.stringify({
+        roles: rolesUpdate.reduce((transformed, value) => {
+          transformed[value.name] = this.transformRoleForSave(copyRole(value));
+          return transformed;
+        }, {} as Record<string, ReturnType<typeof this.transformRoleForSave>>),
+      }),
+    });
+  };
+
   private transformRoleForSave = (role: Role) => {
     // Remove any placeholder index privileges
     const isPlaceholderPrivilege = (

Diff for: x-pack/plugins/security/public/plugin.test.tsx

@@ -137,6 +137,7 @@ describe('Security Plugin', () => {
               "getAll": [Function],
             },
             "roles": Object {
+              "bulkUpdateRoles": [Function],
               "deleteRole": [Function],
               "getRole": [Function],
               "getRoles": [Function],

Diff for: x-pack/plugins/spaces/public/management/privilege_api_client.mock.ts

@@ -0,0 +1,18 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import type { PrivilegesAPIClientPublicContract } from '@kbn/security-plugin-types-public';
+
+export const createPrivilegeAPIClientMock = (): PrivilegesAPIClientPublicContract => {
+  return {
+    getAll: jest.fn(),
+  };
+};
+
+export const getPrivilegeAPIClientMock = jest
+  .fn()
+  .mockResolvedValue(createPrivilegeAPIClientMock());

Diff for: x-pack/plugins/spaces/public/management/roles_api_client.mock.ts

@@ -13,6 +13,7 @@ export const createRolesAPIClientMock = (): RolesAPIClient => {
     getRole: jest.fn(),
     saveRole: jest.fn(),
     deleteRole: jest.fn(),
+    bulkUpdateRoles: jest.fn(),
   };
 };
 

Diff for: x-pack/plugins/spaces/public/management/spaces_management_app.test.tsx

@@ -175,7 +175,7 @@ describe('spacesManagementApp', () => {
           css="You have tried to stringify object returned from \`css\` function. It isn't supposed to be used directly (e.g. as value of the \`className\` prop), but rather handed to emotion so it can handle it (e.g. as value of \`css\` prop)."
           data-test-subj="kbnRedirectAppLink"
         >
-          Spaces View Page: {"capabilities":{"catalogue":{},"management":{},"navLinks":{}},"serverBasePath":"","http":{"basePath":{"basePath":"","serverBasePath":"","assetsHrefBase":""},"anonymousPaths":{},"externalUrl":{},"staticAssets":{}},"overlays":{"banners":{}},"notifications":{"toasts":{}},"spacesManager":{"onActiveSpaceChange$":{}},"spaceId":"some-space","history":{"action":"PUSH","length":1,"location":{"pathname":"/edit/some-space","search":"","hash":""}},"allowFeatureVisibility":true,"allowSolutionVisibility":true}
+          Spaces View Page: {"capabilities":{"catalogue":{},"management":{},"navLinks":{}},"serverBasePath":"","http":{"basePath":{"basePath":"","serverBasePath":"","assetsHrefBase":""},"anonymousPaths":{},"externalUrl":{},"staticAssets":{}},"overlays":{"banners":{}},"notifications":{"toasts":{}},"theme":{"theme$":{}},"i18n":{},"spacesManager":{"onActiveSpaceChange$":{}},"spaceId":"some-space","history":{"action":"PUSH","length":1,"location":{"pathname":"/edit/some-space","search":"","hash":""}},"allowFeatureVisibility":true,"allowSolutionVisibility":true}
         </div>
       </div>
     `);

Diff for: x-pack/plugins/spaces/public/management/spaces_management_app.tsx

@@ -44,6 +44,7 @@ export const spacesManagementApp = Object.freeze({
     config,
     eventTracker,
     getRolesAPIClient,
+    getPrivilegesAPIClient,
   }: CreateParams) {
     const title = i18n.translate('xpack.spaces.displayName', {
       defaultMessage: 'Spaces',
@@ -71,7 +72,7 @@ export const spacesManagementApp = Object.freeze({
           text: title,
           href: `/`,
         };
-        const { notifications, application, chrome, http, overlays } = coreStart;
+        const { notifications, application, chrome, http, overlays, theme } = coreStart;
 
         chrome.docTitle.change(title);
 
@@ -147,6 +148,8 @@ export const spacesManagementApp = Object.freeze({
               http={http}
               overlays={overlays}
               notifications={notifications}
+              theme={theme}
+              i18n={coreStart.i18n}
               spacesManager={spacesManager}
               spaceId={spaceId}
               onLoadSpace={onLoadSpace}
@@ -155,6 +158,7 @@ export const spacesManagementApp = Object.freeze({
               getRolesAPIClient={getRolesAPIClient}
               allowFeatureVisibility={config.allowFeatureVisibility}
               allowSolutionVisibility={config.allowSolutionVisibility}
+              getPrivilegesAPIClient={getPrivilegesAPIClient}
             />
           );
         };

Diff for: x-pack/plugins/spaces/public/management/view_space/hooks/use_tabs.ts

@@ -13,7 +13,7 @@ import type { KibanaFeature } from '@kbn/features-plugin/public';
 import type { Space } from '../../../../common';
 import { getTabs, type GetTabsProps, type ViewSpaceTab } from '../view_space_tabs';
 
-type UseTabsProps = Pick<GetTabsProps, 'roles' | 'capabilities'> & {
+type UseTabsProps = Pick<GetTabsProps, 'capabilities' | 'rolesCount'> & {
   space: Space | null;
   features: KibanaFeature[] | null;
   currentSelectedTabId: string;

Diff for: x-pack/plugins/spaces/public/management/view_space/hooks/view_space_context_provider.tsx

@@ -0,0 +1,40 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import React from 'react';
+import type { ComponentProps, PropsWithChildren } from 'react';
+
+import { ViewSpaceProvider, type ViewSpaceProviderProps } from './provider';
+import { ViewSpace } from './view_space';
+
+type ViewSpacePageProps = ComponentProps<typeof ViewSpace> & ViewSpaceProviderProps;
+
+export function ViewSpacePage({
+  spaceId,
+  getFeatures,
+  history,
+  onLoadSpace,
+  selectedTabId,
+  allowFeatureVisibility,
+  allowSolutionVisibility,
+  children,
+  ...viewSpaceServicesProps
+}: PropsWithChildren<ViewSpacePageProps>) {
+  return (
+    <ViewSpaceProvider {...viewSpaceServicesProps}>
+      <ViewSpace
+        spaceId={spaceId}
+        getFeatures={getFeatures}
+        history={history}
+        onLoadSpace={onLoadSpace}
+        selectedTabId={selectedTabId}
+        allowFeatureVisibility={allowFeatureVisibility}
+        allowSolutionVisibility={allowSolutionVisibility}
+      />
+    </ViewSpaceProvider>
+  );
+}

Diff for: x-pack/plugins/spaces/public/management/view_space/index.tsx

@@ -5,4 +5,9 @@
  * 2.0.
  */
 
-export { ViewSpacePage } from './view_space';
+export { ViewSpaceProvider, useViewSpaceServices, useViewSpaceStore } from './view_space_provider';
+export type {
+  ViewSpaceProviderProps,
+  ViewSpaceServices,
+  ViewSpaceStore,
+} from './view_space_provider';

Diff for: x-pack/plugins/spaces/public/management/view_space/index.ts renamed to x-pack/plugins/spaces/public/management/view_space/provider/index.ts

@@ -0,0 +1,53 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { type Reducer } from 'react';
+
+import type { Role } from '@kbn/security-plugin-types-common';
+
+export type IDispatchAction =
+  | {
+      /** @description  updates a single role record */
+      type: 'update_roles' | 'remove_roles';
+      payload: Role[];
+    }
+  | {
+      type: 'string';
+      payload: any;
+    };
+
+export interface IViewSpaceStoreState {
+  /** roles assigned to current space */
+  roles: Map<Role['name'], Role>;
+}
+
+export const createSpaceRolesReducer: Reducer<IViewSpaceStoreState, IDispatchAction> = (
+  state,
+  action
+) => {
+  const _state = structuredClone(state);
+
+  switch (action.type) {
+    case 'update_roles': {
+      action.payload.forEach((role) => {
+        _state.roles.set(role.name, role);
+      });
+
+      return _state;
+    }
+    case 'remove_roles': {
+      action.payload.forEach((role) => {
+        _state.roles.delete(role.name);
+      });
+
+      return _state;
+    }
+    default: {
+      return _state;
+    }
+  }
+};

Diff for: x-pack/plugins/spaces/public/management/view_space/provider/reducers/index.ts

@@ -0,0 +1,110 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { renderHook } from '@testing-library/react-hooks';
+import type { PropsWithChildren } from 'react';
+import React from 'react';
+
+import {
+  httpServiceMock,
+  i18nServiceMock,
+  notificationServiceMock,
+  overlayServiceMock,
+  themeServiceMock,
+} from '@kbn/core/public/mocks';
+import type { ApplicationStart } from '@kbn/core-application-browser';
+import { __IntlProvider as IntlProvider } from '@kbn/i18n-react';
+
+import { useViewSpaceServices, useViewSpaceStore, ViewSpaceProvider } from './view_space_provider';
+import { spacesManagerMock } from '../../../spaces_manager/spaces_manager.mock';
+import { getPrivilegeAPIClientMock } from '../../privilege_api_client.mock';
+import { getRolesAPIClientMock } from '../../roles_api_client.mock';
+
+const http = httpServiceMock.createStartContract();
+const notifications = notificationServiceMock.createStartContract();
+const overlays = overlayServiceMock.createStartContract();
+const theme = themeServiceMock.createStartContract();
+const i18n = i18nServiceMock.createStartContract();
+
+const spacesManager = spacesManagerMock.create();
+
+const SUTProvider = ({
+  children,
+  capabilities = {
+    navLinks: {},
+    management: {},
+    catalogue: {},
+    spaces: { manage: true },
+  },
+}: PropsWithChildren<Partial<Pick<ApplicationStart, 'capabilities'>>>) => {
+  return (
+    <IntlProvider locale="en">
+      <ViewSpaceProvider
+        {...{
+          i18n,
+          http,
+          theme,
+          overlays,
+          notifications,
+          spacesManager,
+          serverBasePath: '',
+          getUrlForApp: (_) => _,
+          getRolesAPIClient: getRolesAPIClientMock,
+          getPrivilegesAPIClient: getPrivilegeAPIClientMock,
+          navigateToUrl: jest.fn(),
+          capabilities,
+        }}
+      >
+        {children}
+      </ViewSpaceProvider>
+    </IntlProvider>
+  );
+};
+
+describe('ViewSpaceProvider', () => {
+  describe('useViewSpaceServices', () => {
+    it('returns an object of predefined properties', () => {
+      const { result } = renderHook(useViewSpaceServices, { wrapper: SUTProvider });
+
+      expect(result.current).toEqual(
+        expect.objectContaining({
+          invokeClient: expect.any(Function),
+        })
+      );
+    });
+
+    it('throws when the hook is used within a tree that does not have the provider', () => {
+      const { result } = renderHook(useViewSpaceServices);
+      expect(result.error).toBeDefined();
+      expect(result.error?.message).toEqual(
+        expect.stringMatching('ViewSpaceService Context is missing.')
+      );
+    });
+  });
+
+  describe('useViewSpaceStore', () => {
+    it('returns an object of predefined properties', () => {
+      const { result } = renderHook(useViewSpaceStore, { wrapper: SUTProvider });
+
+      expect(result.current).toEqual(
+        expect.objectContaining({
+          state: expect.objectContaining({ roles: expect.any(Map) }),
+          dispatch: expect.any(Function),
+        })
+      );
+    });
+
+    it('throws when the hook is used within a tree that does not have the provider', () => {
+      const { result } = renderHook(useViewSpaceStore);
+
+      expect(result.error).toBeDefined();
+      expect(result.error?.message).toEqual(
+        expect.stringMatching('ViewSpaceStore Context is missing.')
+      );
+    });
+  });
+});

Diff for: x-pack/plugins/spaces/public/management/view_space/provider/view_space_provider.test.tsx

@@ -0,0 +1,154 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { once } from 'lodash';
+import React, {
+  createContext,
+  type Dispatch,
+  type PropsWithChildren,
+  useCallback,
+  useContext,
+  useEffect,
+  useReducer,
+  useRef,
+} from 'react';
+
+import type { ApplicationStart } from '@kbn/core-application-browser';
+import type { CoreStart } from '@kbn/core-lifecycle-browser';
+import type {
+  PrivilegesAPIClientPublicContract,
+  RolesAPIClient,
+} from '@kbn/security-plugin-types-public';
+
+import {
+  createSpaceRolesReducer,
+  type IDispatchAction,
+  type IViewSpaceStoreState,
+} from './reducers';
+import type { SpacesManager } from '../../../spaces_manager';
+
+// FIXME: rename to EditSpaceServices
+export interface ViewSpaceProviderProps
+  extends Pick<CoreStart, 'theme' | 'i18n' | 'overlays' | 'http' | 'notifications'> {
+  capabilities: ApplicationStart['capabilities'];
+  getUrlForApp: ApplicationStart['getUrlForApp'];
+  navigateToUrl: ApplicationStart['navigateToUrl'];
+  serverBasePath: string;
+  spacesManager: SpacesManager;
+  getRolesAPIClient: () => Promise<RolesAPIClient>;
+  getPrivilegesAPIClient: () => Promise<PrivilegesAPIClientPublicContract>;
+}
+
+export interface ViewSpaceServices
+  extends Omit<ViewSpaceProviderProps, 'getRolesAPIClient' | 'getPrivilegesAPIClient'> {
+  invokeClient<R extends unknown>(arg: (clients: ViewSpaceClients) => Promise<R>): Promise<R>;
+}
+
+interface ViewSpaceClients {
+  spacesManager: ViewSpaceProviderProps['spacesManager'];
+  rolesClient: RolesAPIClient;
+  privilegesClient: PrivilegesAPIClientPublicContract;
+}
+
+export interface ViewSpaceStore {
+  state: IViewSpaceStoreState;
+  dispatch: Dispatch<IDispatchAction>;
+}
+
+const createSpaceRolesContext = once(() => createContext<ViewSpaceStore | null>(null));
+
+const createViewSpaceServicesContext = once(() => createContext<ViewSpaceServices | null>(null));
+
+// FIXME: rename to EditSpaceProvider
+export const ViewSpaceProvider = ({
+  children,
+  getRolesAPIClient,
+  getPrivilegesAPIClient,
+  ...services
+}: PropsWithChildren<ViewSpaceProviderProps>) => {
+  const ViewSpaceStoreContext = createSpaceRolesContext();
+  const ViewSpaceServicesContext = createViewSpaceServicesContext();
+
+  const clients = useRef(Promise.all([getRolesAPIClient(), getPrivilegesAPIClient()]));
+  const rolesAPIClientRef = useRef<RolesAPIClient>();
+  const privilegesClientRef = useRef<PrivilegesAPIClientPublicContract>();
+
+  const initialStoreState = useRef<IViewSpaceStoreState>({
+    roles: new Map(),
+  });
+
+  const resolveAPIClients = useCallback(async () => {
+    try {
+      [rolesAPIClientRef.current, privilegesClientRef.current] = await clients.current;
+    } catch {
+      // handle errors
+    }
+  }, []);
+
+  useEffect(() => {
+    resolveAPIClients();
+  }, [resolveAPIClients]);
+
+  const createInitialState = useCallback((state: IViewSpaceStoreState) => {
+    return state;
+  }, []);
+
+  const [state, dispatch] = useReducer(
+    createSpaceRolesReducer,
+    initialStoreState.current,
+    createInitialState
+  );
+
+  const invokeClient: ViewSpaceServices['invokeClient'] = useCallback(
+    async (...args) => {
+      await resolveAPIClients();
+
+      return args[0]({
+        spacesManager: services.spacesManager,
+        rolesClient: rolesAPIClientRef.current!,
+        privilegesClient: privilegesClientRef.current!,
+      });
+    },
+    [resolveAPIClients, services.spacesManager]
+  );
+
+  return (
+    <ViewSpaceServicesContext.Provider value={{ ...services, invokeClient }}>
+      <ViewSpaceStoreContext.Provider value={{ state, dispatch }}>
+        {children}
+      </ViewSpaceStoreContext.Provider>
+    </ViewSpaceServicesContext.Provider>
+  );
+};
+
+// FIXME: rename to useEditSpaceServices
+export const useViewSpaceServices = (): ViewSpaceServices => {
+  const context = useContext(createViewSpaceServicesContext());
+  if (!context) {
+    throw new Error(
+      'ViewSpaceService Context is missing. Ensure the component or React root is wrapped with ViewSpaceProvider'
+    );
+  }
+
+  return context;
+};
+
+export const useViewSpaceStore = () => {
+  const context = useContext(createSpaceRolesContext());
+  if (!context) {
+    throw new Error(
+      'ViewSpaceStore Context is missing. Ensure the component or React root is wrapped with ViewSpaceProvider'
+    );
+  }
+
+  return context;
+};
+
+export const useViewSpaceStoreDispatch = () => {
+  const { dispatch } = useViewSpaceStore();
+  return dispatch;
+};

Diff for: x-pack/plugins/spaces/public/management/view_space/provider/view_space_provider.tsx

@@ -0,0 +1,203 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+import { render, screen, waitFor } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import crypto from 'crypto';
+import React from 'react';
+
+import { __IntlProvider as IntlProvider } from '@kbn/i18n-react';
+import type { Role } from '@kbn/security-plugin-types-common';
+import {
+  createRawKibanaPrivileges,
+  kibanaFeatures,
+} from '@kbn/security-role-management-model/src/__fixtures__';
+
+import { PrivilegesRolesForm } from './space_assign_role_privilege_form';
+import type { Space } from '../../../../../common';
+import { createPrivilegeAPIClientMock } from '../../../privilege_api_client.mock';
+import { createRolesAPIClientMock } from '../../../roles_api_client.mock';
+
+const rolesAPIClient = createRolesAPIClientMock();
+const privilegeAPIClient = createPrivilegeAPIClientMock();
+
+const createRole = (roleName: string, kibana: Role['kibana'] = []): Role => {
+  return {
+    name: roleName,
+    elasticsearch: { cluster: [], run_as: [], indices: [] },
+    kibana,
+  };
+};
+
+const space: Space = {
+  id: crypto.randomUUID(),
+  name: 'Odyssey',
+  description: 'Journey vs. Destination',
+  disabledFeatures: [],
+};
+
+const spacesClientsInvocatorMock = jest.fn((fn) =>
+  fn({
+    rolesClient: rolesAPIClient,
+    privilegesClient: privilegeAPIClient,
+  })
+);
+const dispatchMock = jest.fn();
+const onSaveCompleted = jest.fn();
+const closeFlyout = jest.fn();
+
+const renderPrivilegeRolesForm = ({
+  preSelectedRoles,
+}: {
+  preSelectedRoles?: Role[];
+} = {}) => {
+  return render(
+    <IntlProvider locale="en">
+      <PrivilegesRolesForm
+        {...{
+          space,
+          features: kibanaFeatures,
+          closeFlyout,
+          defaultSelected: preSelectedRoles,
+          onSaveCompleted,
+          storeDispatch: dispatchMock,
+          spacesClientsInvocator: spacesClientsInvocatorMock,
+        }}
+      />
+    </IntlProvider>
+  );
+};
+
+describe('PrivilegesRolesForm', () => {
+  let getRolesSpy: jest.SpiedFunction<ReturnType<typeof createRolesAPIClientMock>['getRoles']>;
+  let getAllKibanaPrivilegeSpy: jest.SpiedFunction<
+    ReturnType<typeof createPrivilegeAPIClientMock>['getAll']
+  >;
+
+  beforeAll(() => {
+    getRolesSpy = jest.spyOn(rolesAPIClient, 'getRoles');
+    getAllKibanaPrivilegeSpy = jest.spyOn(privilegeAPIClient, 'getAll');
+  });
+
+  afterEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('renders the privilege permission selector disabled when no role is selected', async () => {
+    getRolesSpy.mockResolvedValue([]);
+    getAllKibanaPrivilegeSpy.mockResolvedValue(createRawKibanaPrivileges(kibanaFeatures));
+
+    renderPrivilegeRolesForm();
+
+    await waitFor(() => null);
+
+    ['all', 'read', 'custom'].forEach((privilege) => {
+      expect(screen.getByTestId(`${privilege}-privilege-button`)).toBeDisabled();
+    });
+  });
+
+  it('preselects the privilege of the selected role when one is provided', async () => {
+    getRolesSpy.mockResolvedValue([]);
+    getAllKibanaPrivilegeSpy.mockResolvedValue(createRawKibanaPrivileges(kibanaFeatures));
+
+    const privilege = 'all';
+
+    renderPrivilegeRolesForm({
+      preSelectedRoles: [
+        createRole('test_role_1', [{ base: [privilege], feature: {}, spaces: [space.id] }]),
+      ],
+    });
+
+    await waitFor(() => null);
+
+    expect(screen.getByTestId(`${privilege}-privilege-button`)).toHaveAttribute(
+      'aria-pressed',
+      String(true)
+    );
+  });
+
+  it('displays a warning message when roles with different privilege levels are selected', async () => {
+    getRolesSpy.mockResolvedValue([]);
+    getAllKibanaPrivilegeSpy.mockResolvedValue(createRawKibanaPrivileges(kibanaFeatures));
+
+    const roles: Role[] = [
+      createRole('test_role_1', [{ base: ['all'], feature: {}, spaces: [space.id] }]),
+      createRole('test_role_2', [{ base: ['read'], feature: {}, spaces: [space.id] }]),
+    ];
+
+    renderPrivilegeRolesForm({
+      preSelectedRoles: roles,
+    });
+
+    await waitFor(() => null);
+
+    expect(screen.getByTestId('privilege-conflict-callout')).toBeInTheDocument();
+  });
+
+  describe('applying custom privileges', () => {
+    it('displays the privilege customization form, when custom privilege button is selected', async () => {
+      getRolesSpy.mockResolvedValue([]);
+      getAllKibanaPrivilegeSpy.mockResolvedValue(createRawKibanaPrivileges(kibanaFeatures));
+
+      const roles: Role[] = [
+        createRole('test_role_1', [{ base: ['all'], feature: {}, spaces: [space.id] }]),
+      ];
+
+      renderPrivilegeRolesForm({
+        preSelectedRoles: roles,
+      });
+
+      await waitFor(() => null);
+
+      expect(screen.queryByTestId('rolePrivilegeCustomizationForm')).not.toBeInTheDocument();
+
+      userEvent.click(screen.getByTestId('custom-privilege-button'));
+
+      expect(screen.getByTestId('rolePrivilegeCustomizationForm')).toBeInTheDocument();
+    });
+
+    it('for a selection of roles pre-assigned to a space, the first encountered privilege with a custom privilege is used as the starting point', async () => {
+      getRolesSpy.mockResolvedValue([]);
+      getAllKibanaPrivilegeSpy.mockResolvedValue(createRawKibanaPrivileges(kibanaFeatures));
+
+      const featureIds: string[] = kibanaFeatures.map((kibanaFeature) => kibanaFeature.id);
+
+      const roles: Role[] = [
+        createRole('test_role_1', [{ base: ['all'], feature: {}, spaces: [space.id] }]),
+        createRole('test_role_2', [
+          { base: [], feature: { [featureIds[0]]: ['all'] }, spaces: [space.id] },
+        ]),
+        createRole('test_role_3', [{ base: ['read'], feature: {}, spaces: [space.id] }]),
+        createRole('test_role_4', [{ base: ['read'], feature: {}, spaces: [space.id] }]),
+        createRole('test_role_5', [
+          { base: [], feature: { [featureIds[0]]: ['read'] }, spaces: [space.id] },
+        ]),
+      ];
+
+      renderPrivilegeRolesForm({
+        preSelectedRoles: roles,
+      });
+
+      await waitFor(() => null);
+
+      expect(screen.queryByTestId('rolePrivilegeCustomizationForm')).not.toBeInTheDocument();
+
+      userEvent.click(screen.getByTestId('custom-privilege-button'));
+
+      expect(screen.getByTestId('rolePrivilegeCustomizationForm')).toBeInTheDocument();
+
+      expect(screen.queryByTestId(`${featureIds[0]}_read`)).not.toHaveAttribute(
+        'aria-pressed',
+        String(true)
+      );
+
+      expect(screen.getByTestId(`${featureIds[0]}_all`)).toHaveAttribute(
+        'aria-pressed',
+        String(true)
+      );
+    });
+  });
+});

Diff for: x-pack/plugins/spaces/public/management/view_space/roles/component/space_assign_role_privilege_form.test.tsx

@@ -20,18 +20,15 @@ import {
 import React, { lazy, Suspense, useEffect, useState } from 'react';
 import type { FC } from 'react';
 
-import type { Capabilities, ScopedHistory } from '@kbn/core/public';
+import type { ScopedHistory } from '@kbn/core/public';
 import type { FeaturesPluginStart, KibanaFeature } from '@kbn/features-plugin/public';
 import { FormattedMessage } from '@kbn/i18n-react';
 import { reactRouterNavigate } from '@kbn/kibana-react-plugin/public';
 import type { Role } from '@kbn/security-plugin-types-common';
 
 import { TAB_ID_CONTENT, TAB_ID_GENERAL, TAB_ID_ROLES } from './constants';
 import { useTabs } from './hooks/use_tabs';
-import {
-  ViewSpaceContextProvider,
-  type ViewSpaceServices,
-} from './hooks/view_space_context_provider';
+import { useViewSpaceServices, useViewSpaceStore } from './provider';
 import { addSpaceIdToPath, ENTER_SPACE_PATH, type Space } from '../../../common';
 import { getSpaceAvatarComponent } from '../../space_avatar';
 import { SpaceSolutionBadge } from '../../space_solution_badge';
@@ -49,11 +46,10 @@ const getSelectedTabId = (canUserViewRoles: boolean, selectedTabId?: string) =>
     : TAB_ID_GENERAL;
 };
 
-interface PageProps extends ViewSpaceServices {
+interface PageProps {
   spaceId?: string;
   history: ScopedHistory;
   selectedTabId?: string;
-  capabilities: Capabilities;
   getFeatures: FeaturesPluginStart['getFeatures'];
   onLoadSpace: (space: Space) => void;
   allowFeatureVisibility: boolean;
@@ -68,32 +64,30 @@ const handleApiError = (error: Error) => {
 
 // FIXME: rename to EditSpacePage
 // FIXME: add eventTracker
-export const ViewSpacePage: FC<PageProps> = (props) => {
-  const {
-    spaceId,
-    getFeatures,
-    spacesManager,
-    history,
-    onLoadSpace,
-    selectedTabId: _selectedTabId,
-    capabilities,
-    getUrlForApp,
-    navigateToUrl,
-    ...viewSpaceServices
-  } = props;
-
+export const ViewSpace: FC<PageProps> = ({
+  spaceId,
+  getFeatures,
+  history,
+  onLoadSpace,
+  selectedTabId: _selectedTabId,
+  ...props
+}) => {
+  const { state, dispatch } = useViewSpaceStore();
+  const { invokeClient } = useViewSpaceServices();
+  const { spacesManager, capabilities, serverBasePath } = useViewSpaceServices();
   const [space, setSpace] = useState<Space | null>(null);
   const [userActiveSpace, setUserActiveSpace] = useState<Space | null>(null);
   const [features, setFeatures] = useState<KibanaFeature[] | null>(null);
-  const [roles, setRoles] = useState<Role[]>([]);
   const [isLoadingSpace, setIsLoadingSpace] = useState(true);
   const [isLoadingFeatures, setIsLoadingFeatures] = useState(true);
   const [isLoadingRoles, setIsLoadingRoles] = useState(true);
   const selectedTabId = getSelectedTabId(Boolean(capabilities?.roles?.view), _selectedTabId);
   const [tabs, selectedTabContent] = useTabs({
     space,
     features,
-    roles,
+    rolesCount: state.roles.size,
+    capabilities,
+    history,
     currentSelectedTabId: selectedTabId,
     ...props,
   });
@@ -123,33 +117,38 @@ export const ViewSpacePage: FC<PageProps> = (props) => {
     }
 
     const getRoles = async () => {
-      let result: Role[] = [];
-      try {
-        result = await spacesManager.getRolesForSpace(spaceId);
-      } catch (error) {
-        const message = error?.body?.message ?? error.toString();
-        const statusCode = error?.body?.statusCode ?? null;
-        if (statusCode === 403) {
-          // eslint-disable-next-line no-console
-          console.log('Insufficient permissions to get list of roles for the space');
-          // eslint-disable-next-line no-console
-          console.log(message);
-        } else {
-          // eslint-disable-next-line no-console
-          console.error('Encountered error while getting list of roles for space!');
-          // eslint-disable-next-line no-console
-          console.error(error);
-          throw error;
+      await invokeClient(async (clients) => {
+        let result: Role[] = [];
+        try {
+          result = await clients.spacesManager.getRolesForSpace(spaceId);
+
+          dispatch({ type: 'update_roles', payload: result });
+        } catch (error) {
+          const message = error?.body?.message ?? error.toString();
+          const statusCode = error?.body?.statusCode ?? null;
+          if (statusCode === 403) {
+            // eslint-disable-next-line no-console
+            console.log('Insufficient permissions to get list of roles for the space');
+            // eslint-disable-next-line no-console
+            console.log(message);
+          } else {
+            // eslint-disable-next-line no-console
+            console.error('Encountered error while getting list of roles for space!');
+            // eslint-disable-next-line no-console
+            console.error(error);
+            throw error;
+          }
         }
-      }
+      });
 
-      setRoles(result);
       setIsLoadingRoles(false);
     };
 
-    // maybe we do not make this call if user can't view roles? 🤔
-    getRoles().catch(handleApiError);
-  }, [spaceId, spacesManager]);
+    if (!state.roles.size) {
+      // maybe we do not make this call if user can't view roles? 🤔
+      getRoles().catch(handleApiError);
+    }
+  }, [dispatch, invokeClient, spaceId, state.roles]);
 
   useEffect(() => {
     const _getFeatures = async () => {
@@ -194,98 +193,90 @@ export const ViewSpacePage: FC<PageProps> = (props) => {
 
   return (
     <div data-test-subj="spaces-view-page">
-      <ViewSpaceContextProvider
-        capabilities={capabilities}
-        spacesManager={spacesManager}
-        navigateToUrl={navigateToUrl}
-        getUrlForApp={getUrlForApp}
-        {...viewSpaceServices}
-      >
-        <EuiText>
-          <EuiFlexGroup data-test-subj="spaceDetailsHeader" alignItems="flexStart">
-            <EuiFlexItem grow={false}>
-              <HeaderAvatar />
-            </EuiFlexItem>
-            <EuiFlexItem grow={true}>
-              <EuiTitle size="l">
-                <h1 data-test-subj="spaceTitle">
-                  {space.name}
-                  {shouldShowSolutionBadge ? (
-                    <>
-                      {' '}
-                      <SpaceSolutionBadge
-                        solution={solution}
-                        data-test-subj={`space-solution-badge-${solution}`}
+      <EuiText>
+        <EuiFlexGroup data-test-subj="spaceDetailsHeader" alignItems="flexStart">
+          <EuiFlexItem grow={false}>
+            <HeaderAvatar />
+          </EuiFlexItem>
+          <EuiFlexItem grow={true}>
+            <EuiTitle size="l">
+              <h1 data-test-subj="spaceTitle">
+                {space.name}
+                {shouldShowSolutionBadge ? (
+                  <>
+                    {' '}
+                    <SpaceSolutionBadge
+                      solution={solution}
+                      data-test-subj={`space-solution-badge-${solution}`}
+                    />
+                  </>
+                ) : null}
+                {userActiveSpace?.id === id ? (
+                  <>
+                    {' '}
+                    <EuiBadge color="primary">
+                      <FormattedMessage
+                        id="xpack.spaces.management.spaceDetails.space.badge.isCurrent"
+                        description="Text for a badge shown in the Space details page when the particular Space currently active."
+                        defaultMessage="Current"
                       />
-                    </>
-                  ) : null}
-                  {userActiveSpace?.id === id ? (
-                    <>
-                      {' '}
-                      <EuiBadge color="primary">
-                        <FormattedMessage
-                          id="xpack.spaces.management.spaceDetails.space.badge.isCurrent"
-                          description="Text for a badge shown in the Space details page when the particular Space currently active."
-                          defaultMessage="Current"
-                        />
-                      </EuiBadge>
-                    </>
-                  ) : null}
-                </h1>
-              </EuiTitle>
+                    </EuiBadge>
+                  </>
+                ) : null}
+              </h1>
+            </EuiTitle>
 
-              <EuiText size="s">
-                <p>
-                  {space.description ?? (
-                    <FormattedMessage
-                      id="xpack.spaces.management.spaceDetails.space.description"
-                      defaultMessage="Organize your saved objects and show related features for creating new content."
-                    />
-                  )}
-                </p>
-              </EuiText>
-            </EuiFlexItem>
-            {userActiveSpace?.id !== id ? (
-              <EuiFlexItem grow={false}>
-                <EuiButton
-                  iconType="merge"
-                  href={addSpaceIdToPath(
-                    props.serverBasePath,
-                    id,
-                    `${ENTER_SPACE_PATH}?next=/app/management/kibana/spaces/edit/${id}`
-                  )}
-                  data-test-subj="spaceSwitcherButton"
-                >
+            <EuiText size="s">
+              <p>
+                {space.description ?? (
                   <FormattedMessage
-                    id="xpack.spaces.management.spaceDetails.space.switchToSpaceButton.label"
-                    defaultMessage="Switch to this space"
+                    id="xpack.spaces.management.spaceDetails.space.description"
+                    defaultMessage="Organize your saved objects and show related features for creating new content."
                   />
-                </EuiButton>
-              </EuiFlexItem>
-            ) : null}
-          </EuiFlexGroup>
+                )}
+              </p>
+            </EuiText>
+          </EuiFlexItem>
+          {userActiveSpace?.id !== id ? (
+            <EuiFlexItem grow={false}>
+              <EuiButton
+                iconType="merge"
+                href={addSpaceIdToPath(
+                  serverBasePath,
+                  id,
+                  `${ENTER_SPACE_PATH}?next=/app/management/kibana/spaces/edit/${id}`
+                )}
+                data-test-subj="spaceSwitcherButton"
+              >
+                <FormattedMessage
+                  id="xpack.spaces.management.spaceDetails.space.switchToSpaceButton.label"
+                  defaultMessage="Switch to this space"
+                />
+              </EuiButton>
+            </EuiFlexItem>
+          ) : null}
+        </EuiFlexGroup>
 
-          <EuiSpacer />
+        <EuiSpacer />
 
-          <EuiFlexGroup direction="column">
-            <EuiFlexItem>
-              <EuiTabs>
-                {tabs.map((tab, index) => (
-                  <EuiTab
-                    key={index}
-                    isSelected={tab.id === selectedTabId}
-                    append={tab.append}
-                    {...reactRouterNavigate(history, `/edit/${encodeURIComponent(id)}/${tab.id}`)}
-                  >
-                    {tab.name}
-                  </EuiTab>
-                ))}
-              </EuiTabs>
-            </EuiFlexItem>
-            <EuiFlexItem>{selectedTabContent ?? null}</EuiFlexItem>
-          </EuiFlexGroup>
-        </EuiText>
-      </ViewSpaceContextProvider>
+        <EuiFlexGroup direction="column">
+          <EuiFlexItem>
+            <EuiTabs>
+              {tabs.map((tab, index) => (
+                <EuiTab
+                  key={index}
+                  isSelected={tab.id === selectedTabId}
+                  append={tab.append}
+                  {...reactRouterNavigate(history, `/edit/${encodeURIComponent(id)}/${tab.id}`)}
+                >
+                  {tab.name}
+                </EuiTab>
+              ))}
+            </EuiTabs>
+          </EuiFlexItem>
+          <EuiFlexItem>{selectedTabContent ?? null}</EuiFlexItem>
+        </EuiFlexGroup>
+      </EuiText>
     </div>
   );
 };

Diff for: x-pack/plugins/spaces/public/management/view_space/roles/component/space_assign_role_privilege_form.tsx

@@ -18,7 +18,7 @@ import { capitalize } from 'lodash';
 import type { FC } from 'react';
 import React, { useEffect, useState } from 'react';
 
-import { useViewSpaceServices } from './hooks/view_space_context_provider';
+import { useViewSpaceServices } from './provider';
 import { addSpaceIdToPath, ENTER_SPACE_PATH, type Space } from '../../../common';
 import type { SpaceContentTypeSummaryItem } from '../../types';
 

Diff for: x-pack/plugins/spaces/public/management/view_space/roles/component/space_assigned_roles_table.tsx

@@ -12,7 +12,7 @@ import React from 'react';
 import type { KibanaFeature } from '@kbn/features-plugin/common';
 import { FormattedMessage } from '@kbn/i18n-react';
 
-import { useViewSpaceServices } from './hooks/view_space_context_provider';
+import { useViewSpaceServices } from './provider';
 import type { Space } from '../../../common';
 import { FeatureTable } from '../edit_space/enabled_features/feature_table';
 import { SectionPanel } from '../edit_space/section_panel';

Diff for: x-pack/plugins/spaces/public/management/view_space/view_space.tsx

@@ -10,31 +10,37 @@ import React from 'react';
 
 import {
   httpServiceMock,
+  i18nServiceMock,
   notificationServiceMock,
   overlayServiceMock,
   scopedHistoryMock,
+  themeServiceMock,
 } from '@kbn/core/public/mocks';
 import { DEFAULT_APP_CATEGORIES } from '@kbn/core-application-common';
 import { KibanaFeature } from '@kbn/features-plugin/common';
 import { __IntlProvider as IntlProvider } from '@kbn/i18n-react';
 
-import { ViewSpaceContextProvider } from './hooks/view_space_context_provider';
+import { ViewSpaceProvider } from './provider/view_space_provider';
 import { ViewSpaceSettings } from './view_space_general_tab';
 import type { SolutionView } from '../../../common';
 import { spacesManagerMock } from '../../spaces_manager/spaces_manager.mock';
+import { getPrivilegeAPIClientMock } from '../privilege_api_client.mock';
 import { getRolesAPIClientMock } from '../roles_api_client.mock';
 
 const space = { id: 'default', name: 'Default', disabledFeatures: [], _reserved: true };
 const history = scopedHistoryMock.create();
 const getUrlForApp = (appId: string) => appId;
 const navigateToUrl = jest.fn();
 const spacesManager = spacesManagerMock.create();
-const getRolesAPIClient = getRolesAPIClientMock();
+const getRolesAPIClient = getRolesAPIClientMock;
+const getPrivilegeAPIClient = getPrivilegeAPIClientMock;
 const reloadWindow = jest.fn();
 
 const http = httpServiceMock.createStartContract();
 const notifications = notificationServiceMock.createStartContract();
 const overlays = overlayServiceMock.createStartContract();
+const theme = themeServiceMock.createStartContract();
+const i18n = i18nServiceMock.createStartContract();
 
 const navigateSpy = jest.spyOn(history, 'push').mockImplementation(() => {});
 const updateSpaceSpy = jest
@@ -54,7 +60,7 @@ describe('ViewSpaceSettings', () => {
   const TestComponent: React.FC = ({ children }) => {
     return (
       <IntlProvider locale="en">
-        <ViewSpaceContextProvider
+        <ViewSpaceProvider
           capabilities={{
             navLinks: {},
             management: {},
@@ -69,9 +75,12 @@ describe('ViewSpaceSettings', () => {
           http={http}
           notifications={notifications}
           overlays={overlays}
+          getPrivilegesAPIClient={getPrivilegeAPIClient}
+          theme={theme}
+          i18n={i18n}
         >
           {children}
-        </ViewSpaceContextProvider>
+        </ViewSpaceProvider>
       </IntlProvider>
     );
   };

Diff for: x-pack/plugins/spaces/public/management/view_space/view_space_content_tab.tsx

@@ -14,7 +14,7 @@ import { i18n } from '@kbn/i18n';
 import { useUnsavedChangesPrompt } from '@kbn/unsaved-changes-prompt';
 
 import { ViewSpaceTabFooter } from './footer';
-import { useViewSpaceServices } from './hooks/view_space_context_provider';
+import { useViewSpaceServices } from './provider';
 import { ViewSpaceEnabledFeatures } from './view_space_features_tab';
 import type { Space } from '../../../common';
 import { ConfirmDeleteModal } from '../components';

Diff for: x-pack/plugins/spaces/public/management/view_space/view_space_features_tab.tsx

@@ -11,7 +11,6 @@ import React from 'react';
 import type { Capabilities, ScopedHistory } from '@kbn/core/public';
 import type { KibanaFeature } from '@kbn/features-plugin/common';
 import { i18n } from '@kbn/i18n';
-import type { Role } from '@kbn/security-plugin-types-common';
 import { withSuspense } from '@kbn/shared-ux-utility';
 
 import { TAB_ID_CONTENT, TAB_ID_GENERAL, TAB_ID_ROLES } from './constants';
@@ -28,7 +27,7 @@ export interface ViewSpaceTab {
 
 export interface GetTabsProps {
   space: Space;
-  roles: Role[];
+  rolesCount: number;
   features: KibanaFeature[];
   history: ScopedHistory;
   capabilities: Capabilities & {
@@ -67,7 +66,7 @@ export const getTabs = ({
   features,
   history,
   capabilities,
-  roles,
+  rolesCount,
   ...props
 }: GetTabsProps): ViewSpaceTab[] => {
   const canUserViewRoles = Boolean(capabilities?.roles?.view);
@@ -102,13 +101,12 @@ export const getTabs = ({
       }),
       append: (
         <EuiNotificationBadge className="eui-alignCenter" color="subdued" size="m">
-          {roles.length}
+          {rolesCount}
         </EuiNotificationBadge>
       ),
       content: (
         <SuspenseViewSpaceAssignedRoles
           space={space}
-          roles={roles}
           features={features}
           isReadOnly={!canUserModifyRoles}
         />

Diff for: x-pack/plugins/spaces/public/management/view_space/view_space_general_tab.test.tsx

@@ -42,11 +42,13 @@
     "@kbn/security-plugin-types-common",
     "@kbn/core-application-browser",
     "@kbn/unsaved-changes-prompt",
-    "@kbn/core-http-browser",
-    "@kbn/core-overlays-browser",
-    "@kbn/core-notifications-browser",
+    "@kbn/core-lifecycle-browser",
+    "@kbn/security-role-management-model",
+    "@kbn/security-ui-components",
+    "@kbn/react-kibana-mount",
     "@kbn/shared-ux-utility",
     "@kbn/core-application-common",
+    "@kbn/security-authorization-core",
   ],
   "exclude": [
     "target/**/*",