@ukhomeoffice/cop-react-form-renderer 5.71.1 → 5.71.3

package/dist/components/CollectionSummary/CollectionSummary.js

@@ -126,6 +126,13 @@ var CollectionSummary = function CollectionSummary(_ref) {
         });
       });
       var allPagesErrors = (childPages === null || childPages === void 0 ? void 0 : childPages.flatMap(function (page) {
+        // Handle nested collections
+        if (page.childPages) {
+          return page.childPages.flatMap(function (nestedCollectionPage) {
+            var pageErrors = _utils.default.Validate.page(nestedCollectionPage);
+            return hooks.onValidate(nestedCollectionPage, pageErrors);
+          });
+        }
         var pageErrors = _utils.default.Validate.page(page);
         return hooks.onValidate(page, pageErrors);
       })) || [];

package/dist/components/CollectionSummary/CollectionSummary.test.js

@@ -92,13 +92,65 @@ describe('components.CollectionSummary.CollectionSummary', function () {
     expect(errorChecker.textContent).toContain('queuedErrors is an array of length 1');
     expect(errorChecker.textContent).toContain('testText is required');
   });
+  it('should correctly queue errors found when validating entries with nested collections', function () {
+    var FORM_DATA_NESTED = {
+      testCollection: [{
+        testDate: 'hello',
+        child: [{
+          randomField: 'hello'
+        }]
+      }]
+    };
+    var PAGES_NESTED = [{
+      id: 'page1',
+      collection: {
+        name: 'testCollection'
+      },
+      components: [{
+        id: 'testDate',
+        fieldId: 'testDate',
+        type: 'date'
+      }],
+      formData: FORM_DATA_NESTED
+    }, {
+      id: 'page2',
+      collection: {
+        name: 'testCollection.child'
+      },
+      components: [{
+        id: 'testText',
+        label: 'Nested Field',
+        fieldId: 'testText',
+        type: 'text',
+        required: true
+      }],
+      formData: FORM_DATA_NESTED
+    }];
+    var ErrorCheckComponent = function ErrorCheckComponent() {
+      var _useValidation2 = (0, _hooks.useValidation)(),
+        queuedErrors = _useValidation2.queuedErrors;
+      return /*#__PURE__*/_react.default.createElement("div", null, Array.isArray(queuedErrors) && "queuedErrors is an array of length ".concat(queuedErrors.length), (queuedErrors === null || queuedErrors === void 0 ? void 0 : queuedErrors.length) > 0 && queuedErrors.map(function (e) {
+        return e.error;
+      }));
+    };
+    var _renderWithValidation3 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(ErrorCheckComponent, null), /*#__PURE__*/_react.default.createElement(_CollectionSummary.default, {
+        config: CONFIG,
+        formData: FORM_DATA_NESTED,
+        onAction: ON_ACTION,
+        pages: PAGES_NESTED
+      }))),
+      container = _renderWithValidation3.container;
+    var errorChecker = container.children[0];
+    expect(errorChecker.textContent).toContain('queuedErrors is an array of length 1');
+    expect(errorChecker.textContent).toContain('Nested Field is required');
+  });
   it('should render a confirmation when a SummaryCard\'s delete button is pressed', function () {
-    var _renderWithValidation3 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_CollectionSummary.default, {
+    var _renderWithValidation4 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_CollectionSummary.default, {
         config: CONFIG,
         formData: FORM_DATA,
         onAction: ON_ACTION
       })),
-      container = _renderWithValidation3.container;
+      container = _renderWithValidation4.container;
     var summary = checkSetup(container);
     expect(summary.children.length).toEqual(2);
     var card = summary.children[0];
@@ -122,12 +174,12 @@ describe('components.CollectionSummary.CollectionSummary', function () {
           title: 'Title'
         }
       };
-      var _renderWithValidation4 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_CollectionSummary.default, {
+      var _renderWithValidation5 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_CollectionSummary.default, {
           config: CONFIG_WITH_BUTTON,
           formData: FORM_DATA,
           onAction: ON_ACTION
         })),
-        container = _renderWithValidation4.container;
+        container = _renderWithValidation5.container;
       var summary = checkSetup(container);
       expect(summary.children.length).toEqual(3); // The button and a card for each item.
       expect(summary.children[0].id).toEqual("".concat(CONFIG_WITH_BUTTON.fieldId, ".addButton"));
@@ -146,12 +198,12 @@ describe('components.CollectionSummary.CollectionSummary', function () {
           title: 'Title'
         }
       };
