[Enterprise Search] Migrate shared role mapping components

x-pack/plugins/enterprise_search/public/applications/app_search/types.ts

@@ -6,5 +6,5 @@
  */
 
 export * from '../../../common/types/app_search';
-export { Role, RoleTypes, AbilityTypes } from './utils/role';
+export { Role, RoleTypes, AbilityTypes, ASRoleMapping } from './utils/role';
 export { Engine } from './components/engine/types';

x-pack/plugins/enterprise_search/public/applications/app_search/utils/role/index.ts

@@ -5,6 +5,8 @@
  * 2.0.
  */
 
+import { RoleMapping } from '../../../shared/types';
+import { Engine } from '../../components/engine/types';
 import { Account } from '../../types';
 
 export type RoleTypes = 'owner' | 'admin' | 'dev' | 'editor' | 'analyst';
@@ -103,3 +105,11 @@ export const getRoleAbilities = (role: Account['role']): Role => {
 
   return Object.assign(myRole, topLevelProps, abilities);
 };
+
+export interface ASRoleMapping extends RoleMapping {
+  accessAllEngines: boolean;
+  engines: Engine[];
+  toolTip?: {
+    content: string;
+  };
+}

x-pack/plugins/enterprise_search/public/applications/shared/role_mapping/__mocks__/roles.ts

@@ -0,0 +1,68 @@
+/*
+ * 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.
+ */
+
+export const asRoleMapping = {
+  id: null,
+  attributeName: 'role',
+  attributeValue: ['superuser'],
+  authProvider: ['*'],
+  roleType: 'owner',
+  rules: {
+    role: 'superuser',
+  },
+  accessAllEngines: true,
+  engines: [],
+  toolTip: {
+    content: 'Elasticsearch superusers will always be able to log in as the owner',
+  },
+};
+
+export const wsRoleMapping = {
+  id: '602d4ba85foobarbaz123',
+  attributeName: 'username',
+  attributeValue: 'user',
+  authProvider: ['*', 'other_auth'],
+  roleType: 'admin',
+  rules: {
+    username: 'user',
+  },
+  allGroups: true,
+  groups: [
+    {
+      id: '602c3b475foobarbaz123',
+      name: 'Default',
+      createdAt: '2021-02-16T21:38:15Z',
+      updatedAt: '2021-02-16T21:40:32Z',
+      contentSources: [
+        {
+          id: '602c3bcf5foobarbaz123',
+          name: 'National Parks',
+          serviceType: 'custom',
+        },
+      ],
+      users: [
+        {
+          id: '602c3b485foobarbaz123',
+          name: 'you_know_for_search',
+          email: 'foo@example.com',
+          initials: 'E',
+          pictureUrl: null,
+          color: '#ffcc13',
+        },
+        {
+          id: '602c3bf85foobarbaz123',
+          name: 'elastic',
+          email: null,
+          initials: 'E',
+          pictureUrl: null,
+          color: '#7968ff',
+        },
+      ],
+      usersCount: 2,
+    },
+  ],
+};

x-pack/plugins/enterprise_search/public/applications/shared/role_mapping/add_role_mapping_button.test.tsx

