@ukhomeoffice/cop-react-form-renderer 5.43.0 → 5.44.0

package/dist/components/CheckYourAnswers/CheckYourAnswers.js

@@ -50,7 +50,8 @@ var CheckYourAnswers = function CheckYourAnswers(_ref) {
     noGroupAction = _ref.noGroupAction,
     groups = _ref.groups,
     sections = _ref.sections,
-    type = _ref.type;
+    type = _ref.type,
+    hideBlankRows = _ref.hideBlankRows;
   var _useState = (0, _react.useState)([]),
     _useState2 = _slicedToArray(_useState, 2),
     pages = _useState2[0],
@@ -179,18 +180,25 @@ var CheckYourAnswers = function CheckYourAnswers(_ref) {
       }));
     });
   }), type !== _models.FormTypes.TASK_CYA && pages && pages.map(function (page, pageIndex, array) {
-    var pageMarginBottom = isLastPage(pageIndex) || isGroup(array[pageIndex].id) || isGroup(array[pageIndex + 1].id) ? DEFAULT_MARGIN_BOTTOM : listMarginBottom;
+    var filteredRows = !hideBlankRows || page.collection ? page.rows : page.rows.filter(function (row) {
+      var _row$value;
+      return row === null || row === void 0 || (_row$value = row.value) === null || _row$value === void 0 || (_row$value = _row$value.props) === null || _row$value === void 0 ? void 0 : _row$value.value;
+    });
+    if (filteredRows.length === 0) {
+      return null;
+    }
+    var showPageTitle = !hide_page_titles && page.title && !isGroup(page.id);
+    var pageMarginBottom = isLastPage(pageIndex) || isGroup(array[pageIndex].id) || array.length > pageIndex + 1 && isGroup(array[pageIndex + 1].id) ? DEFAULT_MARGIN_BOTTOM : listMarginBottom;
     var currentGroup = isGroup(page.id) ? getGroupForPage(page.id) : undefined;
     var className = "govuk-!-margin-bottom-".concat(pageMarginBottom);
     var hideActionButtons = isGroup(page.id) || noChangeAction;
-    var showHeading = !hide_page_titles && page.title && !isGroup(page.id);
     return /*#__PURE__*/_react.default.createElement(_react.Fragment, {
       key: pageIndex
-    }, showHeading && getPageHeading(page, 'm'), isGroup(page.id) && /*#__PURE__*/_react.default.createElement("div", {
+    }, showPageTitle && getPageHeading(page, 'm'), currentGroup && /*#__PURE__*/_react.default.createElement("div", {
       className: "group-title"
     }, /*#__PURE__*/_react.default.createElement(_copReactComponents.MediumHeading, null, currentGroup.title || _utils.default.FormPage.getTitle(page.title, page.formData))), /*#__PURE__*/_react.default.createElement(_SummaryList.default, {
       className: className,
-      rows: page.rows,
+      rows: filteredRows,
       classModifiers: summaryListClassModifiers,
       noChangeAction: hideActionButtons,
       noGroupAction: noGroupAction,
@@ -224,7 +232,8 @@ CheckYourAnswers.propTypes = {
   })),
   summaryListClassModifiers: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.arrayOf(_propTypes.default.string)]),
   title: _propTypes.default.string,
-  type: _propTypes.default.string
+  type: _propTypes.default.string,
+  hideBlankRows: _propTypes.default.bool
 };
 CheckYourAnswers.defaultProps = {
   actions: [],
@@ -237,6 +246,7 @@ CheckYourAnswers.defaultProps = {
   sections: [],
   summaryListClassModifiers: null,
   title: DEFAULT_TITLE,
-  type: null
+  type: null,
+  hideBlankRows: false
 };
 var _default = exports.default = CheckYourAnswers;

package/dist/components/CheckYourAnswers/CheckYourAnswers.test.js

@@ -771,5 +771,54 @@ describe('components', function () {
         }
       }, _callee30);
     })));
