foreman_ansible 7.1.8 → 8.0.0

data/webpack/components/AnsibleHostDetail/components/AnsibleVariableOverrides/AnsibleVariableOverridesTableHelper.js

@@ -4,13 +4,8 @@ import { sprintf, translate as __ } from 'foremanReact/common/I18n';
 
 import { showToast } from '../../../../toastHelper';
 
-function formatSourceLink(currentValue) {
-  const element =
-    typeof currentValue.element !== 'string'
-      ? currentValue.element.toString()
-      : currentValue.element;
-  return `${__(element)}: ${currentValue.elementName}`;
-}
+const formatSourceLink = currentValue =>
+  `${__(currentValue.element)}: ${currentValue.elementName}`;
 
 export const formatSourceAttr = variable =>
   variable.currentValue
@@ -90,16 +85,12 @@ const validateRegexp = (variable, value) => {
 };
 
 const validateList = (variable, value) => {
-  let { validatorRule } = variable;
-  if (typeof validatorRule !== 'string') {
-    validatorRule = validatorRule.toString();
-  }
-  if (validatorRule.split(',').find(item => item.trim() === value)) {
+  if (variable.validatorRule.split(',').find(item => item.trim() === value)) {
     return validationSuccess;
   }
   return {
     key: 'error',
-    msg: sprintf(__('Invalid, expected one of: %s'), validatorRule),
+    msg: sprintf(__('Invalid, expected one of: %s'), variable.validatorRule),
   };
 };
 

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

@@ -19,7 +19,7 @@ import {
 const TestComponent = withRedux(withMockedProvider(AnsibleVariableOverrides));
 
 describe('AnsibleVariableOverrides', () => {
-  it('should show skeleton when page is loading', async () => {
+  it('should show skeleton when page is loading', () => {
     const { container } = render(
       <TestComponent
         hostId={hostId}
@@ -31,8 +31,6 @@ describe('AnsibleVariableOverrides', () => {
     expect(
       container.getElementsByClassName('react-loading-skeleton')
     ).toHaveLength(5);
-
-    await waitFor(tick);
   });
   it('should load', async () => {
     render(

data/webpack/components/AnsibleHostDetail/components/JobsTab/PreviousJobsTable.js.orig

@@ -0,0 +1,151 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { translate as __ } from 'foremanReact/common/I18n';
+import { usePaginationOptions } from 'foremanReact/components/Pagination/PaginationHooks';
+
+import RelativeDateTime from 'foremanReact/components/common/dates/RelativeDateTime';
+
+import {
+  TableComposable,
+  Thead,
+  Tbody,
+  Tr,
+  Th,
+  Td,
+} from '@patternfly/react-table';
+import { Flex, FlexItem, Pagination } from '@patternfly/react-core';
+
+import { decodeId } from '../../../../globalIdHelper';
+import withLoading from '../../../withLoading';
+<<<<<<< HEAD
+import { readableCron } from './JobsTabHelper';
+import {
+  preparePerPageOptions,
+  refreshPage,
+} from '../../../../helpers/paginationHelper';
+=======
+import { readableCron, readablePurpose } from './JobsTabHelper';
+>>>>>>> 5b01704 (Fixes #34458 - Show Hostgroup jobs on the Host Detail page)
+
+const PreviousJobsTable = ({ history, totalCount, jobs, pagination }) => {
+  const columns = [
+    __('Description'),
+    __('Result'),
+    __('State'),
+    __('Executed at'),
+    __('Schedule'),
+  ];
+
+  const handlePerPageSelected = (event, perPage) => {
+    refreshPage(history, { page: 1, perPage });
+  };
+
+  const handlePageSelected = (event, page) => {
+    refreshPage(history, { ...pagination, page });
+  };
+
+  const perPageOptions = preparePerPageOptions(usePaginationOptions());
+
+  return (
+    <React.Fragment>
+      <h3>{__('Previously executed jobs')}</h3>
+<<<<<<< HEAD
+      <Flex className="pf-u-pt-md">
+=======
+      <Flex direction={{ default: 'column' }} className="pf-u-pt-md">
+        <FlexItem align={{ default: 'alignRight' }}>
+          <Pagination updateParamsByUrl itemCount={totalCount} variant="top" />
+        </FlexItem>
+        <FlexItem>
+          <TableComposable variant="compact">
+            <Thead>
+              <Tr>
+                {columns.map(col => (
+                  <Th key={col}>{col}</Th>
+                ))}
+              </Tr>
+            </Thead>
+            <Tbody>
+              {jobs.map(job => (
+                <Tr key={job.id}>
+                  <Td>
+                    <a
+                      onClick={() =>
+                        window.tfm.nav.pushUrl(
+                          `/job_invocations/${decodeId(job.id)}`
+                        )
+                      }
+                    >
+                      {job.description}
+                    </a>
+                    &nbsp;
+                    {readablePurpose(job.recurringLogic.purpose)}
+                  </Td>
+                  <Td>{job.task.result}</Td>
+                  <Td>{job.task.state}</Td>
+                  <Td>
+                    <RelativeDateTime date={job.startAt} />
+                  </Td>
+                  <Td>{readableCron(job.recurringLogic.cronLine)}</Td>
+                </Tr>
+              ))}
+            </Tbody>
+          </TableComposable>
+        </FlexItem>
+>>>>>>> 5b01704 (Fixes #34458 - Show Hostgroup jobs on the Host Detail page)
+        <FlexItem align={{ default: 'alignRight' }}>
+          <Pagination
+            itemCount={totalCount}
+            page={pagination.page}
+            perPage={pagination.perPage}
+            onSetPage={handlePageSelected}
+            onPerPageSelect={handlePerPageSelected}
+            perPageOptions={perPageOptions}
+            variant="top"
+          />
+        </FlexItem>
+      </Flex>
+      <TableComposable variant="compact">
+        <Thead>
+          <Tr>
+            {columns.map(col => (
+              <Th key={col}>{col}</Th>
+            ))}
+          </Tr>
+        </Thead>
+        <Tbody>
+          {jobs.map(job => (
+            <Tr key={job.id}>
+              <Td>
+                <a
+                  onClick={() =>
+                    window.tfm.nav.pushUrl(
+                      `/job_invocations/${decodeId(job.id)}`
+                    )
+                  }
+                >
+                  {job.description}
+                </a>
+              </Td>
+              <Td>{job.task.result}</Td>
+              <Td>{job.task.state}</Td>
+              <Td>
+                <RelativeDateTime date={job.startAt} />
+              </Td>
+              <Td>{readableCron(job.recurringLogic.cronLine)}</Td>
+            </Tr>
+          ))}
+        </Tbody>
+      </TableComposable>
+    </React.Fragment>
+  );
+};
+
+PreviousJobsTable.propTypes = {
+  jobs: PropTypes.array.isRequired,
+  history: PropTypes.object.isRequired,
+  totalCount: PropTypes.number.isRequired,
+  pagination: PropTypes.object.isRequired,
+};
+
+export default withLoading(PreviousJobsTable);

data/webpack/components/AnsibleHostDetail/components/RolesTab/AllRolesModal/AllRolesTable.js

@@ -15,7 +15,7 @@ import Pagination from 'foremanReact/components/Pagination';
 import withLoading from '../../../../withLoading';
 
 const AllRolesTable = ({ allAnsibleRoles, totalCount }) => {
-  const columns = [__('Name'), __('Source')];
+  const columns = [__('Name'), __('Variables'), __('Source')];
 
   return (
     <React.Fragment>
@@ -37,6 +37,16 @@ const AllRolesTable = ({ allAnsibleRoles, totalCount }) => {
               <Tr key={`${role.id}-all`} id={role.id}>
                 <Td />
                 <Td>{role.name}</Td>
+                <Td>
+                  <a
+                    href={`/ansible/ansible_variables?search=ansible_role=${role.name}`}
+                    target="_blank"
+                    rel="noreferrer"
+                  >
+                    {role.ansibleVariables.totalCount}
+                  </a>
+                </Td>
+
                 <Td>
                   {role.inherited
                     ? __('Inherited from Hostgroup')

data/webpack/components/AnsibleHostDetail/components/RolesTab/EditRolesModal/EditRolesForm.js

@@ -1,7 +1,7 @@
 import React, { useState } from 'react';
 import { translate as __ } from 'foremanReact/common/I18n';
 import PropTypes from 'prop-types';
-import { isEqual } from 'lodash';
+
 import { useMutation } from '@apollo/client';
 
 import { Button, Modal, Spinner } from '@patternfly/react-core';
@@ -21,10 +21,12 @@ const EditRolesForm = props => {
     actions,
   } = props;
 
-  const initAvailableOpt = availableRoles.map(item => item.name);
-  const initChosenOpt = assignedRoles.map(item => item.name);
-  const [availableOptions, setAvailableOptions] = useState(initAvailableOpt);
-  const [chosenOptions, setChosenOptions] = useState(initChosenOpt);
+  const [availableOptions, setAvailableOptions] = useState(
+    availableRoles.map(item => item.name)
+  );
+  const [chosenOptions, setChosenOptions] = useState(
+    assignedRoles.map(item => item.name)
+  );
 
   const onListChange = (nextAvailable, nextChosen) => {
     setAvailableOptions(nextAvailable);
@@ -43,16 +45,12 @@ const EditRolesForm = props => {
     ansibleRoleIds: roleNamesToIds(allRoles, chosenOptions),
   };
 
-  const didNotModifyOptions = () =>
-    isEqual(initAvailableOpt.sort(), availableOptions.sort()) &&
-    isEqual(initChosenOpt, chosenOptions); // The order of the chosen options is important.
-
   const formActions = [
     <Button
       key="confirm"
       variant="primary"
       onClick={() => callMutation({ variables })}
-      isDisabled={loading || didNotModifyOptions()}
+      isDisabled={loading}
       aria-label="submit ansible roles"
     >
       {__('Confirm')}

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

@@ -20,7 +20,7 @@ const EditRolesModal = ({
   canEditHost,
 }) => {
   const baseModalProps = {
-    width: '50%',
+    width: '70%',
     isOpen,
     className: 'foreman-modal',
     showClose: false,

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

@@ -27,7 +27,7 @@ const RolesTable = ({
   hostGlobalId,
   canEditHost,
 }) => {
-  const columns = [__('Name')];
+  const columns = [__('Name'), __('Variables')];
 
   const editBtn = canEditHost ? (
     <FlexItem>
@@ -72,6 +72,15 @@ const RolesTable = ({
                   <Td>
                     <a href={role.path}>{role.name}</a>
                   </Td>
+                  <Td>
+                    <a
+                      href={`/ansible/ansible_variables?search=ansible_role=${role.name}`}
+                      target="_blank"
+                      rel="noreferrer"
+                    >
+                      {role.ansibleVariables.totalCount}
+                    </a>
+                  </Td>
                 </Tr>
               ))}
             </Tbody>

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

@@ -21,8 +21,7 @@ import {
   assignRolesErrorMock,
 } from './RolesTab.fixtures';
 
-jest.mock('axios');
-const TestComponent = withRedux(withReactRouter(withMockedProvider(RolesTab)));
+const TestComponent = withReactRouter(withRedux(withMockedProvider(RolesTab)));
 
 describe('assigning Ansible roles', () => {
   it('should assign Ansible roles', async () => {

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

@@ -35,6 +35,9 @@ const role1 = {
   id: 'MDE6QW5zaWJsZVJvbGUtMw==',
   name: 'aardvaark.cube',
   path: '/ansible/ansible_roles/search="name = aardvaark.cube"',
+  ansibleVariables: {
+    totalCount: 1,
+  },
 };
 
 const role2 = {
@@ -42,6 +45,9 @@ const role2 = {
   id: 'MDE6QW5zaWJsZVJvbGUtNQ==',
   name: 'aardvaark.sphere',
   path: '/ansible/ansible_roles/search="name = aardvaark.sphere"',
+  ansibleVariables: {
+    totalCount: 2,
+  },
 };
 
 const role3 = {
@@ -49,6 +55,9 @@ const role3 = {
   id: 'MDE6QW5zaWJsZVJvbGUtMzA=',
   name: 'another.role',
   path: '/ansible/ansible_roles/search="name = another.role"',
+  ansibleVariables: {
+    totalCount: 3,
+  },
 };
 
 const role4 = {
@@ -56,6 +65,9 @@ const role4 = {
   id: 'MDE6QW5zaWJsZVJvbGUtMzk=',
   name: 'geerlingguy.ceylon',
   path: '/ansible/ansible_roles/search="name = geerlingguy.ceylon"',
+  ansibleVariables: {
+    totalCount: 4,
+  },
 };
 
 const ansibleRolesMock = {
@@ -77,30 +89,45 @@ const availableRoles = {
       name: 'theforeman.foreman_scap_client',
       path:
         '/ansible/ansible_roles/search="name = theforeman.foreman_scap_client"',
+      ansibleVariables: {
+        totalCount: 23,
+      },
     },
     {
       __typename: 'AnsibleRole',
       id: 'MDE6QW5zaWJsZVJvbGUtMg==',
       name: 'adriagalin.motd',
       path: '/ansible/ansible_roles/search="name = adriagalin.motd"',
+      ansibleVariables: {
+        totalCount: 23,
+      },
     },
     {
       __typename: 'AnsibleRole',
       id: 'MDE6QW5zaWJsZVJvbGUtMjI=',
       name: 'geerlingguy.php',
       path: '/ansible/ansible_roles/search="name = geerlingguy.php"',
+      ansibleVariables: {
+        totalCount: 23,
+      },
     },
     {
       __typename: 'AnsibleRole',
       id: 'MDE6QW5zaWJsZVJvbGUtNTc=',
       name: 'robertdebock.epel',
       path: '/ansible/ansible_roles/search="name = robertdebock.epel"',
+      ansibleVariables: {
+        totalCount: 23,
+      },
     },
     {
       __typename: 'AnsibleRole',
       id: 'MDE6QW5zaWJsZVJvbGUtNTg=',
       name: 'geerlingguy.nfs',
       path: '/ansible/ansible_roles/search="name = geerlingguy.nfs"',
+      ansibleVariables: {
+        totalCount: 23,
+      },
     },
   ],
 };
@@ -118,6 +145,9 @@ export const allRolesMocks = allAnsibleRolesMockFactory(
           name: 'adriagalin.motd',
           path: '/ansible/ansible_roles/search="name = adriagalin.motd"',
           inherited: true,
+          ansibleVariables: {
+            totalCount: 23,
+          },
         },
         { ...role1, inherited: false },
         { ...role2, inherited: false },

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

@@ -6,7 +6,6 @@ import {
   tick,
   withMockedProvider,
   withReactRouter,
-  withRedux,
 } from '../../../../../testHelper';
 
 import {
@@ -19,8 +18,7 @@ import {
 
 import RolesTab from '../';
 
-jest.mock('axios');
-const TestComponent = withRedux(withReactRouter(withMockedProvider(RolesTab)));
+const TestComponent = withReactRouter(withMockedProvider(RolesTab));
 
 describe('RolesTab', () => {
   it('should load Ansible Roles as admin', async () => {

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

@@ -2,10 +2,7 @@ import React, { useState } from 'react';
 import PropTypes from 'prop-types';
 import { useQuery } from '@apollo/client';
 import { Button } from '@patternfly/react-core';
-import { Link, Route } from 'react-router-dom';
 import { translate as __ } from 'foremanReact/common/I18n';
-import { foremanUrl } from 'foremanReact/common/helpers';
-import { useAPI } from 'foremanReact/common/hooks/API/APIHooks';
 
 import ansibleRolesQuery from '../../../../graphql/queries/hostAnsibleRoles.gql';
 import { encodeId } from '../../../../globalIdHelper';
@@ -15,7 +12,6 @@ import {
   useCurrentPagination,
 } from '../../../../helpers/pageParamsHelper';
 import EditRolesModal from './EditRolesModal';
-import AllRolesModal from './AllRolesModal';
 
 const RolesTab = ({ hostId, history, canEditHost }) => {
   const hostGlobalId = encodeId('Host', hostId);
@@ -37,28 +33,9 @@ const RolesTab = ({ hostId, history, canEditHost }) => {
       onClick={() => setAssignModal(true)}
       aria-label="edit ansible roles"
     >
-      {__('Assign roles directly to the host')}
+      {__('Assign Ansible roles')}
     </Button>
   ) : null;
-
-  const url = hostId && foremanUrl(`/api/v2/hosts/${hostId}/ansible_roles`);
-  const { response: allAnsibleRoles } = useAPI('get', url, {
-    key: 'ANSIBLE_ROLES',
-  });
-  const emptyStateDescription = allAnsibleRoles.length > 0 && (
-    <>
-      <Route path="/Ansible/roles/all">
-        <AllRolesModal
-          onClose={() => history.push('/Ansible/roles')}
-          isOpen
-          hostGlobalId={hostGlobalId}
-          history={history}
-        />
-      </Route>
-      <Link to="/Ansible/roles/all">{__('View inherited roles')}</Link>
-    </>
-  );
-
   return (
     <>
       <RolesTable
@@ -69,9 +46,8 @@ const RolesTab = ({ hostId, history, canEditHost }) => {
         history={history}
         hostGlobalId={hostGlobalId}
         emptyStateProps={{
-          header: __('No roles assigned directly to the host'),
+          header: __('No Ansible roles assigned'),
           action: editBtn,
-          description: emptyStateDescription,
         }}
         pagination={pagination}
         canEditHost={canEditHost}

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

@@ -1,6 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { ListView, Tooltip, OverlayTrigger } from 'patternfly-react';
+import { ListView } from 'patternfly-react';
+import { Tooltip } from '@patternfly/react-core';
 import classNames from 'classnames';
 import { translate as __ } from 'foremanReact/common/I18n';
 
@@ -13,12 +14,6 @@ const AnsibleRole = ({ role, icon, onClick, resourceName, index }) => {
       ? __('This Ansible role is inherited from parent host group')
       : __('This Ansible role is inherited from host group');
 
-  const tooltip = (
-    <Tooltip id={role.id}>
-      <span>{text}</span>
-    </Tooltip>
-  );
-
   const clickHandler = (onClickFn, ansibleRole) => event => {
     event.preventDefault();
     onClickFn(ansibleRole);
@@ -48,11 +43,7 @@ const AnsibleRole = ({ role, icon, onClick, resourceName, index }) => {
   );
 
   if (role.inherited) {
-    return (
-      <OverlayTrigger overlay={tooltip} placement="top">
-        {listItem()}
-      </OverlayTrigger>
-    );
+    return <Tooltip content={<span>{text}</span>}>{listItem()}</Tooltip>;
   }
 
   return listItem(clickHandler);

data/webpack/components/AnsibleRolesSwitcher/components/OrderedRolesTooltip.js

@@ -1,22 +1,21 @@
 import React from 'react';
 import { translate as __ } from 'foremanReact/common/I18n';
-import { Tooltip, Icon, OverlayTrigger } from 'patternfly-react';
+import { Tooltip } from '@patternfly/react-core';
+import { InfoCircleIcon } from '@patternfly/react-icons';
 
 const OrderedRolesTooltip = props => {
-  const tooltip = (
-    <Tooltip id="assigned-ansible-roles-tooltip">
-      <span>
-        {__(
-          'Use drag and drop to change order of the roles. Ordering of roles is respected for Ansible runs, inherited roles are always before those assigned directly'
-        )}
-      </span>
-    </Tooltip>
+  const content = (
+    <span>
+      {__(
+        'Use drag and drop to change order of the roles. Ordering of roles is respected for Ansible runs, inherited roles are always before those assigned directly'
+      )}
+    </span>
   );
 
   return (
-    <OverlayTrigger overlay={tooltip} trigger={['hover', 'focus']}>
-      <Icon type="pf" name="info" style={{ 'margin-right': '10px' }} />
-    </OverlayTrigger>
+    <Tooltip content={content}>
+      <InfoCircleIcon style={{ marginRight: '10px' }} />
+    </Tooltip>
   );
 };
 

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

@@ -65,25 +65,11 @@ exports[`AnsibleRole should render a role to remove 1`] = `
 `;
 
 exports[`AnsibleRole should render inherited role to remove 1`] = `
-<OverlayTrigger
-  defaultOverlayShown={false}
-  overlay={
-    <Tooltip
-      bsClass="tooltip"
-      id={5}
-      placement="right"
-    >
-      <span>
-        This Ansible role is inherited from host group
-      </span>
-    </Tooltip>
-  }
-  placement="top"
-  trigger={
-    Array [
-      "hover",
-      "focus",
-    ]
+<Tooltip
+  content={
+    <span>
+      This Ansible role is inherited from host group
+    </span>
   }
 >
   <ListViewItem
@@ -104,5 +90,5 @@ exports[`AnsibleRole should render inherited role to remove 1`] = `
     onExpandClose={[Function]}
     stacked={true}
   />
-</OverlayTrigger>
+</Tooltip>
 `;

data/webpack/graphql/queries/allAnsibleRoles.gql

@@ -7,6 +7,9 @@ query($id: String!, $first: Int, $last: Int){
         id
         name
         inherited
+        ansibleVariables {
+          totalCount
+        }
       }
     }
   }

data/webpack/graphql/queries/hostAnsibleRoles.gql

@@ -9,6 +9,9 @@ query($id: String!, $first: Int, $last: Int) {
         id
         name
         path
+        ansibleVariables {
+          totalCount
+        }
       }
     }
   }

data/webpack/testHelper.js

@@ -1,24 +1,15 @@
 import React from 'react';
 import { Provider } from 'react-redux';
-import thunk from 'redux-thunk';
-import { applyMiddleware, createStore, compose, combineReducers } from 'redux';
 import { MockedProvider } from '@apollo/react-testing';
 import { Router, MemoryRouter } from 'react-router-dom';
 import { createMemoryHistory } from 'history';
 
-import { reducers as apiReducer, APIMiddleware } from 'foremanReact/redux/API';
-import ConfirmModal, {
-  reducers as confirmModalReducers,
-} from 'foremanReact/components/ConfirmModal';
+import store from 'foremanReact/redux';
+import ConfirmModal from 'foremanReact/components/ConfirmModal';
 import { getForemanContext } from 'foremanReact/Root/Context/ForemanContext';
 
-const reducers = combineReducers({ ...apiReducer, ...confirmModalReducers });
-
-export const generateStore = () =>
-  createStore(reducers, compose(applyMiddleware(thunk, APIMiddleware)));
-
 export const withRedux = Component => props => (
-  <Provider store={generateStore()}>
+  <Provider store={store}>
     <Component {...props} />
     <ConfirmModal />
   </Provider>