foreman_ansible 6.4.1 → 7.0.0

data/webpack/components/AnsibleHostDetail/components/RolesTab/__test__/RolesTab.fixtures.js

@@ -0,0 +1,180 @@
+import {
+  mockFactory,
+  advancedMockFactory,
+  admin,
+  intruder,
+  userFactory,
+} from '../../../../../testHelper';
+import ansibleRolesQuery from '../../../../../graphql/queries/hostAnsibleRoles.gql';
+import allAnsibleRolesQuery from '../../../../../graphql/queries/allAnsibleRoles.gql';
+import availableAnsibleRolesQuery from '../../../../../graphql/queries/hostAvailableAnsibleRoles.gql';
+import assignAnsibleRolesMutation from '../../../../../graphql/mutations/assignAnsibleRoles.gql';
+import { decodeModelId } from '../../../../../globalIdHelper';
+
+export const hostId = 3;
+const hostGlobalId = 'MDE6SG9zdC0z';
+
+const ansibleRolesMockFactory = mockFactory('host', ansibleRolesQuery);
+const allAnsibleRolesMockFactory = mockFactory('host', allAnsibleRolesQuery);
+const assignRolesMockFactory = mockFactory(
+  'assignAnsibleRoles',
+  assignAnsibleRolesMutation
+);
+const editModalDataFactory = advancedMockFactory(availableAnsibleRolesQuery);
+
+const viewer = userFactory('roles_viewer', [
+  {
+    __typename: 'Permission',
+    id: 'MDE6UGVybWlzc2lvbi0x',
+    name: 'view_ansible_roles',
+  },
+]);
+
+const role1 = {
+  __typename: 'AnsibleRole',
+  id: 'MDE6QW5zaWJsZVJvbGUtMw==',
+  name: 'aardvaark.cube',
+};
+
+const role2 = {
+  __typename: 'AnsibleRole',
+  id: 'MDE6QW5zaWJsZVJvbGUtNQ==',
+  name: 'aardvaark.sphere',
+};
+
+const role3 = {
+  __typename: 'AnsibleRole',
+  id: 'MDE6QW5zaWJsZVJvbGUtMzA=',
+  name: 'another.role',
+};
+
+const role4 = {
+  __typename: 'AnsibleRole',
+  id: 'MDE6QW5zaWJsZVJvbGUtMzk=',
+  name: 'geerlingguy.ceylon',
+};
+
+const ansibleRolesMock = {
+  totalCount: 3,
+  nodes: [role1, role2, role3],
+};
+
+const ansibleRolesUpdatedMock = {
+  totalCount: 3,
+  nodes: [role1, role2, role4],
+};
+
+const availableRoles = {
+  nodes: [
+    role4,
+    {
+      __typename: 'AnsibleRole',
+      id: 'MDE6QW5zaWJsZVJvbGUtMQ==',
+      name: 'theforeman.foreman_scap_client',
+    },
+    {
+      __typename: 'AnsibleRole',
+      id: 'MDE6QW5zaWJsZVJvbGUtMg==',
+      name: 'adriagalin.motd',
+    },
+    {
+      __typename: 'AnsibleRole',
+      id: 'MDE6QW5zaWJsZVJvbGUtMjI=',
+      name: 'geerlingguy.php',
+    },
+    {
+      __typename: 'AnsibleRole',
+      id: 'MDE6QW5zaWJsZVJvbGUtNTc=',
+      name: 'robertdebock.epel',
+    },
+    {
+      __typename: 'AnsibleRole',
+      id: 'MDE6QW5zaWJsZVJvbGUtNTg=',
+      name: 'geerlingguy.nfs',
+    },
+  ],
+};
+
+export const allRolesMocks = allAnsibleRolesMockFactory(
+  { id: hostGlobalId, first: 20, last: 20 },
+  {
+    __typename: 'Host',
+    id: hostGlobalId,
+    allAnsibleRoles: {
+      totalCount: 4,
+      nodes: [
+        {
+          id: 'MDE6QW5zaWJsZVJvbGUtMg==',
+          name: 'adriagalin.motd',
+          inherited: true,
+        },
+        { ...role1, inherited: false },
+        { ...role2, inherited: false },
+        { ...role3, inherited: false },
+      ],
+    },
+  }
+);
+
+const editModalData = {
+  host: {
+    __typename: 'Host',
+    id: hostGlobalId,
+    availableAnsibleRoles: availableRoles,
+  },
+};
+
+export const mocks = ansibleRolesMockFactory(
+  { id: hostGlobalId, first: 20, last: 20 },
+  { __typename: 'Host', id: hostGlobalId, ownAnsibleRoles: ansibleRolesMock },
+  { currentUser: admin }
+);
+
+export const unauthorizedMocks = ansibleRolesMockFactory(
+  { id: hostGlobalId, first: 20, last: 20 },
+  { __typename: 'Host', id: hostGlobalId, ownAnsibleRoles: ansibleRolesMock },
+  { currentUser: intruder }
+);
+
+export const authorizedMocks = ansibleRolesMockFactory(
+  { id: hostGlobalId, first: 20, last: 20 },
+  { __typename: 'Host', id: hostGlobalId, ownAnsibleRoles: ansibleRolesMock },
+  { currentUser: viewer }
+);
+
+export const editModalOpenMocks = editModalDataFactory(
+  {
+    id: hostGlobalId,
+  },
+  editModalData
+);
+
+export const assignRolesSuccessMock = assignRolesMockFactory(
+  {
+    id: hostGlobalId,
+    ansibleRoleIds: [role1, role2, role4].map(decodeModelId),
+  },
+  {
+    host: {
+      __typename: 'Host',
+      id: hostGlobalId,
+      ownAnsibleRoles: ansibleRolesUpdatedMock,
+    },
+    errors: [],
+  }
+);
+
+export const assignRolesErrorMock = assignRolesMockFactory(
+  {
+    id: hostGlobalId,
+    ansibleRoleIds: [role1, role2, role4].map(decodeModelId),
+  },
+  {
+    host: {
+      __typename: 'Host',
+      id: hostGlobalId,
+      ownAnsibleRoles: ansibleRolesMock,
+    },
+    errors: [{ path: ['attributes', 'base'], message: 'is invalid' }],
+  }
+);

