UX improvements for unauthorized users

x-pack/plugins/security/public/views/management/edit_role/components/edit_role_page.tsx

@@ -23,6 +23,7 @@ import { get } from 'lodash';
 import React, { ChangeEvent, Component, Fragment, HTMLProps } from 'react';
 import { toastNotifications } from 'ui/notify';
 import { Space } from '../../../../../../spaces/common/model/space';
+import { UserProfile } from '../../../../../../xpack_main/public/services/user_profile';
 import { IndexPrivilege } from '../../../../../common/model/index_privilege';
 import { KibanaPrivilege } from '../../../../../common/model/kibana_privilege';
 import { Role } from '../../../../../common/model/role';
@@ -46,6 +47,7 @@ interface Props {
   notifier: any;
   spaces?: Space[];
   spacesEnabled: boolean;
+  userProfile: UserProfile;
 }
 
 interface State {
@@ -212,6 +214,7 @@ export class EditRolePage extends Component<Props, State> {
           kibanaAppPrivileges={this.props.kibanaAppPrivileges}
           spaces={this.props.spaces}
           spacesEnabled={this.props.spacesEnabled}
+          userProfile={this.props.userProfile}
           editable={!isReservedRole(this.state.role)}
           role={this.state.role}
           onChange={this.onRoleChange}

x-pack/plugins/security/public/views/management/edit_role/components/privileges/kibana/__snapshots__/kibana_privileges.test.tsx.snap

@@ -42,6 +42,11 @@ exports[`<KibanaPrivileges> renders without crashing 1`] = `
         },
       ]
     }
+    userProfile={
+      Object {
+        "hasCapability": [Function],
+      }
+    }
     validator={
       RoleValidator {
         "inProgressSpacePrivileges": Array [],

x-pack/plugins/security/public/views/management/edit_role/components/privileges/kibana/__snapshots__/space_aware_privilege_form.test.tsx.snap

@@ -217,9 +217,39 @@ exports[`<SpaceAwarePrivilegeForm> renders without crashing 1`] = `
               },
             ]
           }
