foreman_ansible 6.3.3 → 7.0.0

data/webpack/components/AnsibleHostDetail/AnsibleHostDetail.js

@@ -0,0 +1,59 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Tabs, Tab, TabTitleText } from '@patternfly/react-core';
+import { useHistory } from 'react-router-dom';
+import SkeletonLoader from 'foremanReact/components/common/SkeletonLoader';
+
+import SecondaryTabRoutes from './components/SecondaryTabRoutes';
+import { SECONDARY_TABS } from './constants';
+import './AnsibleHostDetail.scss';
+
+const AnsibleHostDetail = ({
+  response,
+  status,
+  router,
+  location: { pathname },
+  history,
+}) => {
+  const hashHistory = useHistory();
+  return (
+    <SkeletonLoader status={status} skeletonProps={{ count: 5 }}>
+      {response?.id && (
+        <>
+          <Tabs
+            onSelect={(evt, subTab) => hashHistory.push(subTab)}
+            activeKey={pathname?.split('/')[2]}
+            isSecondary
+          >
+            {SECONDARY_TABS.map(({ key, title }) => (
+              <Tab
+                key={key}
+                eventKey={key}
+                title={<TabTitleText>{title}</TabTitleText>}
+              />
+            ))}
+          </Tabs>
+          <SecondaryTabRoutes
+            response={response}
+            router={router}
+            history={history}
+          />
+        </>
+      )}
+    </SkeletonLoader>
+  );
+};
+
+AnsibleHostDetail.propTypes = {
+  response: PropTypes.object.isRequired,
+  status: PropTypes.string.isRequired,
+  location: PropTypes.object,
+  router: PropTypes.object.isRequired,
+  history: PropTypes.object.isRequired,
+};
+
+AnsibleHostDetail.defaultProps = {
+  location: { pathname: '' },
+};
+
+export default AnsibleHostDetail;

data/webpack/components/AnsibleHostDetail/AnsibleHostDetail.scss

@@ -0,0 +1,6 @@
+@import '~@theforeman/vendor/scss/variables';
+
+.ansible-host-detail {
+  background-color: $pf-color-white;
+  padding: 1.8rem;
+}

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

@@ -0,0 +1,20 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import AnsibleHostDetail from './';
+
+describe('AnsibleHostDetail', () => {
+  it('should show skeleton when loading', () => {
+    const { container } = render(
+      <AnsibleHostDetail
+        status="PENDING"
+        response={{ id: 5, name: 'test.example.com' }}
+        router={{}}
+        history={{}}
+      />
+    );
+    expect(
+      container.getElementsByClassName('react-loading-skeleton')
+    ).toHaveLength(5);
+  });
+});

data/webpack/components/AnsibleHostDetail/components/AnsibleHostInventory/AnsibleHostInventory.js

@@ -0,0 +1,22 @@
+import React from 'react';
+import Immutable from 'seamless-immutable';
+import PropTypes from 'prop-types';
+import './AnsibleHostInventory.scss';
+import ReportJsonViewer from '../../../ReportJsonViewer';
+
+const AnsibleHostInventory = ({ inventoryData }) => {
+  const mutableInventory =
+    inventoryData && Immutable.asMutable(inventoryData, { deep: true });
+
+  return (
+    <div className="ansible-host-inventory">
+      <ReportJsonViewer data={mutableInventory} />
+    </div>
+  );
+};
+
+AnsibleHostInventory.propTypes = {
+  inventoryData: PropTypes.object.isRequired,
+};
+
+export default AnsibleHostInventory;

data/webpack/components/AnsibleHostDetail/components/AnsibleHostInventory/AnsibleHostInventory.scss

@@ -0,0 +1,4 @@
+
+.ansible-host-inventory {
+  padding: 1.8rem;
+}

data/webpack/components/AnsibleHostDetail/components/AnsibleHostInventory/AnsibleHostInventory.test.js