data/webpack/components/AnsibleHostDetail/components/RolesTab/__test__/RolesTab.test.js

@@ -0,0 +1,75 @@
+import React from 'react';
+import { render, screen, waitFor } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import userEvent from '@testing-library/user-event';
+import {
+  tick,
+  withMockedProvider,
+  withReactRouter,
+} from '../../../../../testHelper';
+
+import {
+  mocks,
+  hostId,
+  allRolesMocks,
+  unauthorizedMocks,
+  authorizedMocks,
+} from './RolesTab.fixtures';
+
+import RolesTab from '../';
+
+const TestComponent = withReactRouter(withMockedProvider(RolesTab));
+
+describe('RolesTab', () => {
+  it('should load Ansible Roles as admin', async () => {
+    render(<TestComponent hostId={hostId} mocks={mocks} canEditHost />);
+    await waitFor(tick);
+    expect(screen.getByText('aardvaark.cube')).toBeInTheDocument();
+    expect(screen.getByText('aardvaark.sphere')).toBeInTheDocument();
+    expect(screen.getByText('another.role')).toBeInTheDocument();
+  });
+  it('should show all Ansible roles modal', async () => {
+    render(
+      <TestComponent
+        hostId={hostId}
+        mocks={mocks.concat(allRolesMocks)}
+        canEditHost
+      />
+    );
+    await waitFor(tick);
+    expect(screen.getByText('view all assigned roles')).toBeInTheDocument();
+    expect(screen.queryByText('All Ansible Roles')).not.toBeInTheDocument();
+    userEvent.click(screen.getByText('view all assigned roles'));
+    await waitFor(tick);
+    expect(screen.getByText('All Ansible Roles')).toBeInTheDocument();
+    expect(screen.getByText('Inherited from Hostgroup')).toBeInTheDocument();
+    userEvent.click(screen.getByRole('button', { name: 'Close' }));
+    await waitFor(tick);
+    expect(screen.queryByText('All Ansible Roles')).not.toBeInTheDocument();
+  });
+  it('should load Ansible Roles as viewer', async () => {
+    render(
+      <TestComponent
+        hostId={hostId}
+        mocks={authorizedMocks}
+        canEditHost={false}
+      />
+    );
+    await waitFor(tick);
+    expect(screen.getByText('aardvaark.cube')).toBeInTheDocument();
+    expect(screen.queryByText('Edit Ansible Roles')).not.toBeInTheDocument();
+  });
+  it('should not load Ansible Roles for unauthorized user', async () => {
+    render(
+      <TestComponent hostId={hostId} mocks={unauthorizedMocks} canEditHost />
+    );
+    await waitFor(tick);
+    expect(screen.queryByText('aardvaark.cube')).not.toBeInTheDocument();
+    expect(screen.getByText('Permission denied')).toBeInTheDocument();
+    expect(
+      screen.getByText(
+        'You are not authorized to view the page. Request the following permissions from administrator: view_ansible_roles.'
+      )
+    ).toBeInTheDocument();
+  });
+});