-      var _renderWithValidation5 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_CollectionSummary.default, {
+      var _renderWithValidation6 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_CollectionSummary.default, {
           config: CONFIG_WITH_BUTTON,
           formData: FORM_DATA,
           onAction: ON_ACTION
         })),
-        container = _renderWithValidation5.container;
+        container = _renderWithValidation6.container;
       var summary = checkSetup(container);
       expect(summary.children.length).toEqual(3); // The button and a card for each item.
       expect(summary.children[0].id).toEqual("".concat(CONFIG_WITH_BUTTON.fieldId, ".addButton"));
@@ -159,12 +211,12 @@ describe('components.CollectionSummary.CollectionSummary', function () {
       expect(summary.children[0].tagName).toEqual('BUTTON');
     });
     it('should apply the expected class name to the summary card when delete button is pressed', function () {
-      var _renderWithValidation6 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_CollectionSummary.default, {
+      var _renderWithValidation7 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_CollectionSummary.default, {
           config: CONFIG,
           formData: FORM_DATA,
           onAction: ON_ACTION
         })),
-        container = _renderWithValidation6.container;
+        container = _renderWithValidation7.container;
       var summary = checkSetup(container);
       expect(summary.children.length).toEqual(2);
       var card = summary.children[0];
@@ -175,12 +227,12 @@ describe('components.CollectionSummary.CollectionSummary', function () {
       expect(card.className).toContain('deleting-summary-card');
     });
     it('should focus on the delete button in the confirmation panel', function () {
-      var _renderWithValidation7 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_CollectionSummary.default, {
+      var _renderWithValidation8 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_CollectionSummary.default, {
           config: CONFIG,
           formData: FORM_DATA,
           onAction: ON_ACTION
         })),
-        container = _renderWithValidation7.container;
+        container = _renderWithValidation8.container;
       var summary = checkSetup(container);
       expect(summary.children.length).toEqual(2);
       var card = summary.children[0];
@@ -191,12 +243,12 @@ describe('components.CollectionSummary.CollectionSummary', function () {
       expect(document.activeElement).toEqual(confirmButton);
     });
     it('should have the role "alert" in the confirmation panel', function () {
-      var _renderWithValidation8 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_CollectionSummary.default, {
+      var _renderWithValidation9 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_CollectionSummary.default, {
           config: CONFIG,
           formData: FORM_DATA,
           onAction: ON_ACTION
         })),
-        container = _renderWithValidation8.container;
+        container = _renderWithValidation9.container;
       var summary = checkSetup(container);
       expect(summary.children.length).toEqual(2);
       var card = summary.children[0];
@@ -216,14 +268,14 @@ describe('components.CollectionSummary.CollectionSummary', function () {
           displayFields: ['testText']
         }
       });
-      var _renderWithValidation9 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_CollectionSummary.default, {
+      var _renderWithValidation10 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_CollectionSummary.default, {
           config: listViewConfig,
           formData: FORM_DATA,
           onAction: ON_ACTION,
           pages: PAGES
         })),
-        container = _renderWithValidation9.container,
-        getByText = _renderWithValidation9.getByText;
+        container = _renderWithValidation10.container,
+        getByText = _renderWithValidation10.getByText;
       var summary = checkSetup(container);
       expect(summary.children.length).toEqual(2);
       var card = summary.children[0];
@@ -248,14 +300,14 @@ describe('components.CollectionSummary.CollectionSummary', function () {
           message: 'Test confirmation message with index number ${index}'
         }
       });
-      var _renderWithValidation10 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_CollectionSummary.default, {
+      var _renderWithValidation11 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_CollectionSummary.default, {
           config: listViewConfig,
           formData: FORM_DATA,
           onAction: ON_ACTION,
           pages: PAGES
         })),
-        container = _renderWithValidation10.container,
-        getByText = _renderWithValidation10.getByText;
+        container = _renderWithValidation11.container,
+        getByText = _renderWithValidation11.getByText;
       var summary = checkSetup(container);
       expect(summary.children.length).toEqual(2);
       var card = summary.children[0];

package/dist/components/CollectionSummary/SummaryCardDetails.js

@@ -10,6 +10,7 @@ var _utils = _interopRequireDefault(require("../../utils"));
 var _models = require("../../models");
 var _getComponentRowForCYA = _interopRequireDefault(require("../../utils/CheckYourAnswers/getComponentRowForCYA"));
 var _getCYARowsForContainer = _interopRequireDefault(require("../../utils/CheckYourAnswers/getCYARowsForContainer"));