+    it('Show answers from multiple address fields into in one DL correctly when hideBlankRows is true', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee32() {
+      var ADDRESS_DATA, GROUP_PAGES, cya, groupedComponent, keyGroup, valueGroup, changeButtonDiv, changeButton;
+      return _regeneratorRuntime().wrap(function _callee32$(_context32) {
+        while (1) switch (_context32.prev = _context32.next) {
+          case 0:
+            ADDRESS_DATA = _utils.default.Data.setupForm(_group.default.pages, _group.default.components, _groupData.default);
+            GROUP_PAGES = _utils.default.FormPage.getAll(_group.default.pages, _group.default.components, _objectSpread({}, ADDRESS_DATA));
+            _context32.next = 4;
+            return (0, _testUtils.act)( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee31() {
+              return _regeneratorRuntime().wrap(function _callee31$(_context31) {
+                while (1) switch (_context31.prev = _context31.next) {
+                  case 0:
+                    (0, _setupTests.renderDomWithValidation)( /*#__PURE__*/_react.default.createElement(_CheckYourAnswers.default, {
+                      pages: GROUP_PAGES,
+                      onRowAction: ON_ROW_ACTION,
+                      onAction: ON_ACTION,
+                      hide_title: true,
+                      hideBlankRows: true
+                    }), container);
+                  case 1:
+                  case "end":
+                    return _context31.stop();
+                }
+              }, _callee31);
+            })));
+          case 4:
+            cya = checkCYA(container);
+            groupedComponent = cya.childNodes[6];
+            keyGroup = groupedComponent.childNodes[0].childNodes[0].childNodes[0];
+            expect(keyGroup.tagName).toEqual('DT');
+            expect(keyGroup.textContent).toEqual('Address details');
+            valueGroup = groupedComponent.childNodes[0].childNodes[0].childNodes[1];
+            expect(valueGroup.childNodes.length).toEqual(4);
+            expect(valueGroup.tagName).toEqual('DD');
+            expect(valueGroup.childNodes[0].textContent).toContain('10 Downing Street');
+            expect(valueGroup.childNodes[1].textContent).toContain('City of Westminster');
+            expect(valueGroup.childNodes[2].textContent).toContain('London');
+            expect(valueGroup.childNodes[3].textContent).toContain('SW1A 2AA');
+            changeButtonDiv = groupedComponent.childNodes[0].childNodes[0].childNodes[2];
+            expect(changeButtonDiv.classList).toContain('govuk-summary-list__actions');
+            changeButton = changeButtonDiv.childNodes[0];
+            expect(changeButton.tagName).toEqual('A');
+            expect(changeButton.textContent).toEqual('Change address details');
+          case 21:
+          case "end":
+            return _context32.stop();
+        }
+      }, _callee32);
+    })));
   });
 });

package/dist/components/FormRenderer/FormRenderer.js

@@ -59,7 +59,8 @@ var FormRenderer = function FormRenderer(_ref) {
     summaryListClassModifiers = _ref.summaryListClassModifiers,
     noChangeAction = _ref.noChangeAction,
     newPageId = _ref.newPageId,
-    viewOnly = _ref.viewOnly;
+    viewOnly = _ref.viewOnly,
+    hideBlankRows = _ref.hideBlankRows;
   return /*#__PURE__*/_react.default.createElement(_context.HooksContextProvider, {
     overrides: hooks
   }, /*#__PURE__*/_react.default.createElement(_context.ValidationContextProvider, null, /*#__PURE__*/_react.default.createElement(InternalFormRenderer, {
@@ -78,7 +79,8 @@ var FormRenderer = function FormRenderer(_ref) {
     summaryListClassModifiers: summaryListClassModifiers,
     noChangeAction: noChangeAction,
     newPageId: newPageId,
-    viewOnly: viewOnly
+    viewOnly: viewOnly,
+    hideBlankRows: hideBlankRows
   })));
 };
 var DEFAULT_CLASS = exports.DEFAULT_CLASS = 'hods-form';
@@ -99,7 +101,8 @@ var InternalFormRenderer = function InternalFormRenderer(_ref2) {
     summaryListClassModifiers = _ref2.summaryListClassModifiers,
     noChangeAction = _ref2.noChangeAction,
     newPageId = _ref2.newPageId,
-    viewOnly = _ref2.viewOnly;
+    viewOnly = _ref2.viewOnly,
+    hideBlankRows = _ref2.hideBlankRows;
   // Set up the initial states.
   var _useState = (0, _react.useState)({}),
     _useState2 = _slicedToArray(_useState, 2),
@@ -341,7 +344,8 @@ var InternalFormRenderer = function InternalFormRenderer(_ref2) {
     noChangeAction: (_formState$cya$hideCh = formState.cya.hideChangeActions) !== null && _formState$cya$hideCh !== void 0 ? _formState$cya$hideCh : noChangeAction,
     noGroupAction: (_formState$cya$hideGr = formState.cya.hideGroupActions) !== null && _formState$cya$hideGr !== void 0 ? _formState$cya$hideGr : false,
     sections: typeof hubDetails !== 'undefined' ? hubDetails.sections : [],
-    type: type
+    type: type,
+    hideBlankRows: hideBlankRows
   })), hub === _models.HubFormats.TASK && formState.pageId === _models.FormPages.HUB && /*#__PURE__*/_react.default.createElement(_TaskList.default, _extends({}, taskDetails, {
     refNumber: data.businessKey,
     onTaskAction: function onTaskAction(task) {
@@ -398,7 +402,8 @@ var propTypes = {
   title: _propTypes.default.string,
   /** See <a href="/?path=/docs/f-json--page#formtypes">FormTypes</a>. */
   type: _propTypes.default.oneOf([_models.FormTypes.CYA, _models.FormTypes.FORM, _models.FormTypes.HUB, _models.FormTypes.TASK, _models.FormTypes.WIZARD, _models.FormTypes.TASK_CYA, _models.FormTypes.FORM_WITH_TASK]).isRequired,
-  viewOnly: _propTypes.default.bool
+  viewOnly: _propTypes.default.bool,
+  hideBlankRows: _propTypes.default.bool
 };
 var defaultProps = {
   classBlock: DEFAULT_CLASS,
@@ -419,7 +424,8 @@ var defaultProps = {
   noChangeAction: false,
   summaryListClassModifiers: [],
   title: '',
-  viewOnly: true
+  viewOnly: true,
+  hideBlankRows: false
 };
 FormRenderer.propTypes = propTypes;
 InternalFormRenderer.propTypes = propTypes;

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

@@ -1119,5 +1119,63 @@ describe('components', function () {
         }
       }, _callee38);
     })));