+          userProfile={
+            Object {
+              "hasCapability": [Function],
+            }
+          }
         />
       </EuiFlexItem>
     </EuiFlexGroup>
   </React.Fragment>
 </React.Fragment>
 `;
+
+exports[`<SpaceAwarePrivilegeForm> with user profile disabling "manageSpaces" renders a warning message instead of the privilege form 1`] = `
+<EuiCallOut
+  color="danger"
+  iconType="alert"
+  size="m"
+  title={
+    <p>
+      Insufficient Privileges
+    </p>
+  }
+>
+  <p>
+    You are not authorized to view all available spaces.
+  </p>
+  <p>
+    Please ensure your account has all privileges granted by the
+
+    <strong>
+      kibana_user
+    </strong>
+     role, and try again.
+  </p>
+</EuiCallOut>
+`;

x-pack/plugins/security/public/views/management/edit_role/components/privileges/kibana/impacted_spaces_flyout.test.tsx

@@ -35,6 +35,9 @@ const buildProps = (customProps = {}) => {
         name: 'Marketing',
       },
     ],
+    userProfile: {
+      hasCapability: () => true,
+    },
     kibanaAppPrivileges: [
       {
         name: 'all',

x-pack/plugins/security/public/views/management/edit_role/components/privileges/kibana/impacted_spaces_flyout.tsx

@@ -17,6 +17,7 @@ import { PrivilegeSpaceTable } from './privilege_space_table';
 
 import { Space } from '../../../../../../../../spaces/common/model/space';
 import { ManageSpacesButton } from '../../../../../../../../spaces/public/components';
+import { UserProfile } from '../../../../../../../../xpack_main/public/services/user_profile';
 import { KibanaPrivilege } from '../../../../../../../common/model/kibana_privilege';
 import { Role } from '../../../../../../../common/model/role';
 import { NO_PRIVILEGE_VALUE } from '../../../lib/constants';
@@ -25,6 +26,7 @@ import './impacted_spaces_flyout.less';
 interface Props {
   role: Role;
   spaces: Space[];
+  userProfile: UserProfile;
 }
 
 interface State {
@@ -118,7 +120,7 @@ export class ImpactedSpacesFlyout extends Component<Props, State> {
         </EuiFlyoutBody>
         <EuiFlyoutFooter className="showImpactedSpaces--flyout--footer">
           {/* TODO: Hide footer if button is not available */}
-          <ManageSpacesButton />
+          <ManageSpacesButton userProfile={this.props.userProfile} />
         </EuiFlyoutFooter>
       </EuiFlyout>
     );

x-pack/plugins/security/public/views/management/edit_role/components/privileges/kibana/kibana_privileges.test.tsx

@@ -38,6 +38,7 @@ const buildProps = (customProps = {}) => {
         name: 'Marketing',
       },
     ],
+    userProfile: { hasCapability: () => true },
     editable: true,
     kibanaAppPrivileges: ['all' as KibanaPrivilege],
     onChange: jest.fn(),

x-pack/plugins/security/public/views/management/edit_role/components/privileges/kibana/kibana_privileges.tsx

@@ -6,6 +6,7 @@
 
 import React, { Component } from 'react';
 import { Space } from '../../../../../../../../spaces/common/model/space';
+import { UserProfile } from '../../../../../../../../xpack_main/public/services/user_profile';
 import { KibanaPrivilege } from '../../../../../../../common/model/kibana_privilege';
 import { Role } from '../../../../../../../common/model/role';
 import { RoleValidator } from '../../../lib/validate_role';
@@ -17,6 +18,7 @@ interface Props {
   role: Role;
   spacesEnabled: boolean;
   spaces?: Space[];
+  userProfile: UserProfile;
   editable: boolean;
   kibanaAppPrivileges: KibanaPrivilege[];
   onChange: (role: Role) => void;
@@ -38,6 +40,7 @@ export class KibanaPrivileges extends Component<Props, {}> {
       role,
       spacesEnabled,
       spaces = [],
+      userProfile,
       onChange,
       editable,
       validator,
@@ -49,6 +52,7 @@ export class KibanaPrivileges extends Component<Props, {}> {
           kibanaAppPrivileges={kibanaAppPrivileges}
           role={role}
           spaces={spaces}
+          userProfile={userProfile}
           onChange={onChange}
           editable={editable}
           validator={validator}

x-pack/plugins/security/public/views/management/edit_role/components/privileges/kibana/space_aware_privilege_form.test.tsx

@@ -37,6 +37,7 @@ const buildProps = (customProps: any = {}) => {
         name: 'Marketing',
       },
     ],
+    userProfile: { hasCapability: () => true },
     editable: true,
     kibanaAppPrivileges: ['all', 'read'],
     onChange: jest.fn(),
@@ -229,4 +230,22 @@ describe('<SpaceAwarePrivilegeForm>', () => {
       expect(addPrivilegeButton).toHaveLength(1);
     });
   });
+
+  describe('with user profile disabling "manageSpaces"', () => {
+    it('renders a warning message instead of the privilege form', () => {
+      const props = buildProps({
+        userProfile: {
+          hasCapability: (capability: string) => {
+            if (capability === 'manageSpaces') {
+              return false;
+            }
+            throw new Error(`unexpected call to hasCapability: ${capability}`);
+          },
+        },
+      });
+
+      const wrapper = shallow(<SpaceAwarePrivilegeForm {...props} />);
+      expect(wrapper).toMatchSnapshot();
+    });
+  });
 });

x-pack/plugins/security/public/views/management/edit_role/components/privileges/kibana/space_aware_privilege_form.tsx

@@ -6,6 +6,7 @@
 
 import {
   EuiButton,
+  EuiCallOut,
   // @ts-ignore
   EuiDescribedFormGroup,
   EuiFlexGroup,
@@ -17,6 +18,7 @@ import {
 } from '@elastic/eui';
 import React, { Component, Fragment } from 'react';
 import { Space } from '../../../../../../../../spaces/common/model/space';
+import { UserProfile } from '../../../../../../../../xpack_main/public/services/user_profile';
 import { KibanaPrivilege } from '../../../../../../../common/model/kibana_privilege';
 import { Role } from '../../../../../../../common/model/role';
 import { isReservedRole } from '../../../../../../lib/role';
@@ -37,6 +39,7 @@ interface Props {
   onChange: (role: Role) => void;
   editable: boolean;
   validator: RoleValidator;
+  userProfile: UserProfile;
 }
 
 interface PrivilegeForm {
@@ -70,7 +73,19 @@ export class SpaceAwarePrivilegeForm extends Component<Props, State> {
   }
 
   public render() {
-    const { kibanaAppPrivileges, role } = this.props;
+    const { kibanaAppPrivileges, role, userProfile } = this.props;
+
+    if (!userProfile.hasCapability('manageSpaces')) {
+      return (
+        <EuiCallOut title={<p>Insufficient Privileges</p>} iconType="alert" color="danger">
+          <p>You are not authorized to view all available spaces.</p>
+          <p>
+            Please ensure your account has all privileges granted by the{' '}
+            <strong>kibana_user</strong> role, and try again.
+          </p>
+        </EuiCallOut>
+      );
+    }
 
     const assignedPrivileges = role.kibana;
 
@@ -190,7 +205,11 @@ export class SpaceAwarePrivilegeForm extends Component<Props, State> {
             </EuiFlexItem>
           )}
           <EuiFlexItem>
-            <ImpactedSpacesFlyout role={role} spaces={spaces} />
+            <ImpactedSpacesFlyout
+              role={role}
+              spaces={spaces}
+              userProfile={this.props.userProfile}
+            />
           </EuiFlexItem>
         </EuiFlexGroup>
       </Fragment>

x-pack/plugins/security/public/views/management/edit_role/index.js

@@ -19,6 +19,7 @@ import 'plugins/security/services/shield_indices';
 
 import { IndexPatternsProvider } from 'ui/index_patterns/index_patterns';
 import { XPackInfoProvider } from 'plugins/xpack_main/services/xpack_info';
+import { UserProfileProvider } from 'plugins/xpack_main/services/user_profile';
 import { SpacesManager } from 'plugins/spaces/lib';
 import { checkLicenseError } from 'plugins/security/lib/check_license_error';
 import { EDIT_ROLES_PATH, ROLES_PATH } from '../management_urls';
@@ -92,6 +93,7 @@ routes.when(`${EDIT_ROLES_PATH}/:name?`, {
     const role = $route.current.locals.role;
 
     const xpackInfo = Private(XPackInfoProvider);
+    const userProfile = Private(UserProfileProvider);
     const allowDocumentLevelSecurity = xpackInfo.get('features.security.allowRoleDocumentLevelSecurity');
     const allowFieldLevelSecurity = xpackInfo.get('features.security.allowRoleFieldLevelSecurity');
     const rbacApplication = chrome.getInjected('rbacApplication');
@@ -137,6 +139,7 @@ routes.when(`${EDIT_ROLES_PATH}/:name?`, {
         notifier={Notifier}
         spaces={spaces}
         spacesEnabled={enableSpaceAwarePrivileges}
+        userProfile={userProfile}
       />, domNode);
 
       // unmount react on controller destroy

x-pack/plugins/spaces/index.js

@@ -19,6 +19,7 @@ import { wrapError } from './server/lib/errors';
 import mappings from './mappings.json';
 import { spacesSavedObjectsClientWrapperFactory } from './server/lib/saved_objects_client/saved_objects_client_wrapper_factory';
 import { watchStatusAndLicenseToInitialize } from '../../server/lib/watch_status_and_license_to_initialize';
+import { registerUserProfileCapabilityFactory } from '../xpack_main/server/lib/user_profile_registry';
 import { SpacesClient } from './server/lib/spaces_client';
 import { SpacesAuditLogger } from './server/lib/audit_logger';
 import { AuditLogger } from '../../server/lib/audit_logger';
@@ -124,6 +125,14 @@ export const spaces = (kibana) => new kibana.Plugin({
 
     initSpacesRequestInterceptors(server);
 
+    registerUserProfileCapabilityFactory(async (request) => {
+      const spacesClient = server.plugins.spaces.spacesClient.getScopedClient(request);
+
+      return {
+        manageSpaces: await spacesClient.canEnumerateSpaces(),
+      };
+    });
+
     // Register a function with server to manage the collection of usage stats
     server.usage.collectorSet.register(getSpacesUsageCollector(server));
   }

x-pack/plugins/spaces/public/components/manage_spaces_button.tsx

@@ -6,16 +6,22 @@
 
 import { EuiButton } from '@elastic/eui';
 import React, { Component, CSSProperties } from 'react';
+import { UserProfile } from '../../../xpack_main/public/services/user_profile';
 import { MANAGE_SPACES_URL } from '../lib/constants';
 
 interface Props {
   isDisabled?: boolean;
   size?: 's' | 'l';
   style?: CSSProperties;
+  userProfile: UserProfile;
 }
 
 export class ManageSpacesButton extends Component<Props, {}> {
   public render() {
+    if (!this.props.userProfile.hasCapability('manageSpaces')) {
+      return null;
+    }
+
     return (
       <EuiButton
         size={this.props.size || 's'}

x-pack/plugins/spaces/public/views/management/components/index.ts

@@ -5,3 +5,4 @@
  */
 
 export { ConfirmDeleteModal } from './confirm_delete_modal';
+export { UnauthorizedPrompt } from './unauthorized_prompt';

x-pack/plugins/spaces/public/views/management/components/unauthorized_prompt.tsx

@@ -0,0 +1,19 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { EuiEmptyPrompt } from '@elastic/eui';
+import React from 'react';
+
+export const UnauthorizedPrompt = () => (
+  <EuiEmptyPrompt
+    iconType="spacesApp"
+    iconColor={'danger'}
+    title={<h2>Permission denied</h2>}
+    body={
+      <p data-test-subj="permissionDeniedMessage">You do not have permission to manage spaces.</p>
+    }
+  />
+);

x-pack/plugins/spaces/public/views/management/edit_space/manage_space_page.js

@@ -34,6 +34,7 @@ import { CustomizeSpaceAvatar } from './customize_space_avatar';
 import { isReservedSpace } from '../../../../common';
 import { ReservedSpaceBadge } from './reserved_space_badge';
 import { SpaceValidator } from '../lib/validate_space';
+import { UnauthorizedPrompt } from '../components/unauthorized_prompt';
 
 export class ManageSpacePage extends Component {
   state = {
@@ -99,6 +100,14 @@ export class ManageSpacePage extends Component {
   }
 
   getForm = () => {
+    const {
+      userProfile
+    } = this.props;
+
+    if (!userProfile.hasCapability('manageSpaces')) {
+      return <UnauthorizedPrompt />;
+    }
+
     const {
       name = '',
       description = '',
@@ -336,4 +345,5 @@ ManageSpacePage.propTypes = {
   space: PropTypes.string,
   spacesManager: PropTypes.object,
   spacesNavState: PropTypes.object.isRequired,
+  userProfile: PropTypes.object.isRequired,
 };