data/webpack/components/AnsibleHostDetail/components/RolesTab/index.js

@@ -0,0 +1,51 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { useQuery } from '@apollo/client';
+import { translate as __ } from 'foremanReact/common/I18n';
+
+import ansibleRolesQuery from '../../../../graphql/queries/hostAnsibleRoles.gql';
+import { encodeId } from '../../../../globalIdHelper';
+import RolesTable from './RolesTable';
+import {
+  useParamsToVars,
+  useCurrentPagination,
+} from '../../../../helpers/pageParamsHelper';
+
+const RolesTab = ({ hostId, history, canEditHost }) => {
+  const hostGlobalId = encodeId('Host', hostId);
+  const pagination = useCurrentPagination(history);
+
+  const renameData = data => ({
+    ansibleRoles: data.host.ownAnsibleRoles.nodes,
+    totalCount: data.host.ownAnsibleRoles.totalCount,
+  });
+
+  const useFetchFn = () =>
+    useQuery(ansibleRolesQuery, {
+      variables: { id: hostGlobalId, ...useParamsToVars(history) },
+      fetchPolicy: 'network-only',
+    });
+
+  return (
+    <RolesTable
+      fetchFn={useFetchFn}
+      renamedDataPath="ansibleRoles"
+      renameData={renameData}
+      permissions={['view_ansible_roles']}
+      history={history}
+      hostGlobalId={hostGlobalId}
+      emptyStateProps={{ title: __('No Ansible roles assigned') }}
+      pagination={pagination}
+      canEditHost={canEditHost}
+      hostId={hostId}
+    />
+  );
+};
+
+RolesTab.propTypes = {
+  hostId: PropTypes.number.isRequired,
+  history: PropTypes.object.isRequired,
+  canEditHost: PropTypes.bool.isRequired,
+};
+
+export default RolesTab;

data/webpack/components/AnsibleHostDetail/components/SecondaryTabRoutes.js

@@ -0,0 +1,60 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Route, Switch, Redirect } from 'react-router-dom';
+
+import AnsibleVariableOverrides from './AnsibleVariableOverrides';
+import RolesTab from './RolesTab';
+import JobsTab from './JobsTab';
+import TabLayout from './TabLayout';
+
+import WrappedAnsibleHostInventory from './AnsibleHostInventory';
+import { ANSIBLE_KEY } from '../constants';
+import { route } from '../helpers';
+
+const SecondaryTabRoutes = ({ response, router, history }) => (
+  <Switch>
+    <Route exact path={`/${ANSIBLE_KEY}`}>
+      <Redirect to={route('roles')} />
+    </Route>
+    <Route path={route('roles')}>
+      <TabLayout>
+        <RolesTab
+          hostId={response.id}
+          history={history}
+          canEditHost={response.permissions.edit_hosts}
+        />
+      </TabLayout>
+    </Route>
+    <Route path={route('variables')}>
+      <TabLayout>
+        <AnsibleVariableOverrides
+          hostId={response.id}
+          hostAttrs={response}
+          history={history}
+        />
+      </TabLayout>
+    </Route>
+    <Route path={route('inventory')}>
+      <TabLayout>
+        <WrappedAnsibleHostInventory hostId={response.id} />
+      </TabLayout>
+    </Route>
+    <Route path={route('jobs')}>
+      <TabLayout>
+        <JobsTab
+          resourceId={response.id}
+          resourceName="host"
+          history={history}
+        />
+      </TabLayout>
+    </Route>
+  </Switch>
+);
+
+SecondaryTabRoutes.propTypes = {
+  response: PropTypes.object.isRequired,
+  router: PropTypes.object.isRequired,
+  history: PropTypes.object.isRequired,
+};
+
+export default SecondaryTabRoutes;

data/webpack/components/AnsibleHostDetail/components/TabLayout.js

@@ -0,0 +1,12 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const TabLayout = props => (
+  <div className="ansible-host-detail">{props.children}</div>
+);
+
+TabLayout.propTypes = {
+  children: PropTypes.object.isRequired,
+};
+
+export default TabLayout;

data/webpack/components/AnsibleHostDetail/constants.js

