foreman_remote_execution 4.5.0 → 4.5.4

data/webpack/JobWizard/JobWizard.scss

@@ -10,5 +10,44 @@
     .advanced-fields-title {
       margin-bottom: 10px;
     }
+    #advanced-fields-job-template {
+      .foreman-search-field {
+        // Giving pf3 search bar a pf4 look
+        .search-bar {
+          display: block;
+        }
+        .input-group-btn {
+          display: none;
+        }
+        li {
+          font-size: 16px;
+        }
+        input {
+          font-size: 16px;
+          height: 36px;
+        }
+        .foreman-autocomplete .autocomplete-focus-shortcut {
+          top: 8px;
+          font-size: 16px;
+        }
+        .foreman-autocomplete .autocomplete-aux {
+          top: 8px;
+          font-size: 16px;
+          .autocomplete-clear-button {
+            font-size: 16px;
+          }
+        }
+      }
+    }
+  }
+
+  .schedule-tab {
+    input[type='radio'],
+    input[type='checkbox'] {
+      margin: 0;
+    }
+    .advanced-scheduling-button {
+      text-align: start;
+    }
   }
 }

data/webpack/JobWizard/JobWizardConstants.js

@@ -1,6 +1,16 @@
+import { translate as __ } from 'foremanReact/common/I18n';
 import { foremanUrl } from 'foremanReact/common/helpers';
 
 export const JOB_TEMPLATES = 'JOB_TEMPLATES';
 export const JOB_CATEGORIES = 'JOB_CATEGORIES';
 export const JOB_TEMPLATE = 'JOB_TEMPLATE';
 export const templatesUrl = foremanUrl('/api/v2/job_templates');
+
+export const repeatTypes = {
+  noRepeat: __('Does not repeat'),
+  cronline: __('Cronline'),
+  monthly: __('Monthly'),
+  weekly: __('Weekly'),
+  daily: __('Daily'),
+  hourly: __('Hourly'),
+};

data/webpack/JobWizard/JobWizardSelectors.js

@@ -36,3 +36,12 @@ export const selectTemplateError = state =>
 
 export const selectJobTemplate = state =>
   selectAPIResponse(state, JOB_TEMPLATE);
+
+export const selectEffectiveUser = state =>
+  selectAPIResponse(state, JOB_TEMPLATE).effective_user;
+
+export const selectAdvancedTemplateInputs = state =>
+  selectAPIResponse(state, JOB_TEMPLATE).advanced_template_inputs || [];
+
+export const selectTemplateInputs = state =>
+  selectAPIResponse(state, JOB_TEMPLATE).template_inputs || [];

data/webpack/JobWizard/__tests__/fixtures.js