@@ -0,0 +1,104 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import AnsibleHostInventory from './AnsibleHostInventory';
+
+const inventoryData = {
+  all: {
+    hosts: ['jim-dorsay.tlv.redhat.com'],
+    vars: {},
+  },
+  _meta: {
+    hostvars: {
+      'jim-dorsay.tlv.redhat.com': {
+        foreman: {
+          hostname: 'jim-dorsay',
+          fqdn: 'jim-dorsay.tlv.redhat.com',
+          hostgroup: 'libvirt',
+          foreman_subnets: [
+            {
+              name: 'subnet',
+              network: '192.168.122.0',
+              mask: '255.255.255.0',
+              gateway: '',
+              dns_primary: '',
+              dns_secondary: '',
+              from: '',
+              to: '',
+              boot_mode: 'DHCP',
+              ipam: 'DHCP',
+              vlanid: null,
+              mtu: 1500,
+              nic_delay: null,
+              network_type: 'IPv4',
+              description: '',
+            },
+          ],
+          foreman_interfaces: [
+            {
+              ip: '192.168.122.139',
+              ip6: '',
+              mac: '52:54:00:bd:01:0d',
+              name: 'jim-dorsay.tlv.redhat.com',
+              attrs: {},
+              virtual: false,
+              link: true,
+              identifier: '',
+              managed: true,
+              primary: true,
+              provision: true,
+              subnet: {},
+              subnet6: null,
+              tag: null,
+              attached_to: null,
+              type: 'Interface',
+            },
+          ],
+          location: 'Default Location',
+          location_title: 'Default Location',
+          organization: 'Default Organization',
+          organization_title: 'Default Organization',
+          domainname: 'tlv.redhat.com',
+          foreman_domain_description: '',
+          owner_name: 'Admin User',
+          owner_email: 'root@localdomain',
+          ssh_authorized_keys: [],
+          foreman_users: {
+            admin: {
+              firstname: 'Admin',
+              lastname: 'User',
+              mail: 'root@localdomain',
+              description: '',
+              fullname: 'Admin User',
+              name: 'admin',
+              ssh_authorized_keys: [],
+            },
+          },
+          root_pw:
+            '$5$I6cmWY8Uy4NaTfqW$wkKsQzinnd2iNTHvYPYPxO/YkHlvT/sgVF1n6paZvd8',
+          foreman_config_groups: [],
+          puppetmaster: '',
+        },
+        foreman_ansible_roles: ['foreman_ansible_test'],
+        ansible_roles_check_mode: false,
+        host_packages: '',
+        host_registration_insights: false,
+        host_registration_remote_execution: true,
+        remote_execution_ssh_keys: [
+          'ssh-rsa AAAAB3NzaC1yc2EAAAADAQABAAABgQC6ERZ9H22Di8mHRcxoTyIc+kcKCpGYq6G4/Ub9WK+DZlZZNMXCcO0WydV9GyJX9eIGrStDxZvxtJQQoOvYRS8d92RZPy3wIR4GtingmVNpwehNePHAcF1Aj9nqm+A4V49R3PqC28ctzBaJAbrvnNh/xDCsTW/ogexu8yN4iKkt0ZijUTnAZ2w1dXit23iITm0I8NPYqxRFNQOYtLYBZDKX+rPanjkyYGEyvi/RkhhHOimMjhAR0Qo9Vqm438LZWrZzGAffiE3AVYBWd3Eh2B5nW1q4cmS7CYOfsQCmO9u9x9lFzZCfdIFVWBhSyqR7cw/M7rTmixUNoX3QvSM0A+z/pBx++SgB+LhV2Zmek68NvcG/9LElD3pVESyvqtRbQQtb7Y6e553QUBn4lOg/N/p67TzfySCm0QhU5dKyj52Bvg6yhrwvqbVw1lwpjf6CNLERcRsTomIUDLVzDdcxo+u5GZ2J/hi5xH7NNMT89oPErwChm8wUDQyAdKGntCFP4D8= yifatfanimakias@localhost.localdomain',
+        ],
+        remote_execution_ssh_user: 'root',
+        remote_execution_effective_user_method: 'sudo',
+        remote_execution_connect_by_ip: false,
+      },
+    },
+  },
+};
+
+describe('AnsibleHostInventory', () => {
+  it('should show inventory', () => {
+    render(<AnsibleHostInventory inventoryData={inventoryData} />);
+    expect(screen.getByText('_meta:')).toBeInTheDocument();
+    expect(screen.getByText('all:')).toBeInTheDocument();
+  });
+});

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

