@ukhomeoffice/cop-react-form-renderer 4.49.0 → 4.51.1

package/dist/components/FormRenderer/FormRenderer.js

@@ -283,7 +283,7 @@ var InternalFormRenderer = function InternalFormRenderer(_ref2) {
 
       var tasks = (data === null || data === void 0 ? void 0 : (_data$formStatus2 = data.formStatus) === null || _data$formStatus2 === void 0 ? void 0 : _data$formStatus2.tasks) || {};
 
-      var updatedSections = _helpers.default.getUpdatedSectionStates(theSections, tasks, nonSequential);
+      var updatedSections = _helpers.default.getUpdatedSectionStates(theSections, tasks, nonSequential, data);
 
       setHubDetails(function (prev) {
         return _objectSpread(_objectSpread({}, prev), {}, {

package/dist/components/FormRenderer/helpers/getUpdatedSectionStates.js

@@ -5,8 +5,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
+var _utils = _interopRequireDefault(require("../../../utils"));
+
 var _models = require("../../../models");
 
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -93,28 +97,66 @@ var updateTasks = function updateTasks(section, sectionIndex, tasks, nonSequenti
     return _objectSpread({}, a);
   });
   clone.forEach(function (task, taskIndex, taskList) {
-    task.state = updateTaskState(task, taskIndex, taskList, tasks, nonSequential, allowFirst);
+    if (section.skipped) {
+      task.state = _models.TaskStates.TYPES.SKIPPED;
+    } else {
+      task.state = updateTaskState(task, taskIndex, taskList, tasks, nonSequential, allowFirst);
+    }
   });
   return clone;
 };
+/**
+ * Checks if the previous section has been completed. If the last section
+ * was skipped then this function will check the section before that until
+ * the state of a non-skipped section can be found.
+ * @param {array} sections - array of sections
+ * @param {number} currentIndex - index of the current section
+ * @returns {boolean} true if the last non-skipped section is complete, false
+ *                    if not.
+ */
+
+
+var isPreviousSectionComplete = function isPreviousSectionComplete(sections, currentIndex) {
+  var _sections, _sections$tasks$slice;
+
+  var lastTaskState = (_sections = sections[currentIndex - 1]) === null || _sections === void 0 ? void 0 : (_sections$tasks$slice = _sections.tasks.slice(-1)[0]) === null || _sections$tasks$slice === void 0 ? void 0 : _sections$tasks$slice.state;
+
+  if (lastTaskState === _models.TaskStates.TYPES.COMPLETE) {
+    return true;
+  }
+
+  if (lastTaskState === _models.TaskStates.TYPES.SKIPPED) {
+    return currentIndex - 1 === 0 ? true : isPreviousSectionComplete(sections, currentIndex - 1);
+  }
+
+  return false;
+};
 /**
  * update task states in sections
  * @param {object[]} sections - array of sections
  * @param {object} tasks - update task states
  * @param {boolean} nonSequential - true if tasks can be performed non-sequentially
+ * @param {object} data - current form data
  * @returns {object[]} - updated sections - note this is a clone
  */
 
 
 var getUpdatedSectionStates = function getUpdatedSectionStates(sections, tasks) {
   var nonSequential = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+  var data = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
   var clone = sections.map(function (a) {
     return _objectSpread({}, a);
   });
   clone.forEach(function (section, sectionIndex, sectionList) {
-    var _sectionList, _sectionList$tasks$sl;
+    var _section$show_when;
+
+    var allowFirst = sectionIndex === 0 || isPreviousSectionComplete(sectionList, sectionIndex); // Support a single show_when check on a section. Support for an
+    // array of checks will have to be added if required.
+
+    if (data && !_utils.default.Condition.met(section.show_when, data[(_section$show_when = section.show_when) === null || _section$show_when === void 0 ? void 0 : _section$show_when.field])) {
+      section.skipped = true;
+    }
 
-    var allowFirst = sectionIndex === 0 || ((_sectionList = sectionList[sectionIndex - 1]) === null || _sectionList === void 0 ? void 0 : (_sectionList$tasks$sl = _sectionList.tasks.slice(-1)[0]) === null || _sectionList$tasks$sl === void 0 ? void 0 : _sectionList$tasks$sl.state) === _models.TaskStates.TYPES.COMPLETE;
     section.tasks = updateTasks(section, sectionIndex, tasks, nonSequential, allowFirst);
   });
   return clone;

package/dist/components/FormRenderer/helpers/getUpdatedSectionStates.test.js

@@ -114,6 +114,85 @@ describe('components.FormRenderer.helpers.getUpdatedSectionStates', function ()
       expect(updatedSections[0].tasks[0].state).toEqual(_models.TaskStates.TYPES.IN_PROGRESS);
       expect(updatedSections[0].tasks[1].state).toEqual(_models.TaskStates.TYPES.CANNOT_START_YET);
     });
+    it("should set the status of any tasks in a section with a failed show_when to '".concat(_models.TaskStates.TYPES.SKIPPED, "'"), function () {
+      var SECTIONS = [{
+        name: 'Add event details',
+        tasks: [{
+          name: 'Date, location and mode details',
+          pages: ['eventDate', 'eventMode']
+        }, {
+          name: 'Officer and agency details',
+          pages: ['officeDetails']
+        }]
+      }, {
+        name: 'Add people details',
+        show_when: {
+          field: 'field',
+          op: '=',
+          value: 'showMe'
+        },
+        tasks: [{
+          name: 'People details',
+          pages: ['firstName', 'surname']
+        }, {
+          name: 'Immigration details',
+          pages: ['immigrationDate']
+        }]
+      }];
+      var TASKS = {
+        'Date, location and mode details': {
+          complete: true
+        },
+        'Officer and agency details': {
+          complete: true
+        }
+      };
+      var DATA = {
+        field: 'hideMe'
+      };
+      var updatedSections = (0, _getUpdatedSectionStates.default)(SECTIONS, TASKS, false, DATA);
+      expect(updatedSections[0].tasks[0].state).toEqual(_models.TaskStates.TYPES.COMPLETE);
+      expect(updatedSections[0].tasks[1].state).toEqual(_models.TaskStates.TYPES.COMPLETE);
+      expect(updatedSections[1].skipped).toEqual(true);
+      expect(updatedSections[1].tasks[0].state).toEqual(_models.TaskStates.TYPES.SKIPPED);
+      expect(updatedSections[1].tasks[1].state).toEqual(_models.TaskStates.TYPES.SKIPPED);
+    });
+  });
+  it("should set the status of any tasks to '".concat(_models.TaskStates.TYPES.NOT_STARTED, "' if previous tasks have been skipped"), function () {
+    var SECTIONS = [{
+      name: 'Add event details',
+      show_when: {
+        field: 'field',
+        op: '=',
+        value: 'showMe'
+      },
+      tasks: [{
+        name: 'Date, location and mode details',
+        pages: ['eventDate', 'eventMode']
+      }, {
+        name: 'Officer and agency details',
+        pages: ['officeDetails']
+      }]
+    }, {
+      name: 'Add people details',
+      tasks: [{
+        name: 'People details',
+        pages: ['firstName', 'surname']
+      }, {
+        name: 'Immigration details',
+        pages: ['immigrationDate']
+      }]
+    }];
+    var TASKS = {};
+    var DATA = {
+      field: 'hideMe'
+    };
+    var updatedSections = (0, _getUpdatedSectionStates.default)(SECTIONS, TASKS, false, DATA);
+    expect(updatedSections[0].skipped).toEqual(true);
+    expect(updatedSections[0].tasks[0].state).toEqual(_models.TaskStates.TYPES.SKIPPED);
+    expect(updatedSections[0].tasks[1].state).toEqual(_models.TaskStates.TYPES.SKIPPED);
+    expect(updatedSections[1].tasks[0].state).toEqual(_models.TaskStates.TYPES.NOT_STARTED);
+    expect(updatedSections[1].tasks[1].state).toEqual(_models.TaskStates.TYPES.CANNOT_START_YET);
   });
   describe('non-sequential tasks', function () {
     var NON_SEQUENTIAL = true;

package/dist/components/TaskList/TaskList.js

@@ -114,7 +114,9 @@ var TaskList = function TaskList(_ref) {
     fieldId: notesId,
     readOnly: true,
     value: _copReactComponents.Utils.interpolateString(notesText, attrs.formData)
-  })), sections.map(function (section, index) {
+  })), sections.filter(function (section) {
+    return !section.skipped;
+  }).map(function (section, index) {
     return /*#__PURE__*/_react.default.createElement(_react.Fragment, {
       key: "".concat(section.name)
     }, /*#__PURE__*/_react.default.createElement("h2", {

package/dist/models/TaskStates.js

@@ -13,11 +13,13 @@ var TYPE_COMPLETE = 'complete';
 var TYPE_IN_PROGRESS = 'inProgress';
 var TYPE_NOT_STARTED = 'notStarted';
 var TYPE_CANNOT_START_YET = 'cannotStartYet';
+var TYPE_SKIPPED = 'skipped';
 var StateTypes = {
   COMPLETE: TYPE_COMPLETE,
   IN_PROGRESS: TYPE_IN_PROGRESS,
   NOT_STARTED: TYPE_NOT_STARTED,
-  CANNOT_START_YET: TYPE_CANNOT_START_YET
+  CANNOT_START_YET: TYPE_CANNOT_START_YET,
+  SKIPPED: TYPE_SKIPPED
 };
 exports.StateTypes = StateTypes;
 var StateDetails = (_StateDetails = {}, _defineProperty(_StateDetails, TYPE_COMPLETE, {
@@ -32,6 +34,9 @@ var StateDetails = (_StateDetails = {}, _defineProperty(_StateDetails, TYPE_COMP
 }), _defineProperty(_StateDetails, TYPE_CANNOT_START_YET, {
   label: 'Cannot Start Yet',
   colour: 'dark-grey'
+}), _defineProperty(_StateDetails, TYPE_SKIPPED, {
+  label: 'Skipped',
+  colour: 'dark-grey'
 }), _StateDetails);
 var TaskStates = {
   TYPES: StateTypes,

package/dist/utils/Operate/getFirstOf.js

@@ -0,0 +1,39 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _copReactComponents = require("@ukhomeoffice/cop-react-components");
+
+var _getSourceData = _interopRequireDefault(require("../Data/getSourceData"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+// Global imports.
+// Local imports.
+var getFirstOf = function getFirstOf(config, data) {
+  var fieldValue;
+
+  if (config !== null && config !== void 0 && config.fields) {
+    config.fields.find(function (field) {
+      var fieldPath = _copReactComponents.Utils.interpolateString(field, data);
+
+      var foundValue = (0, _getSourceData.default)(data, fieldPath);
+
+      if (foundValue) {
+        fieldValue = foundValue;
+        return true;
+      }
+
+      return false;
+    });
+    return fieldValue || '';
+  }
+
+  return (config === null || config === void 0 ? void 0 : config.value) || null;
+};
+
+var _default = getFirstOf;
+exports.default = _default;

package/dist/utils/Operate/getFirstOf.test.js

@@ -0,0 +1,78 @@
+"use strict";
+
+var _getFirstOf = _interopRequireDefault(require("./getFirstOf"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+describe('Utils.Operate.addToFormData', function () {
+  var DATA = {
+    name: 'sam',
+    id: 1,
+    test: ['2', '3'],
+    idName: 'passport',
+    passportNumber: 123,
+    otherIdDoc: '',
+    anotherMadeUpId: 789
+  };
+  it('Should handle interpolated field strings', function () {
+    // eslint-disable-next-line no-template-curly-in-string
+    var CONFIG = {
+      fields: ['test[${id}]']
+    };
+    var result = (0, _getFirstOf.default)(CONFIG, DATA);
+    expect(result).toEqual(DATA.test[1]);
+  });
+  it('Should return the value provided in config if no field is specified', function () {
+    var CONFIG = {
+      value: '2'
+    };
+    var result = (0, _getFirstOf.default)(CONFIG, DATA);
+    expect(result).toEqual(CONFIG.value);
+  });
+  it('Should return the value of the passportNumber field given in config', function () {
+    var CONFIG = {
+      fields: ['passportNumber', 'anotherMadeUpId', 'otherIdDoc']
+    };
+    var result = (0, _getFirstOf.default)(CONFIG, DATA);
+    expect(result).toEqual(DATA.passportNumber);
+  });
+  it('Should return the value of the anotherMadeUpId field given in config', function () {
+    var CONFIG = {
+      fields: ['anotherMadeUpId', 'passportNumber', 'otherIdDoc']
+    };
+    var result = (0, _getFirstOf.default)(CONFIG, DATA);
+    expect(result).toEqual(DATA.anotherMadeUpId);
+  });
+  it('Should return the value of the otherIdDoc field given in config', function () {
+    var CONFIG = {
+      fields: ['otherIdDoc', 'passportNumber', 'anotherMadeUpId']
+    };
+    var result = (0, _getFirstOf.default)(CONFIG, DATA);
+    expect(result).toEqual(DATA.passportNumber);
+  });
+  it('Should return the value of the otherIdDoc field given in config, if it exists, otherwise next field next in the array', function () {
+    var CONFIG = {
+      fields: ['otherIdDoc', 'passportNumber', 'anotherMadeUpId']
+    };
+    var result = (0, _getFirstOf.default)(CONFIG, DATA);
+    expect(result).toEqual(DATA.passportNumber);
+  });
+  it('Should return no value if elements in config.fields are not found in data', function () {
+    var CONFIG = {
+      fields: ['otherIdDoc1', 'passportNumber1', 'anotherMadeUpId1']
+    };
+    var result = (0, _getFirstOf.default)(CONFIG, DATA);
+    expect(result).toEqual('');
+  });
+  it('Should return null when an invalid config is used', function () {
+    var result = (0, _getFirstOf.default)(null, DATA);
+    expect(result).toEqual(null);
+  });
+  it('Should return null when invalid data is used', function () {
+    var CONFIG = {
+      field: 'a'
+    };
+    var result = (0, _getFirstOf.default)(CONFIG, null);
+    expect(result).toEqual(null);
+  });
+});

package/dist/utils/Operate/runPageOperations.js

@@ -19,6 +19,8 @@ var _shouldRun = _interopRequireDefault(require("./shouldRun"));
 
 var _setDataItem = _interopRequireDefault(require("../Data/setDataItem"));
 
+var _getFirstOf = _interopRequireDefault(require("./getFirstOf"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 // Global imports.
@@ -27,7 +29,8 @@ var functions = {
   checkValueIsTruthy: _checkValueIsTruthy.default,
   getIndexOfMatchingValueIn: _getIndexOfMatchingValueIn.default,
   persistValueInFormData: _persistValueInFormData.default,
-  setValueInFormData: _setValueInFormData.default
+  setValueInFormData: _setValueInFormData.default,
+  getFirstOf: _getFirstOf.default
 };
 
 var doOperation = function doOperation(config, data, onChange) {

package/dist/utils/Validate/validatePage.js

@@ -39,7 +39,7 @@ var validatePage = function validatePage(page) {
     }
   }
 
-  if ((0, _showFormPage.default)(page, page.formData) && Array.isArray(page.components)) {
+  if ((0, _showFormPage.default)(page, data) && Array.isArray(page.components)) {
     var errs = page.components.reduce(function (errors, component) {
       var componentErrors = (0, _validateComponent.default)(component, data, data);
       return errors.concat(componentErrors).flat().map(function (err) {

package/dist/utils/Validate/validatePage.test.js

@@ -73,6 +73,35 @@ describe('utils.Validate.Page', function () {
           error: 'Echo is required'
         });
       });
+      it('should return an error for each required component on a collection page', function () {
+        var COMPONENTS = [setup('a', _models.ComponentTypes.TEXT, 'Alpha', true), setup('b', _models.ComponentTypes.TEXT, 'Bravo', true), setup('c', _models.ComponentTypes.TEXT, 'Charlie', false), // The only unrequired one
+        setup('d', _models.ComponentTypes.TEXT, 'Delta', true), setup('e', _models.ComponentTypes.TEXT, 'Echo', true)];
+        var PAGE = {
+          components: COMPONENTS,
+          collection: {
+            name: 'testCollection'
+          },
+          formData: null
+        };
+        var RESULT = (0, _validatePage.default)(PAGE);
+        expect(RESULT.length).toEqual(4);
+        expect(RESULT[0]).toEqual({
+          id: 'a',
+          error: 'Alpha is required'
+        });
+        expect(RESULT[1]).toEqual({
+          id: 'b',
+          error: 'Bravo is required'
+        });
+        expect(RESULT[2]).toEqual({
+          id: 'd',
+          error: 'Delta is required'
+        });
+        expect(RESULT[3]).toEqual({
+          id: 'e',
+          error: 'Echo is required'
+        });
+      });
       it('should return an error for each required component with interpolated label', function () {
         var COMPONENTS = [// eslint-disable-next-line no-template-curly-in-string
         setup('a', _models.ComponentTypes.TEXT, 'Alpha ${tiger}', true), // eslint-disable-next-line no-template-curly-in-string
@@ -291,6 +320,70 @@ describe('utils.Validate.Page', function () {
         };
         expect((0, _validatePage.default)(PAGE).length).toEqual(0);
       });
+      it('should return an error for each required component on a collection page with a show_when that is true', function () {
+        var COMPONENTS = [setup('a', _models.ComponentTypes.TEXT, 'Alpha', true), setup('b', _models.ComponentTypes.TEXT, 'Bravo', true), setup('c', _models.ComponentTypes.TEXT, 'Charlie', false), // The only unrequired one
+        setup('d', _models.ComponentTypes.TEXT, 'Delta', true), setup('e', _models.ComponentTypes.TEXT, 'Echo', true)];
+        var PAGE = {
+          components: COMPONENTS,
+          collection: {
+            name: 'testCollection'
+          },
+          show_when: {
+            field: 'isShown',
+            op: '=',
+            value: true
+          },
+          formData: {
+            testCollectionActiveId: 123,
+            testCollection: [{
+              id: 123,
+              isShown: true
+            }]
+          }
+        };
+        var RESULT = (0, _validatePage.default)(PAGE);
+        expect(RESULT.length).toEqual(4);
+        expect(RESULT[0]).toEqual({
+          id: 'a',
+          error: 'Alpha is required'
+        });
+        expect(RESULT[1]).toEqual({
+          id: 'b',
+          error: 'Bravo is required'
+        });
+        expect(RESULT[2]).toEqual({
+          id: 'd',
+          error: 'Delta is required'
+        });
+        expect(RESULT[3]).toEqual({
+          id: 'e',
+          error: 'Echo is required'
+        });
+      });
+      it('should return no errors on a collection page with a show_when that is false', function () {
+        var COMPONENTS = [setup('a', _models.ComponentTypes.TEXT, 'Alpha', true), setup('b', _models.ComponentTypes.TEXT, 'Bravo', true), setup('c', _models.ComponentTypes.TEXT, 'Charlie', false), // The only unrequired one
+        setup('d', _models.ComponentTypes.TEXT, 'Delta', true), setup('e', _models.ComponentTypes.TEXT, 'Echo', true)];
+        var PAGE = {
+          components: COMPONENTS,
+          collection: {
+            name: 'testCollection'
+          },
+          show_when: {
+            field: 'isShown',
+            op: '=',
+            value: true
+          },
+          formData: {
+            testCollectionActiveId: 123,
+            testCollection: [{
+              id: 123,
+              isShown: false
+            }]
+          }
+        };
+        var RESULT = (0, _validatePage.default)(PAGE);
+        expect(RESULT.length).toEqual(0);
+      });
     });
     describe('when the form data has one field missing and includes an invalid email', function () {
       var _DATA2;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ukhomeoffice/cop-react-form-renderer",
-  "version": "4.49.0",
+  "version": "4.51.1",
   "private": false,
   "scripts": {
     "clean": "rimraf dist",
@@ -97,4 +97,4 @@
       "last 1 safari version"
     ]
   }
-}
+}