+var _showComponent = _interopRequireDefault(require("../../utils/Component/showComponent"));
 require("./SummaryCardDetails.scss");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -51,7 +52,7 @@ var SummaryCardDetails = function SummaryCardDetails(_ref) {
         var component = components.find(function (comp) {
           return comp.fieldId === fieldId;
         });
-        if (!component) {
+        if (!component || !(0, _showComponent.default)(component, _objectSpread(_objectSpread({}, childPage.formData), entryData))) {
           return null;
         }
         if (component.type === _models.ComponentTypes.CONTAINER) {

package/dist/components/CollectionSummary/SummaryCardDetails.test.js

@@ -276,6 +276,65 @@ describe('components.CollectionSummary.SummaryCardDetails', function () {
     var section2Content = section2Title.parentNode.querySelector(".".concat(classes('section-content')));
     expect(section2Content.querySelectorAll(".".concat(classes('field'))).length).toEqual(1);
   });
+  it('should not render components that fail show_when checks', function () {
+    var CHILD_PAGES = [{
+      summaryLayout: {
+        sections: [{
+          title: 'Section 1',
+          columns: [{
+            fields: ['fieldA']
+          }, {
+            fields: ['fieldB']
+          }]
+        }, {
+          title: 'Section 2',
+          columns: [{
+            fields: ['fieldC']
+          }]
+        }]
+      },
+      components: [{
+        fieldId: 'fieldA'
+      }, {
+        fieldId: 'fieldB',
+        show_when: [{
+          field: 'fieldA',
+          op: '=',
+          value: 'notTheRightValue'
+        }]
+      }, {
+        fieldId: 'fieldC'
+      }]
+    }];
+    var MASTER_PAGE = {
+      childPages: CHILD_PAGES
+    };
+    var _renderWithValidation5 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_SummaryCardDetails.default, {
+        masterPage: MASTER_PAGE,
+        childMasterPages: [],
+        formData: {},
+        entryData: ENTRY
+      })),
+      container = _renderWithValidation5.container;
+
+    // Function to find an element by its text content
+    function getByTextContent(parent, text) {
+      return Array.from(parent.getElementsByClassName(classes('section-title'))).find(function (el) {
+        return el.textContent === text;
+      });
+    }
+
+    // Check for section titles
+    var section1Title = getByTextContent(container, 'Section 1');
+    var section2Title = getByTextContent(container, 'Section 2');
+    expect(section1Title).not.toBeUndefined();
+    expect(section2Title).not.toBeUndefined();
+    var section1Content = section1Title.parentNode.querySelector(".".concat(classes('section-content')));
+    expect(section1Content.querySelectorAll(".".concat(classes('field'))).length).toEqual(1); // Just Field A, Field B should be hidden.
+
+    var section2Content = section2Title.parentNode.querySelector(".".concat(classes('section-content')));
+    expect(section2Content.querySelectorAll(".".concat(classes('field'))).length).toEqual(1);
+  });
   it('should not render sections on pages that fail show_when checks', function () {
     var CHILD_PAGES = [{
       show_when: [{
@@ -317,7 +376,7 @@ describe('components.CollectionSummary.SummaryCardDetails', function () {
     var CUSTOM_ENTRY = _objectSpread(_objectSpread({}, ENTRY), {}, {
       showSection1: false
     });
-    var _renderWithValidation5 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_SummaryCardDetails.default, {
+    var _renderWithValidation6 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_SummaryCardDetails.default, {
         masterPage: MASTER_PAGE,
         childMasterPages: [],
         formData: {
@@ -325,7 +384,7 @@ describe('components.CollectionSummary.SummaryCardDetails', function () {
         },
         entryData: CUSTOM_ENTRY
       })),
-      container = _renderWithValidation5.container;
+      container = _renderWithValidation6.container;
 
     // Function to find an element by its text content
     function getByTextContent(parent, text) {
@@ -383,13 +442,13 @@ describe('components.CollectionSummary.SummaryCardDetails', function () {
       childPages: [].concat(CHILD_PAGES, CHILD_MASTER_PAGES)
     };
     var CHILD_COLLECTIONS = ['childCollection'];
-    var _renderWithValidation6 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_SummaryCardDetails.default, {
+    var _renderWithValidation7 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_SummaryCardDetails.default, {
         masterPage: MASTER_PAGE,
         childCollections: CHILD_COLLECTIONS,
         formData: {},
         entryData: ENTRY
       })),
-      container = _renderWithValidation6.container;
+      container = _renderWithValidation7.container;
 
     // Function to find an element by its text content
     function getByTextContent(parent, text) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ukhomeoffice/cop-react-form-renderer",
-  "version": "5.71.1",
+  "version": "5.71.3",
   "private": false,
   "scripts": {
     "clean": "rimraf dist",