@@ -0,0 +1,38 @@
+import React, { useMemo } from 'react';
+import { foremanUrl } from 'foremanReact/common/helpers';
+import { useAPI } from 'foremanReact/common/hooks/API/APIHooks';
+import Skeleton from 'react-loading-skeleton';
+import { STATUS } from 'foremanReact/constants';
+
+import PropTypes from 'prop-types';
+import AnsibleHostInventory from './AnsibleHostInventory';
+import ErrorState from '../../../ErrorState';
+
+const WrappedAnsibleHostInventory = ({ hostId }) => {
+  const params = useMemo(() => ({ params: { host_ids: [hostId] } }), [hostId]);
+
+  const url = hostId && foremanUrl('/ansible/api/ansible_inventories/hosts');
+  const { response: inventory, status } = useAPI('get', url, params);
+
+  if (status === STATUS.PENDING) {
+    return <Skeleton count={5} />;
+  }
+
+  if (status === STATUS.ERROR) {
+    return (
+      <ErrorState description={inventory?.response?.data?.error?.message} />
+    );
+  }
+
+  return <AnsibleHostInventory inventoryData={inventory} />;
+};
+
+WrappedAnsibleHostInventory.propTypes = {
+  hostId: PropTypes.number,
+};
+
+WrappedAnsibleHostInventory.defaultProps = {
+  hostId: undefined,
+};
+
+export default WrappedAnsibleHostInventory;

data/webpack/components/AnsibleHostDetail/components/AnsibleVariableOverrides/AnsibleVariableOverrides.scss

@@ -0,0 +1,3 @@
+.ansible-tab-margin {
+  margin: 1.8rem 1rem;
+}

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

