foreman_ansible 7.0.4 → 8.0.1

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

@@ -1,7 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { translate as __ } from 'foremanReact/common/I18n';
-import { usePaginationOptions } from 'foremanReact/components/Pagination/PaginationHooks';
 
 import {
   TableComposable,
@@ -11,70 +10,60 @@ import {
   Th,
   Td,
 } from '@patternfly/react-table';
-
-import { Flex, FlexItem, Pagination } from '@patternfly/react-core';
+import { Flex, FlexItem } from '@patternfly/react-core';
+import Pagination from 'foremanReact/components/Pagination';
 import withLoading from '../../../../withLoading';
-import {
-  preparePerPageOptions,
-  refreshPage,
-} from '../../../../../helpers/paginationHelper';
-
-const AllRolesTable = ({
-  allAnsibleRoles,
-  totalCount,
-  pagination,
-  history,
-}) => {
-  const columns = [__('Name'), __('Source')];
 
-  const handlePerPageSelected = (event, allPerPage) => {
-    refreshPage(history, { allPage: 1, allPerPage });
-  };
-
-  const handlePageSelected = (event, allPage) => {
-    refreshPage(history, { ...pagination, allPage });
-  };
-
-  const perPageOptions = preparePerPageOptions(usePaginationOptions());
+const AllRolesTable = ({ allAnsibleRoles, totalCount }) => {
+  const columns = [__('Name'), __('Variables'), __('Source')];
 
   return (
     <React.Fragment>
-      <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>
+        <TableComposable variant="compact">
+          <Thead>
+            <Tr>
+              <Th />
+              {columns.map(col => (
+                <Th key={`${col}-all`}>{col}</Th>
+              ))}
+            </Tr>
+          </Thead>
+          <Tbody>
+            {allAnsibleRoles.map(role => (
+              <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')
+                    : __('Directly assigned to Host')}
+                </Td>
+              </Tr>
+            ))}
+          </Tbody>
+        </TableComposable>
         <FlexItem align={{ default: 'alignRight' }}>
           <Pagination
+            updateParamsByUrl
             itemCount={totalCount}
-            page={pagination.allPage}
-            perPage={pagination.allPerPage}
-            onSetPage={handlePageSelected}
-            onPerPageSelect={handlePerPageSelected}
-            perPageOptions={perPageOptions}
-            variant="top"
+            variant="bottom"
           />
         </FlexItem>
       </Flex>
-      <TableComposable variant="compact">
-        <Thead>
-          <Tr>
-            <Th />
-            {columns.map(col => (
-              <Th key={`${col}-all`}>{col}</Th>
-            ))}
-          </Tr>
-        </Thead>
-        <Tbody>
-          {allAnsibleRoles.map(role => (
-            <Tr key={`${role.id}-all`} id={role.id}>
-              <Td />
-              <Td>{role.name}</Td>
-              <Td>
-                {role.inherited
-                  ? __('Inherited from Hostgroup')
-                  : __('Directly assigned to Host')}
-              </Td>
-            </Tr>
-          ))}
-        </Tbody>
-      </TableComposable>
     </React.Fragment>
   );
 };
@@ -82,8 +71,6 @@ const AllRolesTable = ({
 AllRolesTable.propTypes = {
   allAnsibleRoles: PropTypes.array.isRequired,
   totalCount: PropTypes.number.isRequired,
-  pagination: PropTypes.object.isRequired,
-  history: PropTypes.object.isRequired,
 };
 
 export default withLoading(AllRolesTable);

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

@@ -27,7 +27,7 @@ const AllRolesModal = ({ hostGlobalId, onClose, history }) => {
     ),
   };
 
-  const paginationKeys = { page: 'allPage', perPage: 'allPerPage' };
+  const paginationKeys = { page: 'page', perPage: 'per_page' };
 
   const wrapper = child => <Modal {...baseModalProps}>{child}</Modal>;
 

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

@@ -1,7 +1,7 @@
-import React, { useState, useEffect } from 'react';
+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,17 +21,15 @@ const EditRolesForm = props => {
     actions,
   } = props;
 
-  const [formState, setFormState] = useState({
-    availableOptions: [],
-    chosenOptions: [],
-  });
+  const initAvailableOpt = availableRoles.map(item => item.name);
+  const initChosenOpt = assignedRoles.map(item => item.name);
+  const [availableOptions, setAvailableOptions] = useState(initAvailableOpt);
+  const [chosenOptions, setChosenOptions] = useState(initChosenOpt);
 
-  useEffect(() => {
-    setFormState({
-      availableOptions: availableRoles.map(item => item.name),
-      chosenOptions: assignedRoles.map(item => item.name) || [],
-    });
-  }, [availableRoles, assignedRoles]);
+  const onListChange = (nextAvailable, nextChosen) => {
+    setAvailableOptions(nextAvailable);
+    setChosenOptions(nextChosen);
+  };
 
   const [callMutation, { loading }] = useMutation(assignAnsibleRoles, {
     onCompleted: onCompleted(closeModal),
@@ -42,15 +40,19 @@ const EditRolesForm = props => {
 
   const variables = {
     id: encodeId('Host', hostId),
-    ansibleRoleIds: roleNamesToIds(allRoles, formState.chosenOptions),
+    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}
+      isDisabled={loading || didNotModifyOptions()}
       aria-label="submit ansible roles"
     >
       {__('Confirm')}
@@ -65,14 +67,9 @@ const EditRolesForm = props => {
   return (
     <Modal {...baseModalProps} actions={formActions}>
       <DualList
-        availableOptions={formState.availableOptions}
-        chosenOptions={formState.chosenOptions}
-        onListChange={(newAvailable, newChosen) =>
-          setFormState({
-            availableOptions: newAvailable,
-            chosenOptions: newChosen,
-          })
-        }
+        availableOptions={availableOptions}
+        chosenOptions={chosenOptions}
+        onListChange={onListChange}
       />
     </Modal>
   );
@@ -80,11 +77,16 @@ const EditRolesForm = props => {
 
 EditRolesForm.propTypes = {
   closeModal: PropTypes.func.isRequired,
-  assignedRoles: PropTypes.array.isRequired,
-  availableRoles: PropTypes.array.isRequired,
+  assignedRoles: PropTypes.array,
+  availableRoles: PropTypes.array,
   actions: PropTypes.array.isRequired,
   hostId: PropTypes.number.isRequired,
   baseModalProps: PropTypes.object.isRequired,
 };
 
+EditRolesForm.defaultProps = {
+  assignedRoles: [],
+  availableRoles: [],
+};
+
 export default withLoading(EditRolesForm);

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

@@ -20,7 +20,7 @@ const EditRolesModal = ({
   canEditHost,
 }) => {
   const baseModalProps = {
-    width: '70%',
+    width: '50%',
     isOpen,
     className: 'foreman-modal',
     showClose: false,
@@ -54,6 +54,7 @@ const EditRolesModal = ({
 
   const renameData = data => ({
     availableRoles: data.host.availableAnsibleRoles.nodes,
+    assignedRoles,
   });
 
   return (
@@ -64,7 +65,7 @@ const EditRolesModal = ({
       baseModalProps={baseModalProps}
       fetchFn={useFetchFn}
       renameData={renameData}
-      renamedDataPath="availableRoles"
+      renamedDataPath="availableRoles.assignedRoles"
       assignedRoles={assignedRoles}
       closeModal={closeModal}
       hostId={hostId}

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

@@ -2,7 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { translate as __ } from 'foremanReact/common/I18n';
 import { Route, Link } from 'react-router-dom';
-import { usePaginationOptions } from 'foremanReact/components/Pagination/PaginationHooks';
+import Pagination from 'foremanReact/components/Pagination';
 
 import {
   TableComposable,
@@ -12,37 +12,22 @@ import {
   Th,
   Td,
 } from '@patternfly/react-table';
-import { Flex, FlexItem, Button, Pagination } from '@patternfly/react-core';
+import { Flex, FlexItem, Button } from '@patternfly/react-core';
 
 import EditRolesModal from './EditRolesModal';
 
 import withLoading from '../../../withLoading';
 import AllRolesModal from './AllRolesModal';
-import {
-  preparePerPageOptions,
-  refreshPage,
-} from '../../../../helpers/paginationHelper';
 
 const RolesTable = ({
   totalCount,
-  pagination,
   history,
   ansibleRoles,
   hostId,
   hostGlobalId,
   canEditHost,
 }) => {
-  const columns = [__('Name')];
-
-  const handlePerPageSelected = (event, perPage) => {
-    refreshPage(history, { page: 1, perPage });
-  };
-
-  const handlePageSelected = (event, page) => {
-    refreshPage(history, { ...pagination, page });
-  };
-
-  const perPageOptions = preparePerPageOptions(usePaginationOptions());
+  const columns = [__('Name'), __('Variables')];
 
   const editBtn = canEditHost ? (
     <FlexItem>
@@ -67,36 +52,48 @@ const RolesTable = ({
       </Flex>
       <Flex>
         <FlexItem>{editBtn}</FlexItem>
+        <FlexItem align={{ default: 'alignRight' }}>
+          <Pagination updateParamsByUrl itemCount={totalCount} variant="top" />
+        </FlexItem>
+      </Flex>
+      <Flex direction={{ default: 'column' }}>
+        <FlexItem>
+          <TableComposable variant="compact">
+            <Thead>
+              <Tr>
+                {columns.map(col => (
+                  <Th key={col}>{col}</Th>
+                ))}
+              </Tr>
+            </Thead>
+            <Tbody>
+              {ansibleRoles.map(role => (
+                <Tr key={role.id}>
+                  <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>
+          </TableComposable>
+        </FlexItem>
         <FlexItem align={{ default: 'alignRight' }}>
           <Pagination
+            updateParamsByUrl
             itemCount={totalCount}
-            page={pagination.page}
-            perPage={pagination.perPage}
-            onSetPage={handlePageSelected}
-            onPerPageSelect={handlePerPageSelected}
-            perPageOptions={perPageOptions}
-            variant="top"
+            variant="bottom"
           />
         </FlexItem>
       </Flex>
-      <TableComposable variant="compact">
-        <Thead>
-          <Tr>
-            {columns.map(col => (
-              <Th key={col}>{col}</Th>
-            ))}
-          </Tr>
-        </Thead>
-        <Tbody>
-          {ansibleRoles.map(role => (
-            <Tr key={role.id}>
-              <Td>
-                <a href={role.path}>{role.name}</a>
-              </Td>
-            </Tr>
-          ))}
-        </Tbody>
-      </TableComposable>
       <Route path="/Ansible/roles/edit">
         <EditRolesModal
           closeModal={() => history.goBack()}
@@ -123,7 +120,6 @@ RolesTable.propTypes = {
   hostId: PropTypes.number.isRequired,
   hostGlobalId: PropTypes.string.isRequired,
   history: PropTypes.object.isRequired,
-  pagination: PropTypes.object.isRequired,
   totalCount: PropTypes.number.isRequired,
   canEditHost: PropTypes.bool.isRequired,
 };

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 },