@@ -1,6 +1,8 @@
-const jobTemplate = {
+import configureMockStore from 'redux-mock-store';
+
+export const jobTemplate = {
   id: 178,
-  name: 'Run Command - Ansible Default',
+  name: 'template1',
   template:
     "---\n- hosts: all\n  tasks:\n    - shell:\n        cmd: |\n<%=       indent(10) { input('command') } %>\n      register: out\n    - debug: var=out",
   snippet: false,
@@ -23,4 +25,104 @@ export const jobTemplateResponse = {
     overridable: true,
     current_user: false,
   },
+  advanced_template_inputs: [
+    {
+      name: 'adv plain hidden',
+      required: true,
+      input_type: 'user',
+      description: 'some Description',
+      advanced: true,
+      value_type: 'plain',
+      resource_type: 'ansible_roles',
+      default: 'Default val',
+      hidden_value: true,
+    },
+    {
+      name: 'adv plain select',
+      required: false,
+      input_type: 'user',
+      options: 'option 1\r\noption 2\r\noption 3\r\noption 4',
+      advanced: true,
+      value_type: 'plain',
+      resource_type: 'ansible_roles',
+      default: '',
+      hidden_value: false,
+    },
+    {
+      name: 'adv search',
+      required: false,
+      options: '',
+      advanced: true,
+      value_type: 'search',
+      resource_type: 'foreman_tasks/tasks',
+      default: '',
+      hidden_value: false,
+    },
+    {
+      name: 'adv date',
+      required: false,
+      options: '',
+      advanced: true,
+      value_type: 'date',
+      resource_type: 'ansible_roles',
+      default: '',
+      hidden_value: false,
+    },
+  ],
+  template_inputs: [
+    {
+      name: 'plain hidden',
+      required: true,
+      input_type: 'user',
+      description: 'some Description',
+      advanced: false,
+      value_type: 'plain',
+      resource_type: 'ansible_roles',
+      default: 'Default val',
+      hidden_value: true,
+    },
+  ],
+};
+
+export const jobCategories = ['Ansible Commands', 'Puppet', 'Services'];
+
+export const testSetup = (selectors, api) => {
+  jest.spyOn(api, 'get');
+  jest.spyOn(selectors, 'selectJobTemplate');
+  jest.spyOn(selectors, 'selectJobTemplates');
+  jest.spyOn(selectors, 'selectJobCategories');
+  jest.spyOn(selectors, 'selectJobCategoriesStatus');
+
+  selectors.selectJobCategories.mockImplementation(() => jobCategories);
+  selectors.selectJobTemplates.mockImplementation(() => [
+    jobTemplate,
+    { ...jobTemplate, id: 2, name: 'template2' },
+  ]);
+  const mockStore = configureMockStore([]);
+  const store = mockStore({});
+  return store;
+};
+
+export const mockTemplate = selectors => {
+  selectors.selectJobTemplate.mockImplementation(() => jobTemplate);
+  selectors.selectJobCategoriesStatus.mockImplementation(() => 'RESOLVED');
+};
+export const mockApi = api => {
+  api.get.mockImplementation(({ handleSuccess, ...action }) => {
+    if (action.key === 'JOB_CATEGORIES') {
+      handleSuccess &&
+        handleSuccess({ data: { job_categories: jobCategories } });
+    } else if (action.key === 'JOB_TEMPLATE') {
+      handleSuccess &&
+        handleSuccess({
+          data: jobTemplateResponse,
+        });
+    } else if (action.key === 'JOB_TEMPLATES') {
+      handleSuccess &&
+        handleSuccess({
+          data: { results: [jobTemplate] },
+        });
+    }
+    return { type: 'get', ...action };
+  });
 };

data/webpack/JobWizard/__tests__/integration.test.js

@@ -1,40 +1,27 @@
 import React from 'react';
 import { Provider } from 'react-redux';
-import configureMockStore from 'redux-mock-store';
 import { mount } from '@theforeman/test';
 import { render, fireEvent, screen, act } from '@testing-library/react';
 import * as api from 'foremanReact/redux/API';
 import { JobWizard } from '../JobWizard';
 import * as selectors from '../JobWizardSelectors';
-import { jobTemplates, jobTemplateResponse as jobTemplate } from './fixtures';
+import {
+  testSetup,
+  mockApi,
+  jobCategories,
+  jobTemplateResponse as jobTemplate,
+} from './fixtures';
 
-jest.spyOn(api, 'get');
-jest.spyOn(selectors, 'selectJobTemplate');
-jest.spyOn(selectors, 'selectJobTemplates');
-jest.spyOn(selectors, 'selectJobCategories');
-jest.spyOn(selectors, 'selectJobCategoriesStatus');
+const store = testSetup(selectors, api);
 
-const jobCategories = ['Ansible Commands', 'Puppet', 'Services'];
+selectors.selectJobTemplate.mockImplementation(() => {});
 
 api.get.mockImplementation(({ handleSuccess, ...action }) => {
   if (action.key === 'JOB_CATEGORIES') {
     handleSuccess && handleSuccess({ data: { job_categories: jobCategories } });
-  } else if (action.key === 'JOB_TEMPLATE') {
-    handleSuccess &&
-      handleSuccess({
-        data: jobTemplate,
-      });
   }
   return { type: 'get', ...action };
 });
-
-selectors.selectJobTemplate.mockImplementation(() => null);
-selectors.selectJobCategories.mockImplementation(() => jobCategories);
-selectors.selectJobCategoriesStatus.mockImplementation(() => null);
-selectors.selectJobTemplates.mockImplementation(() => jobTemplates);
-
-const mockStore = configureMockStore([]);
-const store = mockStore({});
 describe('Job wizard fill', () => {
   it('should select template', async () => {
     const wrapper = mount(
@@ -51,7 +38,10 @@ describe('Job wizard fill', () => {
     selectors.selectJobTemplate.mockImplementation(() => jobTemplate);
     wrapper.find('.pf-c-button.pf-c-select__toggle-button').simulate('click');
     await act(async () => {
-      await wrapper.find('.pf-c-select__menu-item').simulate('click');
+      await wrapper
+        .find('.pf-c-select__menu-item')
+        .first()
+        .simulate('click');
       await wrapper.update();
     });
     expect(store.getActions().slice(-1)).toMatchSnapshot('select template');
@@ -60,74 +50,12 @@ describe('Job wizard fill', () => {
     );
   });
 
-  it('should save data between steps for advanced fields', async () => {
-    const wrapper = mount(
-      <Provider store={store}>
-        <JobWizard advancedValues={{}} setAdvancedValues={jest.fn()} />
-      </Provider>
-    );
-    // setup
-    selectors.selectJobCategoriesStatus.mockImplementation(() => 'RESOLVED');
-    selectors.selectJobTemplate.mockImplementation(() => jobTemplate);
-    wrapper.find('.pf-c-button.pf-c-select__toggle-button').simulate('click');
-    wrapper.find('.pf-c-select__menu-item').simulate('click');
-
-    // test
-    expect(wrapper.find('.pf-c-wizard__nav-link.pf-m-disabled')).toHaveLength(
-      0
-    );
-    wrapper
-      .find('.pf-c-wizard__nav-link')
-      .at(2)
-      .simulate('click'); // Advanced step
-    const effectiveUserInput = () => wrapper.find('input#effective-user');
-    const effectiveUesrValue = 'effective user new value';
-    effectiveUserInput().getDOMNode().value = effectiveUesrValue;
-    await act(async () => {
-      await effectiveUserInput().simulate('change');
-      wrapper.update();
-    });
-
-    expect(effectiveUserInput().prop('value')).toEqual(effectiveUesrValue);
-
-    wrapper
-      .find('.pf-c-wizard__nav-link')
-      .at(1)
-      .simulate('click');
-
-    expect(wrapper.find('.pf-c-wizard__nav-link.pf-m-current').text()).toEqual(
-      'Target Hosts'
-    );
-    wrapper
-      .find('.pf-c-wizard__nav-link')
-      .at(2)
-      .simulate('click'); // Advanced step
-
-    expect(effectiveUserInput().prop('value')).toEqual(effectiveUesrValue);
-  });
-
   it('have all steps', async () => {
     selectors.selectJobCategoriesStatus.mockImplementation(() => null);
     selectors.selectJobTemplate.mockRestore();
     selectors.selectJobTemplates.mockRestore();
     selectors.selectJobCategories.mockRestore();
-    api.get.mockImplementation(({ handleSuccess, ...action }) => {
-      if (action.key === 'JOB_CATEGORIES') {
-        handleSuccess &&
-          handleSuccess({ data: { job_categories: jobCategories } });
-      } else if (action.key === 'JOB_TEMPLATE') {
-        handleSuccess &&
-          handleSuccess({
-            data: jobTemplate,
-          });
-      } else if (action.key === 'JOB_TEMPLATES') {
-        handleSuccess &&
-          handleSuccess({
-            data: { results: [jobTemplate.job_template] },
-          });
-      }
-      return { type: 'get', ...action };
-    });
+    mockApi(api);
 
     render(
       <Provider store={store}>

data/webpack/JobWizard/steps/AdvancedFields/AdvancedFields.js

@@ -3,7 +3,11 @@ import PropTypes from 'prop-types';
 import { useSelector } from 'react-redux';
 import { Title, Form } from '@patternfly/react-core';
 import { translate as __ } from 'foremanReact/common/I18n';
-import { selectJobTemplate } from '../../JobWizardSelectors';
+import {
+  selectEffectiveUser,
+  selectAdvancedTemplateInputs,
+  selectTemplateInputs,
+} from '../../JobWizardSelectors';
 import {
   EffectiveUserField,
   TimeoutToKillField,
@@ -12,17 +16,25 @@ import {
   EffectiveUserPasswordField,
   ConcurrencyLevelField,
   TimeSpanLevelField,
+  TemplateInputsFields,
 } from './Fields';
+import { DescriptionField } from './DescriptionField';
 
 export const AdvancedFields = ({ advancedValues, setAdvancedValues }) => {
-  const jobTemplate = useSelector(selectJobTemplate);
-  const effectiveUser = jobTemplate.effective_user;
+  const effectiveUser = useSelector(selectEffectiveUser);
+  const advancedTemplateInputs = useSelector(selectAdvancedTemplateInputs);
+  const templateInputs = useSelector(selectTemplateInputs);
   return (
     <>
       <Title headingLevel="h2" className="advanced-fields-title">
         {__('Advanced Fields')}
       </Title>
-      <Form>
+      <Form id="advanced-fields-job-template" autoComplete="off">
+        <TemplateInputsFields
+          inputs={advancedTemplateInputs}
+          value={advancedValues.templateValues}
+          setValue={newValue => setAdvancedValues({ templateValues: newValue })}
+        />
         {effectiveUser?.overridable && (
           <EffectiveUserField
             value={advancedValues.effectiveUserValue}
@@ -33,6 +45,11 @@ export const AdvancedFields = ({ advancedValues, setAdvancedValues }) => {
             }
           />
         )}
+        <DescriptionField
+          inputs={templateInputs}
+          value={advancedValues.description}
+          setValue={newValue => setAdvancedValues({ description: newValue })}
+        />
         <TimeoutToKillField
           value={advancedValues.timeoutToKill}
           setValue={newValue =>

data/webpack/JobWizard/steps/AdvancedFields/DescriptionField.js

@@ -0,0 +1,67 @@
+import React, { useState } from 'react';
+import PropTypes from 'prop-types';
+import { FormGroup, TextInput, Button } from '@patternfly/react-core';
+import { translate as __ } from 'foremanReact/common/I18n';
+
+export const DescriptionField = ({ inputs, value, setValue }) => {
+  const generateDesc = () => {
+    let newDesc = value;
+    if (value) {
+      const re = new RegExp('%\\{([^\\}]+)\\}', 'gm');
+      const results = [...newDesc.matchAll(re)].map(result => ({
+        name: result[1],
+        text: result[0],
+      }));
+      results.forEach(result => {
+        newDesc = newDesc.replace(
+          result.text,
+          // TODO: Replace with the value of the input from Target Hosts step
+          inputs.find(input => input.name === result.name)?.name || result.text
+        );
+      });
+    }
+    return newDesc;
+  };
+  const [generatedDesc, setGeneratedDesc] = useState(generateDesc());
+  const [isPreview, setIsPreview] = useState(true);
+
+  const togglePreview = () => {
+    setGeneratedDesc(generateDesc());
+    setIsPreview(v => !v);
+  };
+
+  return (
+    <FormGroup
+      label={__('Description')}
+      fieldId="description"
+      helperText={
+        <Button variant="link" isInline onClick={togglePreview}>
+          {isPreview
+            ? __('Edit job description template')
+            : __('Preview job description')}
+        </Button>
+      }
+    >
+      {isPreview ? (
+        <TextInput id="description-preview" value={generatedDesc} isDisabled />
+      ) : (
+        <TextInput
+          type="text"
+          autoComplete="description"
+          id="description"
+          value={value}
+          onChange={newValue => setValue(newValue)}
+        />
+      )}
+    </FormGroup>
+  );
+};
+
+DescriptionField.propTypes = {
+  inputs: PropTypes.array.isRequired,
+  value: PropTypes.string,
+  setValue: PropTypes.func.isRequired,
+};
+DescriptionField.defaultProps = {
+  value: '',
+};