@@ -0,0 +1,238 @@
+import React, { useReducer } from 'react';
+import PropTypes from 'prop-types';
+import { useDispatch } from 'react-redux';
+import { useMutation } from '@apollo/client';
+
+import { sprintf, translate as __ } from 'foremanReact/common/I18n';
+import { usePaginationOptions } from 'foremanReact/components/Pagination/PaginationHooks';
+import { openConfirmModal } from 'foremanReact/components/ConfirmModal';
+import {
+  TableComposable,
+  Thead,
+  Tbody,
+  Tr,
+  Th,
+  Td,
+} from '@patternfly/react-table';
+import { Flex, FlexItem, Pagination } from '@patternfly/react-core';
+
+import deleteAnsibleVariableOverride from '../../../../graphql/mutations/deleteAnsibleVariableOverride.gql';
+import EditableAction from './EditableAction';
+import EditableValue from './EditableValue';
+import { decodeModelId } from '../../../../globalIdHelper';
+import {
+  formatSourceAttr,
+  findOverride,
+  validateValue,
+  onCompleted,
+  onError,
+} from './AnsibleVariableOverridesTableHelper';
+
+import withLoading from '../../../withLoading';
+import {
+  preparePerPageOptions,
+  refreshPage,
+} from '../../../../helpers/paginationHelper';
+
+const reducer = (state, action) =>
+  state.map((item, index) => {
+    if (action.idx === index) {
+      return { ...item, ...action.payload };
+    }
+    return item;
+  });
+
+const initState = vars =>
+  vars.map((variable, idx) => ({
+    open: false,
+    value: variable.currentValue
+      ? variable.currentValue.value
+      : variable.defaultValue,
+    validation: { key: 'noval', msg: '' },
+    working: false,
+  }));
+
+const AnsibleVariableOverridesTable = ({
+  variables,
+  hostAttrs,
+  hostId,
+  hostGlobalId,
+  totalCount,
+  pagination,
+  history,
+}) => {
+  const columns = [
+    __('Name'),
+    __('Ansible Role'),
+    __('Type'),
+    __('Value'),
+    __('Source attribute'),
+  ];
+
+  const handlePerPageSelected = (event, perPage) => {
+    refreshPage(history, { page: 1, perPage });
+  };
+
+  const handlePageSelected = (event, page) => {
+    refreshPage(history, { ...pagination, page });
+  };
+
+  const perPageOptions = preparePerPageOptions(usePaginationOptions());
+
+  const [editableState, innerDispatch] = useReducer(
+    reducer,
+    variables,
+    initState
+  );
+
+  const toggleWorking = idx => flag => {
+    innerDispatch({ idx, payload: { working: flag } });
+  };
+
+  const setEditable = (idx, flag) => () => {
+    innerDispatch({ idx, payload: { open: flag } });
+  };
+
+  const onValueChange = (idx, variable) => value => {
+    const payload = {
+      value,
+      validation: validateValue(variable, value),
+    };
+    innerDispatch({ idx, payload });
+  };
+
+  const onSubmitSuccess = (idx, variable) => newValue => {
+    innerDispatch({
+      idx,
+      payload: {
+        open: false,
+        working: false,
+        value: newValue,
+        validation: validateValue(variable, newValue),
+      },
+    });
+  };
+
+  const onValidationError = idx => error => {
+    innerDispatch({
+      idx,
+      payload: {
+        working: false,
+        validation: { key: 'error', msg: error },
+      },
+    });
+  };
+
+  const dispatch = useDispatch();
+  const [callMutation] = useMutation(deleteAnsibleVariableOverride);
+
+  const deleteAction = (variable, idx) => ({
+    title: __('Delete'),
+    onClick: () => {
+      dispatch(
+        openConfirmModal({
+          title: __('Delete Ansible Variable Override'),
+          message:
+            variable &&
+            sprintf(
+              __('Are you sure you want to delete override for %s?'),
+              variable.key
+            ),
+          onConfirm: () => {
+            callMutation({
+              variables: {
+                id: findOverride(variable, hostAttrs.name).id,
+                hostId,
+                variableId: decodeModelId(variable),
+              },
+            }).then(onCompleted(onValueChange(idx, variable)), onError); // eslint-disable-line
+          },
+        })
+      );
+    },
+  });
+
+  const actionsResolver = (variable, idx) => {
+    const actions = [];
+    if (variable.currentValue?.element === 'fqdn' && variable.meta.canEdit) {
+      actions.push(deleteAction(variable, idx));
+    }
+    return actions;
+  };
+
+  return (
+    <React.Fragment>
+      <Flex>
+        <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>
+            ))}
+            <Th />
+          </Tr>
+        </Thead>
+        <Tbody>
+          {variables.map((variable, idx) => (
+            <Tr key={idx}>
+              <Td>{variable.key}</Td>
+              <Td>{variable.ansibleRoleName}</Td>
+              <Td>{variable.parameterType}</Td>
+              <Td>
+                <EditableValue
+                  variable={variable}
+                  editing={editableState[idx].open}
+                  onChange={onValueChange(idx, variable)}
+                  value={editableState[idx].value}
+                  validation={editableState[idx].validation}
+                  working={editableState[idx].working}
+                />
+              </Td>
+              <Td>{formatSourceAttr(variable)}</Td>
+              <Td>
+                <EditableAction
+                  open={editableState[idx].open}
+                  onClose={setEditable(idx, false)}
+                  onOpen={setEditable(idx, true)}
+                  toggleWorking={toggleWorking(idx)}
+                  variable={variable}
+                  state={editableState[idx]}
+                  hostId={hostId}
+                  hostName={hostAttrs.name}
+                  hostGlobalId={hostGlobalId}
+                  onSubmitSuccess={onSubmitSuccess(idx, variable)}
+                  onValidationError={onValidationError(idx)}
+                />
+              </Td>
+              <Td actions={{ items: actionsResolver(variable, idx) }} />
+            </Tr>
+          ))}
+        </Tbody>
+      </TableComposable>
+    </React.Fragment>
+  );
+};
+
+AnsibleVariableOverridesTable.propTypes = {
+  variables: PropTypes.array.isRequired,
+  hostAttrs: PropTypes.object.isRequired,
+  hostId: PropTypes.number.isRequired,
+  hostGlobalId: PropTypes.string.isRequired,
+  totalCount: PropTypes.number.isRequired,
+  pagination: PropTypes.object.isRequired,
+  history: PropTypes.object.isRequired,
+};
+
+export default withLoading(AnsibleVariableOverridesTable);

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