@@ -0,0 +1,9 @@
+import { translate as __ } from 'foremanReact/common/I18n';
+
+export const ANSIBLE_KEY = 'Ansible';
+export const SECONDARY_TABS = [
+  { key: 'roles', title: __('Roles') },
+  { key: 'variables', title: __('Variables') },
+  { key: 'inventory', title: __('Inventory') },
+  { key: 'jobs', title: __('Jobs') },
+];

data/webpack/components/AnsibleHostDetail/helpers.js

@@ -0,0 +1,4 @@
+import { ANSIBLE_KEY } from './constants';
+
+export const hashRoute = subpath => `#/${ANSIBLE_KEY}/${subpath}`;
+export const route = subpath => hashRoute(subpath).substring(1);

data/webpack/components/AnsibleRolesAndVariables/__test__/AnsibleRolesAndVariablesImport.test.js

@@ -1,4 +1,6 @@
-import { testComponentSnapshotsWithFixtures } from '@theforeman/test';
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import '@testing-library/jest-dom';
 import ImportRolesAndVariablesTable from '../AnsibleRolesAndVariables';
 
 const rowsData = [
@@ -28,12 +30,15 @@ const columnsData = [
   { title: 'Hostgroups count' },
 ];
 
-const fixtures = {
-  'should render': {
-    rowsData,
-    columnsData,
-  },
-};
-
-describe('ImportRolesAndVariablesTable', () =>
-  testComponentSnapshotsWithFixtures(ImportRolesAndVariablesTable, fixtures));
+describe('ImportRolesAndVariablesTable', () => {
+  it('should render', () => {
+    render(
+      <ImportRolesAndVariablesTable
+        rowsData={rowsData}
+        columnsData={columnsData}
+      />
+    );
+    expect(screen.getByText('bennojoy.ntp')).toBeInTheDocument();
+    expect(screen.getByText('0ta2.git_role')).toBeInTheDocument();
+  });
+});

data/webpack/components/AnsibleRolesSwitcher/components/AnsibleRole.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import { ListView, Tooltip, OverlayTrigger } from 'patternfly-react';
 import classNames from 'classnames';
 import { translate as __ } from 'foremanReact/common/I18n';
@@ -57,4 +58,32 @@ const AnsibleRole = ({ role, icon, onClick, resourceName, index }) => {
   return listItem(clickHandler);
 };
 
+AnsibleRole.propTypes = {
+  icon: PropTypes.string,
+  index: PropTypes.number,
+  onClick: PropTypes.func,
+  resourceName: PropTypes.string,
+  role: PropTypes.shape({
+    id: PropTypes.number,
+    inherited: PropTypes.bool,
+    name: PropTypes.string,
+  }),
+};
+
+AnsibleRole.defaultProps = {
+  icon: undefined,
+  index: undefined,
+  onClick: undefined,
+  resourceName: undefined,
+  role: {
+    id: undefined,
+    inherited: false,
+    name: '',
+  },
+};
+
+AnsibleRole.defaultProps = {
+  resourceName: 'host',
+};
+
 export default AnsibleRole;

data/webpack/components/AnsibleRolesSwitcher/components/AnsibleRole.test.js

@@ -9,16 +9,19 @@ const fixtures = {
     role: { name: 'test.role', id: 5 },
     icon: 'fa fa-plus-circle',
     onClick: noop,
+    index: 0,
   },
   'should render a role to remove': {
     role: { name: 'test.role', id: 5 },
     icon: 'fa fa-minus-circle',
     onClick: noop,
+    index: 0,
   },
   'should render inherited role to remove': {
     role: { name: 'test.role', id: 5, inherited: true },
     icon: 'fa fa-minus-circle',
     onClick: noop,
+    index: 0,
   },
 };
 

data/webpack/components/AnsibleRolesSwitcher/components/AvailableRolesList.js

