foreman_templates 7.0.6 → 9.0.2

data/webpack/components/NewTemplateSync/components/NewTemplateSyncForm/index.js

@@ -1,19 +1,17 @@
 import { connect } from 'react-redux';
-import { reduxForm } from 'redux-form';
 
 import * as FormActions from 'foremanReact/redux/actions/common/forms';
 
-import { NEW_TEMPLATE_SYNC_FORM_NAME } from './NewTemplateSyncFormConstants';
+import { selectLayout } from 'foremanReact/components/Layout/LayoutSelectors';
+
 import NewTemplateSyncForm from './NewTemplateSyncForm';
 
 import {
   selectImportSettings,
   selectExportSettings,
 } from '../../NewTemplateSyncSelectors';
-import {
-  selectInitialFormValues,
-  selectRegisteredFields,
-} from './NewTemplateSyncFormSelectors';
+
+import { selectInitialFormValues } from './NewTemplateSyncFormSelectors';
 
 const mapStateToProps = (state, ownProps) => {
   const importSettings = selectImportSettings(state);
@@ -22,20 +20,13 @@ const mapStateToProps = (state, ownProps) => {
 
   const initialFormValues = selectInitialFormValues(state);
 
-  const currentFields = selectRegisteredFields(
-    NEW_TEMPLATE_SYNC_FORM_NAME,
-    state
-  );
-
   return {
     initialValues: { ...initialFormValues },
     importSettings,
     exportSettings,
-    currentFields,
+    currentOrganization: selectLayout(state).currentOrganization,
+    currentLocation: selectLayout(state).currentLocation,
   };
 };
 
-const form = reduxForm({ form: NEW_TEMPLATE_SYNC_FORM_NAME })(
-  NewTemplateSyncForm
-);
-export default connect(mapStateToProps, FormActions)(form);
+export default connect(mapStateToProps, FormActions)(NewTemplateSyncForm);

data/webpack/components/NewTemplateSync/components/SyncSettingField.js

@@ -5,7 +5,7 @@ import { FieldLevelHelp } from 'patternfly-react';
 import TextButtonField from './TextButtonField';
 import ButtonTooltip from './ButtonTooltip';
 
-const SyncSettingField = ({ setting, resetField, disabled }) => {
+const SyncSettingField = ({ setting, resetField, disabled, syncType }) => {
   const label = settingObj => `${settingObj.fullName} `;
 
   const fieldSelector = settingObj => {
@@ -20,10 +20,6 @@ const SyncSettingField = ({ setting, resetField, disabled }) => {
     return 'text';
   };
 
-  const handleReset = (settingName, settingValue) => {
-    resetField(settingName, settingValue);
-  };
-
   const tooltipContent = (
     <div
       dangerouslySetInnerHTML={{
@@ -34,18 +30,15 @@ const SyncSettingField = ({ setting, resetField, disabled }) => {
 
   return (
     <TextButtonField
-      name={setting.name}
+      name={`${syncType}.${setting.name}`}
       label={label(setting)}
       blank={{}}
       item={setting}
-      buttonAttrs={{
-        buttonText: <ButtonTooltip tooltipId={setting.name} />,
-        buttonAction: () => handleReset(setting.name, setting.value),
-      }}
+      buttonText={<ButtonTooltip tooltipId={setting.name} />}
+      buttonAction={resetField(`${syncType}.${setting.name}`, setting.value)}
       fieldSelector={fieldSelector}
       disabled={disabled}
       fieldRequired={setting.required}
-      validate={setting.validate}
       tooltipHelp={<FieldLevelHelp content={tooltipContent} />}
     >
       {setting.value}
@@ -57,6 +50,7 @@ SyncSettingField.propTypes = {
   setting: PropTypes.object.isRequired,
   resetField: PropTypes.func.isRequired,
   disabled: PropTypes.bool.isRequired,
+  syncType: PropTypes.string.isRequired,
 };
 
 export default SyncSettingField;

data/webpack/components/NewTemplateSync/components/SyncSettingFields.js

@@ -1,36 +1,20 @@
 import React from 'react';
-import { memoize, upperFirst } from 'lodash';
+import { upperFirst } from 'lodash';
 import PropTypes from 'prop-types';
 
 import SyncSettingField from './SyncSettingField';
 
-const repoFormat = memoize(formatAry => value => {
-  if (value) {
-    const valid = formatAry
-      .map(item => value.startsWith(item))
-      .reduce((memo, item) => item || memo, false);
-
-    if (valid) {
-      return undefined;
-    }
-  }
-
-  return `Invalid repo format, must start with one of: ${formatAry.join(', ')}`;
-});
-
 const SyncSettingsFields = ({
   importSettings,
   exportSettings,
   syncType,
   resetField,
-  disabled,
-  validationData,
+  formProps: { isSubmitting },
 }) => {
-  const addValidationToSetting = (setting, validations) =>
+  const addRequiredToSetting = setting =>
     setting.name === 'repo'
       ? setting.merge({
           required: true,
-          validate: [repoFormat(validations.repo)],
         })
       : setting;
 
@@ -58,14 +42,15 @@ const SyncSettingsFields = ({
   return (
     <React.Fragment>
       {settingsAry
-        .map(setting => addValidationToSetting(setting, validationData))
+        .map(addRequiredToSetting)
         .map(setting => modifyDescription(setting, syncType))
         .map(setting => specializeDescription(setting, syncType))
         .map(setting => (
           <SyncSettingField
             setting={setting}
+            syncType={syncType}
             key={setting.name}
-            disabled={disabled}
+            disabled={isSubmitting}
             resetField={resetField}
           />
         ))}
@@ -78,13 +63,11 @@ SyncSettingsFields.propTypes = {
   exportSettings: PropTypes.array.isRequired,
   syncType: PropTypes.string.isRequired,
   resetField: PropTypes.func.isRequired,
-  disabled: PropTypes.bool,
-  validationData: PropTypes.object,
+  formProps: PropTypes.object,
 };
 
 SyncSettingsFields.defaultProps = {
-  disabled: false,
-  validationData: {},
+  formProps: {},
 };
 
 export default SyncSettingsFields;

data/webpack/components/NewTemplateSync/components/TextButtonField/index.js

@@ -1,5 +1,6 @@
 import React from 'react';
-import { Field } from 'redux-form';
+import { get } from 'lodash';
+import { Field as FormikField } from 'formik';
 import PropTypes from 'prop-types';
 
 import RenderField from './RenderField';
@@ -11,25 +12,35 @@ const TextButtonField = ({
   className,
   inputClassName,
   blank,
-  buttonAttrs,
+  buttonText,
+  buttonAction,
   fieldSelector,
-  validate,
   disabled,
   fieldRequired,
   tooltipHelp,
 }) => (
-  <Field
+  <FormikField
     name={name}
-    label={label}
-    fieldSelector={fieldSelector}
-    tooltipHelp={tooltipHelp}
-    component={RenderField}
-    buttonAttrs={buttonAttrs}
-    blank={blank}
-    item={item}
-    disabled={disabled}
-    validate={item.validate}
-    fieldRequired={fieldRequired}
+    render={({ field, form }) => (
+      <RenderField
+        label={label}
+        fieldSelector={fieldSelector}
+        tooltipHelp={tooltipHelp}
+        buttonAttrs={{
+          buttonText,
+          buttonAction: () => buttonAction(form.setFieldValue),
+        }}
+        blank={blank}
+        item={item}
+        disabled={disabled}
+        fieldRequired={fieldRequired}
+        meta={{
+          touched: get(form.touched, name),
+          error: get(form.errors, name),
+        }}
+        input={field}
+      />
+    )}
   />
 );
 
@@ -43,12 +54,9 @@ TextButtonField.propTypes = {
     label: PropTypes.string,
     value: PropTypes.string,
   }),
-  buttonAttrs: PropTypes.shape({
-    buttonText: PropTypes.node,
-    buttonAction: PropTypes.func,
-  }).isRequired,
+  buttonText: PropTypes.node.isRequired,
+  buttonAction: PropTypes.func.isRequired,
   fieldSelector: PropTypes.func,
-  validate: PropTypes.array,
   disabled: PropTypes.bool,
   fieldRequired: PropTypes.bool,
   tooltipHelp: PropTypes.node,
@@ -58,7 +66,6 @@ TextButtonField.defaultProps = {
   blank: { label: 'Choose one...', value: '' },
   className: '',
   inputClassName: 'col-md-6',
-  validate: [],
   disabled: false,
   fieldRequired: false,
   tooltipHelp: null,

data/webpack/components/NewTemplateSync/components/__tests__/SyncSettingField.test.js

@@ -8,11 +8,12 @@ import {
   filterSetting,
 } from '../../__fixtures__/templateSyncSettings.fixtures';
 
-const noop = () => {};
+const noop = () => () => {};
 
 const commonFixtures = {
   resetField: noop,
   disabled: false,
+  syncType: 'import',
 };
 
 const fixtures = {

data/webpack/components/NewTemplateSync/components/__tests__/SyncSettingFields.test.js

@@ -13,6 +13,7 @@ const commonFixtures = {
   importSettings,
   exportSettings,
   resetField: noop,
+  formProps: { isSubmitting: false },
   disabled: false,
 };
 

data/webpack/components/NewTemplateSync/components/__tests__/TextButtonField.test.js

@@ -29,7 +29,7 @@ const fixtures = {
     name: 'Text field',
     item: textItem,
     fieldSelector,
-    buttonAttrs,
+    ...buttonAttrs,
     disabled: false,
     label: 'Text',
     blank: {},
@@ -38,7 +38,7 @@ const fixtures = {
     name: 'Checkbox field',
     item: checkboxItem,
     fieldSelector,
-    buttonAttrs,
+    ...buttonAttrs,
     disabled: false,
     label: 'Checkbox',
     blank: {},
@@ -47,7 +47,7 @@ const fixtures = {
     name: 'select field',
     item: selectItem,
     fieldSelector,
-    buttonAttrs,
+    ...buttonAttrs,
     label: 'Select',
     disabled: false,
     blank,
@@ -55,7 +55,7 @@ const fixtures = {
   'should render text field without field selector': {
     name: 'no selector',
     label: 'Text field',
-    buttonAttrs,
+    ...buttonAttrs,
     disabled: false,
     blank: {},
   },

data/webpack/components/NewTemplateSync/components/__tests__/__snapshots__/SyncSettingField.test.js.snap

@@ -3,13 +3,11 @@
 exports[`SyncSettingField should render boolean setting as checkbox 1`] = `
 <TextButtonField
   blank={Object {}}
-  buttonAttrs={
-    Object {
-      "buttonAction": [Function],
-      "buttonText": <ButtonTooltip
-        tooltipId="force"
-      />,
-    }
+  buttonAction={[Function]}
+  buttonText={
+    <ButtonTooltip
+      tooltipId="force"
+    />
   }
   className=""
   disabled={false}
@@ -26,7 +24,7 @@ exports[`SyncSettingField should render boolean setting as checkbox 1`] = `
     }
   }
   label="undefined "
-  name="force"
+  name="import.force"
   tooltipHelp={
     <FieldLevelHelp
       buttonClass=""
@@ -43,20 +41,17 @@ exports[`SyncSettingField should render boolean setting as checkbox 1`] = `
       rootClose={true}
     />
   }
-  validate={Array []}
 />
 `;
 
 exports[`SyncSettingField should render setting with input field 1`] = `
 <TextButtonField
   blank={Object {}}
-  buttonAttrs={
-    Object {
-      "buttonAction": [Function],
-      "buttonText": <ButtonTooltip
-        tooltipId="filter"
-      />,
-    }
+  buttonAction={[Function]}
+  buttonText={
+    <ButtonTooltip
+      tooltipId="filter"
+    />
   }
   className=""
   disabled={false}
@@ -73,7 +68,7 @@ exports[`SyncSettingField should render setting with input field 1`] = `
     }
   }
   label="undefined "
-  name="filter"
+  name="import.filter"
   tooltipHelp={
     <FieldLevelHelp
       buttonClass=""
@@ -90,20 +85,17 @@ exports[`SyncSettingField should render setting with input field 1`] = `
       rootClose={true}
     />
   }
-  validate={Array []}
 />
 `;
 
 exports[`SyncSettingField should render setting with select choices 1`] = `
 <TextButtonField
   blank={Object {}}
-  buttonAttrs={
-    Object {
-      "buttonAction": [Function],
-      "buttonText": <ButtonTooltip
-        tooltipId="associate"
-      />,
-    }
+  buttonAction={[Function]}
+  buttonText={
+    <ButtonTooltip
+      tooltipId="associate"
+    />
   }
   className=""
   disabled={false}
@@ -134,7 +126,7 @@ exports[`SyncSettingField should render setting with select choices 1`] = `
     }
   }
   label="undefined "
-  name="associate"
+  name="import.associate"
   tooltipHelp={
     <FieldLevelHelp
       buttonClass=""
@@ -151,7 +143,6 @@ exports[`SyncSettingField should render setting with select choices 1`] = `
       rootClose={true}
     />
   }
-  validate={Array []}
 >
   new
 </TextButtonField>

data/webpack/components/NewTemplateSync/components/__tests__/__snapshots__/SyncSettingFields.test.js.snap

@@ -15,6 +15,7 @@ exports[`SyncSettingFields should show export settings 1`] = `
         "value": "",
       }
     }
+    syncType="export"
   />
   <SyncSettingField
     disabled={false}
@@ -29,6 +30,7 @@ exports[`SyncSettingFields should show export settings 1`] = `
         "value": false,
       }
     }
+    syncType="export"
   />
   <SyncSettingField
     disabled={false}
@@ -41,12 +43,10 @@ exports[`SyncSettingFields should show export settings 1`] = `
         "name": "repo",
         "required": true,
         "settingsType": "string",
-        "validate": Array [
-          [Function],
-        ],
         "value": "https://github.com/theforeman/community-templates.git",
       }
     }
+    syncType="export"
   />
 </Fragment>
 `;
@@ -80,6 +80,7 @@ exports[`SyncSettingFields should show import settings 1`] = `
         "value": "new",
       }
     }
+    syncType="import"
   />
   <SyncSettingField
     disabled={false}
@@ -94,6 +95,7 @@ exports[`SyncSettingFields should show import settings 1`] = `
         "value": false,
       }
     }
+    syncType="import"
   />
 </Fragment>
 `;