+    it('should handle page navigation correctly when hideBlankRows is true', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee40() {
+      var ON_PAGE_CHANGE_CALLS, ON_PAGE_CHANGE, HOOKS, form, hub, _hub$childNodes7, lineManagerList, link, page, pageHeading, continueButton, newPageHeading;
+      return _regeneratorRuntime().wrap(function _callee40$(_context40) {
+        while (1) switch (_context40.prev = _context40.next) {
+          case 0:
+            ON_PAGE_CHANGE_CALLS = [];
+            ON_PAGE_CHANGE = function ON_PAGE_CHANGE(pageId) {
+              ON_PAGE_CHANGE_CALLS.push(pageId);
+            };
+            HOOKS = {
+              onPageChange: ON_PAGE_CHANGE
+            };
+            _context40.next = 5;
+            return (0, _testUtils.act)( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee39() {
+              return _regeneratorRuntime().wrap(function _callee39$(_context39) {
+                while (1) switch (_context39.prev = _context39.next) {
+                  case 0:
+                    (0, _reactDom.render)( /*#__PURE__*/_react2.default.createElement(_FormRenderer.default, _extends({}, _userProfile.default, {
+                      data: _userProfileData.default,
+                      hooks: HOOKS,
+                      hideBlankRows: true
+                    })), container);
+                  case 1:
+                  case "end":
+                    return _context39.stop();
+                }
+              }, _callee39);
+            })));
+          case 5:
+            form = checkForm(container); // Navigate to the "Add or change a line manager" page.
+            hub = form.childNodes[1]; // Hub = CYA
+            _hub$childNodes7 = _slicedToArray(hub.childNodes, 4), lineManagerList = _hub$childNodes7[3];
+            link = getChangeLink(lineManagerList);
+            expect(ON_PAGE_CHANGE_CALLS.length).toEqual(0);
+            _react.fireEvent.click(link, {});
+            expect(ON_PAGE_CHANGE_CALLS[0]).toEqual(_userProfile.default.pages[4].id);
+
+            // Should be on the page explaining what changing the line manager means.
+            page = form.childNodes[0];
+            pageHeading = page.childNodes[0];
+            expect(pageHeading.tagName).toEqual('H1');
+            expect(pageHeading.textContent).toEqual(_userProfile.default.pages[4].title);
+
+            // Now click on the "Continue" button on here.
+            continueButton = getContinueButton(page);
+            expect(ON_PAGE_CHANGE_CALLS.length).toEqual(1);
+            _react.fireEvent.click(continueButton, {});
+            expect(ON_PAGE_CHANGE_CALLS.length).toEqual(2);
+            expect(ON_PAGE_CHANGE_CALLS[1]).toEqual(_userProfile.default.pages[5].id);
+            newPageHeading = form.childNodes[0].childNodes[0];
+            expect(newPageHeading.tagName).toEqual('H1');
+            expect(newPageHeading.textContent).toEqual(_userProfile.default.pages[5].title);
+          case 24:
+          case "end":
+            return _context40.stop();
+        }
+      }, _callee40);
+    })));
   });
 });

package/package.json

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