@@ -25,12 +25,13 @@ const AvailableRolesList = ({
       />
     </div>
     <LoadingState loading={loading}>
-      {unassignedRoles.map(role => (
+      {unassignedRoles.map((role, index) => (
         <AnsibleRole
           key={role.id}
           role={role}
           icon="fa fa-plus-circle"
           onClick={onAddRole}
+          index={index}
         />
       ))}
     </LoadingState>

data/webpack/components/AnsibleRolesSwitcher/components/__snapshots__/AnsibleRole.test.js.snap

@@ -19,7 +19,7 @@ exports[`AnsibleRole should render a role to add 1`] = `
   compoundExpand={false}
   compoundExpanded={false}
   description={null}
-  heading="test.role"
+  heading="1. test.role"
   hideCloseIcon={false}
   id={5}
   initExpanded={false}
@@ -51,7 +51,7 @@ exports[`AnsibleRole should render a role to remove 1`] = `
   compoundExpand={false}
   compoundExpanded={false}
   description={null}
-  heading="test.role"
+  heading="1. test.role"
   hideCloseIcon={false}
   id={5}
   initExpanded={false}
@@ -94,7 +94,7 @@ exports[`AnsibleRole should render inherited role to remove 1`] = `
     compoundExpand={false}
     compoundExpanded={false}
     description={null}
-    heading="test.role"
+    heading="1. test.role"
     hideCloseIcon={false}
     id={5}
     initExpanded={false}

data/webpack/components/AnsibleRolesSwitcher/components/__snapshots__/AvailableRolesList.test.js.snap

@@ -34,8 +34,10 @@ exports[`AvailableRolesList should render 1`] = `
   >
     <AnsibleRole
       icon="fa fa-plus-circle"
+      index={0}
       key="1"
       onClick={[Function]}
+      resourceName="host"
       role={
         Object {
           "id": 1,
@@ -45,8 +47,10 @@ exports[`AvailableRolesList should render 1`] = `
     />
     <AnsibleRole
       icon="fa fa-plus-circle"
+      index={1}
       key="2"
       onClick={[Function]}
+      resourceName="host"
       role={
         Object {
           "id": 2,

data/webpack/components/DualList/DualList.scss

@@ -0,0 +1,3 @@
+.foreman-dual-list-order {
+  padding-right: var(--pf-global--spacer--sm);
+}

data/webpack/components/DualList/ListControls.js

@@ -0,0 +1,65 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { translate as __ } from 'foremanReact/common/I18n';
+
+const ListControls = props => (
+  <div className="pf-c-dual-list-selector__controls">
+    <div className="pf-c-dual-list-selector__controls-item">
+      <button
+        className="pf-c-button pf-m-plain"
+        type="button"
+        disabled={props.addSelectedDisabled}
+        onClick={props.onAddSelected}
+        aria-label={__('Add selected')}
+      >
+        <i className="fas fa-fw fa-angle-right" />
+      </button>
+    </div>
+    <div className="pf-c-dual-list-selector__controls-item">
+      <button
+        className="pf-c-button pf-m-plain"
+        type="button"
+        disabled={props.addAllDisabled}
+        onClick={props.onAddAll}
+        aria-label={__('Add all')}
+      >
+        <i className="fas fa-fw fa-angle-double-right" />
+      </button>
+    </div>
+    <div className="pf-c-dual-list-selector__controls-item">
+      <button
+        className="pf-c-button pf-m-plain"
+        type="button"
+        disabled={props.removeAllDisabled}
+        onClick={props.onRemoveAll}
+        aria-label={__('Remove all')}
+      >
+        <i className="fas fa-fw fa-angle-double-left" />
+      </button>
+    </div>
+    <div className="pf-c-dual-list-selector__controls-item">
+      <button
+        className="pf-c-button pf-m-plain"
+        type="button"
+        disabled={props.removeSelectedDisabled}
+        onClick={props.onRemoveSelected}
+        aria-label={__('Remove selected')}
+      >
+        <i className="fas fa-fw fa-angle-left" />
+      </button>
+    </div>
+  </div>
+);
+
+ListControls.propTypes = {
+  addSelectedDisabled: PropTypes.bool.isRequired,
+  onAddSelected: PropTypes.func.isRequired,
+  addAllDisabled: PropTypes.bool.isRequired,
+  onAddAll: PropTypes.func.isRequired,
+  removeAllDisabled: PropTypes.bool.isRequired,
+  onRemoveAll: PropTypes.func.isRequired,
+  removeSelectedDisabled: PropTypes.bool.isRequired,
+  onRemoveSelected: PropTypes.func.isRequired,
+};
+
+export default ListControls;

data/webpack/components/DualList/ListHeader.js

@@ -0,0 +1,16 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const ListHeader = props => (
+  <div className="pf-c-dual-list-selector__header">
+    <div className="pf-c-dual-list-selector__title">
+      <div className="pf-c-dual-list-selector__title-text">{props.title}</div>
+    </div>
+  </div>
+);
+
+ListHeader.propTypes = {
+  title: PropTypes.string.isRequired,
+};
+
+export default ListHeader;