@@ -0,0 +1,22 @@
+/*
+ * 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 { shallow } from 'enzyme';
+
+import { EuiButtonTo } from '../react_router_helpers';
+
+import { AddRoleMappingButton } from './add_role_mapping_button';
+
+describe('AddRoleMappingButton', () => {
+  it('renders', () => {
+    const wrapper = shallow(<AddRoleMappingButton path="/foo" />);
+
+    expect(wrapper.find(EuiButtonTo)).toHaveLength(1);
+  });
+});

x-pack/plugins/enterprise_search/public/applications/shared/role_mapping/add_role_mapping_button.tsx

@@ -0,0 +1,22 @@
+/*
+ * 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 { EuiButtonTo } from '../react_router_helpers';
+
+import { ADD_ROLE_MAPPING_BUTTON } from './constants';
+
+interface Props {
+  path: string;
+}
+
+export const AddRoleMappingButton: React.FC<Props> = ({ path }) => (
+  <EuiButtonTo to={path} fill color="secondary">
+    {ADD_ROLE_MAPPING_BUTTON}
+  </EuiButtonTo>
+);

x-pack/plugins/enterprise_search/public/applications/shared/role_mapping/attribute_selector.test.tsx

@@ -0,0 +1,167 @@
+/*
+ * 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 { shallow, ShallowWrapper } from 'enzyme';
+
+import { EuiComboBox, EuiFieldText } from '@elastic/eui';
+
+import { AttributeSelector, AttributeName } from './attribute_selector';
+import { ANY_AUTH_PROVIDER, ANY_AUTH_PROVIDER_OPTION_LABEL } from './constants';
+
+const handleAttributeSelectorChange = jest.fn();
+const handleAttributeValueChange = jest.fn();
+const handleAuthProviderChange = jest.fn();
+
+const baseProps = {
+  attributeName: 'username' as AttributeName,
+  attributeValue: 'Something',
+  attributes: ['a', 'b', 'c'],
+  availableAuthProviders: ['ees_saml', 'kbn_saml'],
+  selectedAuthProviders: ['ees_saml'],
+  elasticsearchRoles: ['whatever'],
+  multipleAuthProvidersConfig: true,
+  disabled: false,
+  handleAttributeSelectorChange,
+  handleAttributeValueChange,
+  handleAuthProviderChange,
+};
+
+describe('AttributeSelector', () => {
+  it('renders', () => {
+    const wrapper = shallow(<AttributeSelector {...baseProps} />);
+
+    expect(wrapper.find('[data-test-subj="AttributeSelector"]').exists()).toBe(true);
+  });
+
+  it('renders disabled panel with className', () => {
+    const wrapper = shallow(<AttributeSelector {...baseProps} disabled />);
+
+    expect(wrapper.find('[data-test-subj="AttributeSelector"]').prop('className')).toEqual(
+      'euiPanel--disabled'
+    );
+  });
+
+  describe('Auth Providers', () => {
+    const findAuthProvidersSelect = (wrapper: ShallowWrapper) =>
+      wrapper.find('[data-test-subj="AuthProviderSelect"]');
+
+    it('will not render if "availableAuthProviders" prop has not been provided', () => {
+      const wrapper = shallow(
+        <AttributeSelector {...baseProps} availableAuthProviders={undefined} />
+      );
+
+      expect(findAuthProvidersSelect(wrapper)).toHaveLength(0);
+    });
+
+    it('handles fallback props', () => {
+      const wrapper = shallow(
+        <AttributeSelector
+          {...baseProps}
+          attributeValue={undefined}
+          selectedAuthProviders={undefined}
+        />
+      );
+
+      const select: ShallowWrapper = findAuthProvidersSelect(wrapper);
+
+      expect(select.prop('selectedOptions')).toEqual([
+        {
+          label: ANY_AUTH_PROVIDER_OPTION_LABEL,
+          value: ANY_AUTH_PROVIDER,
+        },
+      ]);
+    });
+
+    it('renders a list of auth providers from the "availableAuthProviders" prop including an "Any" option', () => {
+      const wrapper = shallow(
+        <AttributeSelector {...baseProps} availableAuthProviders={['ees_saml', 'kbn_saml']} />
+      );
+      const select = findAuthProvidersSelect(wrapper) as any;
+
+      expect(select.props().options).toEqual([
+        {
+          label: expect.any(String),
+          options: [{ label: ANY_AUTH_PROVIDER_OPTION_LABEL, value: '*' }],
+        },
+        {
+          label: expect.any(String),
+          options: [
+            { label: 'ees_saml', value: 'ees_saml' },
+            { label: 'kbn_saml', value: 'kbn_saml' },
+          ],
+        },
+      ]);
+    });
+
+    it('the "selectedAuthProviders" prop should be used as the selected value', () => {
+      const wrapper = shallow(
+        <AttributeSelector
+          {...baseProps}
+          availableAuthProviders={['ees_saml', 'kbn_saml']}
+          selectedAuthProviders={['kbn_saml']}
+        />
+      );
+      const select = findAuthProvidersSelect(wrapper) as any;
+
+      expect(select.props().selectedOptions).toEqual([{ label: 'kbn_saml', value: 'kbn_saml' }]);
+    });
+
+    it('should call the "handleAuthProviderChange" prop when a value is selected', () => {
+      const wrapper = shallow(<AttributeSelector {...baseProps} />);
+      const select = findAuthProvidersSelect(wrapper);
+      select.simulate('change', [{ label: 'kbn_saml', value: 'kbn_saml' }]);
+
+      expect(handleAuthProviderChange).toHaveBeenCalledWith(['kbn_saml']);
+    });
+
+    it('should call the "handleAttributeSelectorChange" prop when a value is selected', () => {
+      const wrapper = shallow(<AttributeSelector {...baseProps} />);
+      const select = wrapper.find('[data-test-subj="ExternalAttributeSelect"]');
+      const event = { target: { value: 'kbn_saml' } };
+      select.simulate('change', event);
+
+      expect(handleAttributeSelectorChange).toHaveBeenCalledWith(
+        'kbn_saml',
+        baseProps.elasticsearchRoles[0]
+      );
+    });
+
+    it('handles fallback when no "handleAuthProviderChange" provided', () => {
+      const wrapper = shallow(
+        <AttributeSelector {...baseProps} handleAuthProviderChange={undefined} />
+      );
+
+      expect(wrapper.find(EuiComboBox).prop('onChange')!([])).toEqual(undefined);
+    });
+
+    it('should call the "handleAttributeSelectorChange" prop when field text value is changed', () => {
+      const wrapper = shallow(<AttributeSelector {...baseProps} />);
+      const input = wrapper.find(EuiFieldText);
+      const event = { target: { value: 'kbn_saml' } };
+      input.simulate('change', event);
+
+      expect(handleAttributeSelectorChange).toHaveBeenCalledWith(
+        'kbn_saml',
+        baseProps.elasticsearchRoles[0]
+      );
+    });
+
+    it('should call the "handleAttributeSelectorChange" prop when attribute value is selected', () => {
+      const wrapper = shallow(<AttributeSelector {...baseProps} attributeName="role" />);
+      const select = wrapper.find('[data-test-subj="ElasticsearchRoleSelect"]');
+      const event = { target: { value: 'kbn_saml' } };
+      select.simulate('change', event);
+
+      expect(handleAttributeSelectorChange).toHaveBeenCalledWith(
+        'kbn_saml',
+        baseProps.elasticsearchRoles[0]
+      );
+    });
+  });
+});