@ukhomeoffice/cop-react-form-renderer 5.62.1 → 5.62.2

package/dist/components/CollectionSummary/SummaryCard.js

@@ -219,7 +219,10 @@ SummaryCard.propTypes = {
   }).isRequired,
   config: _propTypes.default.shape({
     banners: _propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.shape({})])),
-    title: _propTypes.default.string,
+    title: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.PropTypes.arrayOf(_propTypes.default.shape({
+      title: _propTypes.default.string,
+      show_when: _propTypes.default.arrayOf({})
+    }))]),
     details: _propTypes.default.string,
     changeAction: _propTypes.default.shape({
       label: _propTypes.default.string,

package/dist/components/CollectionSummary/SummaryCardDetails.js

@@ -7,7 +7,9 @@ exports.default = exports.DEFAULT_CLASS = void 0;
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _react = _interopRequireWildcard(require("react"));
 var _utils = _interopRequireDefault(require("../../utils"));
+var _models = require("../../models");
 var _getComponentRowForCYA = _interopRequireDefault(require("../../utils/CheckYourAnswers/getComponentRowForCYA"));
+var _getCYARowsForContainer = _interopRequireDefault(require("../../utils/CheckYourAnswers/getCYARowsForContainer"));
 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; }
@@ -84,6 +86,20 @@ var SummaryCardDetails = function SummaryCardDetails(_ref) {
         if (!component) {
           return null;
         }
+        if (component.type === _models.ComponentTypes.CONTAINER) {
+          var containerRows = (0, _getCYARowsForContainer.default)(childPage, component, entryData);
+          return /*#__PURE__*/_react.default.createElement("div", {
+            key: fieldId,
+            className: classes('field')
+          }, containerRows.map(function (subComponent) {
+            var _entryData$component$;
+            // Put value for current subcomponent at top level
+            var modEntry = _objectSpread(_objectSpread({}, entryData), _defineProperty({}, subComponent.fieldId, (_entryData$component$ = entryData[component.fieldId]) === null || _entryData$component$ === void 0 ? void 0 : _entryData$component$[subComponent.fieldId]));
+            return (0, _getComponentRowForCYA.default)(childPage, _objectSpread(_objectSpread({}, subComponent), {
+              label: subComponent.key
+            }), classes, modEntry);
+          }));
+        }
         return /*#__PURE__*/_react.default.createElement("div", {
           key: fieldId,
           className: classes('field')

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

@@ -82,6 +82,75 @@ 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 render sections containing containers based on summaryLayout config', function () {
+    var CHILD_PAGES = [{
+      summaryLayout: {
+        sections: [{
+          title: 'Section 1',
+          columns: 1,
+          fields: ['containerComponent']
+        }]
+      },
+      components: [{
+        fieldId: 'containerComponent',
+        type: 'container',
+        label: 'container',
+        components: [{
+          fieldId: 'subOne',
+          label: 'subOneLabel'
+        }, {
+          fieldId: 'subTwo',
+          label: 'subTwoLabel'
+        }, {
+          fieldId: 'subThree',
+          label: 'subThreeLabel'
+        }]
+      }]
+    }];
+    var CONTAINER_ENTRY = {
+      id: '001',
+      bannerText: 'A banner',
+      titleText: 'A title',
+      detailsText: 'Some details',
+      index: 0,
+      summaryText: 'Full details',
+      containerComponent: {
+        subOne: 'alpha',
+        subTwo: 'bravo',
+        subThree: 'charlie'
+      }
+    };
+    var MASTER_PAGE = {
+      childPages: CHILD_PAGES
+    };
+    var _renderWithValidation2 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_SummaryCardDetails.default, {
+        masterPage: MASTER_PAGE,
+        childMasterPages: [],
+        formData: {},
+        entryData: CONTAINER_ENTRY
+      })),
+      container = _renderWithValidation2.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 title
+    var section1Title = getByTextContent(container, 'Section 1');
+    expect(section1Title).not.toBeUndefined();
+
+    // All three subcomponents from the container should have labels and values displayed
+    var section1Content = section1Title.parentNode.querySelector(".".concat(classes('section-content')));
+    expect(section1Content.textContent).toContain('subOneLabel');
+    expect(section1Content.textContent).toContain('alpha');
+    expect(section1Content.textContent).toContain('subTwoLabel');
+    expect(section1Content.textContent).toContain('bravo');
+    expect(section1Content.textContent).toContain('subThreeLabel');
+    expect(section1Content.textContent).toContain('charlie');
+  });
   it('should render sections if they have show_when checks and pass them', function () {
     var CHILD_PAGES = [{
       summaryLayout: {
@@ -114,13 +183,13 @@ describe('components.CollectionSummary.SummaryCardDetails', function () {
     var CUSTOM_ENTRY = _objectSpread(_objectSpread({}, ENTRY), {}, {
       showSection1: true
     });
-    var _renderWithValidation2 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_SummaryCardDetails.default, {
+    var _renderWithValidation3 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_SummaryCardDetails.default, {
         masterPage: MASTER_PAGE,
         childMasterPages: [],
         formData: {},
         entryData: CUSTOM_ENTRY
       })),
-      container = _renderWithValidation2.container;
+      container = _renderWithValidation3.container;
 
     // Function to find an element by its text content
     function getByTextContent(parent, text) {
@@ -171,13 +240,13 @@ describe('components.CollectionSummary.SummaryCardDetails', function () {
     var CUSTOM_ENTRY = _objectSpread(_objectSpread({}, ENTRY), {}, {
       showSection1: false
     });
-    var _renderWithValidation3 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_SummaryCardDetails.default, {
+    var _renderWithValidation4 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_SummaryCardDetails.default, {
         masterPage: MASTER_PAGE,
         childMasterPages: [],
         formData: {},
         entryData: CUSTOM_ENTRY
       })),
-      container = _renderWithValidation3.container;
+      container = _renderWithValidation4.container;
 
     // Function to find an element by its text content
     function getByTextContent(parent, text) {
@@ -231,7 +300,7 @@ describe('components.CollectionSummary.SummaryCardDetails', function () {
     var CUSTOM_ENTRY = _objectSpread(_objectSpread({}, ENTRY), {}, {
       showSection1: false
     });
-    var _renderWithValidation4 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_SummaryCardDetails.default, {
+    var _renderWithValidation5 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_SummaryCardDetails.default, {
         masterPage: MASTER_PAGE,
         childMasterPages: [],
         formData: {
@@ -239,7 +308,7 @@ describe('components.CollectionSummary.SummaryCardDetails', function () {
         },
         entryData: CUSTOM_ENTRY
       })),
-      container = _renderWithValidation4.container;
+      container = _renderWithValidation5.container;
 
     // Function to find an element by its text content
     function getByTextContent(parent, text) {
@@ -294,13 +363,13 @@ describe('components.CollectionSummary.SummaryCardDetails', function () {
       childPages: [].concat(CHILD_PAGES, CHILD_MASTER_PAGES)
     };
     var CHILD_COLLECTIONS = ['childCollection'];
-    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,
         childCollections: CHILD_COLLECTIONS,
         formData: {},
         entryData: ENTRY
       })),
-      container = _renderWithValidation5.container;
+      container = _renderWithValidation6.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.62.1",
+  "version": "5.62.2",
   "private": false,
   "scripts": {
     "clean": "rimraf dist",