@@ -0,0 +1,111 @@
+import React from 'react';
+import { TimesIcon, CheckIcon } from '@patternfly/react-icons';
+import { sprintf, translate as __ } from 'foremanReact/common/I18n';
+
+import { showToast } from '../../../../toastHelper';
+
+const formatSourceLink = currentValue =>
+  `${__(currentValue.element)}: ${currentValue.elementName}`;
+
+export const formatSourceAttr = variable =>
+  variable.currentValue
+    ? formatSourceLink(variable.currentValue)
+    : __('Default value');
+
+export const formatValue = variable => {
+  const value = variable.currentValue
+    ? variable.currentValue.value
+    : variable.defaultValue;
+
+  switch (variable.parameterType) {
+    case 'boolean':
+      return value ? <CheckIcon /> : <TimesIcon />;
+    case 'yaml':
+    case 'hash':
+    case 'array':
+      return JSON.stringify(value);
+    default:
+      return value;
+  }
+};
+
+const joinErrors = errors => errors.map(err => err.message).join(', ');
+
+export const onCompleted = onSubmitSuccess => response => {
+  const {
+    errors,
+    overridenAnsibleVariable,
+  } = response.data.deleteAnsibleVariableOverride;
+  if (Array.isArray(errors) && errors.length > 0) {
+    showToast({
+      type: 'error',
+      message: formatError(joinErrors(errors)),
+    });
+  } else {
+    onSubmitSuccess(overridenAnsibleVariable.currentValue.value);
+    showToast({
+      type: 'success',
+      message: __('Ansible variable override was successfully deleted.'),
+    });
+  }
+};
+
+export const findOverride = (variable, hostname) =>
+  variable.lookupValues.nodes.find(
+    item =>
+      item.value === variable.currentValue.value &&
+      item.match === `fqdn=${hostname}`
+  );
+
+const formatError = error =>
+  sprintf(
+    __(
+      'There was a following error when deleting Ansible variable override: %s'
+    ),
+    error
+  );
+
+export const onError = response => {
+  showToast({ type: 'error', message: formatError(response.error) });
+};
+
+const validationSuccess = { key: 'success', msg: '' };
+
+const validateRegexp = (variable, value) => {
+  if (new RegExp(variable.validatorRule).test(value)) {
+    return validationSuccess;
+  }
+  return {
+    key: 'error',
+    msg: sprintf(
+      __('Invalid, expected to match a regex: %s'),
+      variable.validatorRule
+    ),
+  };
+};
+
+const validateList = (variable, value) => {
+  if (variable.validatorRule.split(',').find(item => item.trim() === value)) {
+    return validationSuccess;
+  }
+  return {
+    key: 'error',
+    msg: sprintf(__('Invalid, expected one of: %s'), variable.validatorRule),
+  };
+};
+
+export const validateValue = (variable, value) => {
+  if (variable.required && !value) {
+    return { key: 'error', msg: __('is required') };
+  }
+
+  if (variable.validatorType === 'regexp') {
+    return validateRegexp(variable, value);
+  }
+
+  if (variable.validatorType === 'list') {
+    return validateList(variable, value);
+  }
+
+  return { key: 'noval', msg: '' };
+};