@ukhomeoffice/cop-react-form-renderer 2.6.2 → 2.7.4

package/dist/components/CheckYourAnswers/Answer.js

@@ -9,6 +9,8 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _react = _interopRequireDefault(require("react"));
 
+var _VisuallyHidden = _interopRequireDefault(require("@ukhomeoffice/cop-react-components/dist/VisuallyHidden"));
+
 var _FormComponent = _interopRequireDefault(require("../FormComponent"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -24,7 +26,7 @@ var Answer = function Answer(_ref) {
       component = _ref.component;
 
   if (!value) {
-    return null;
+    return /*#__PURE__*/_react.default.createElement(_VisuallyHidden.default, null, "No answer");
   }
 
   if (!component) {

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

@@ -29,9 +29,10 @@ describe('components', function () {
                 value: VALUE,
                 component: COMPONENT
               })), container = _render.container;
-              expect(container.childNodes.length).toEqual(0);
+              expect(container.childNodes.length).toEqual(1);
+              expect(container.childNodes[0].textContent).toEqual('No answer');
 
-            case 4:
+            case 5:
             case "end":
               return _context.stop();
           }

package/dist/components/CheckYourAnswers/CheckYourAnswers.js

@@ -64,7 +64,8 @@ var CheckYourAnswers = function CheckYourAnswers(_ref) {
       hide_actions = _ref.hide_actions,
       hide_title = _ref.hide_title,
       summaryListClassModifiers = _ref.summaryListClassModifiers,
-      noChangeAction = _ref.noChangeAction;
+      noChangeAction = _ref.noChangeAction,
+      groups = _ref.groups;
 
   var _useState = (0, _react.useState)([]),
       _useState2 = _slicedToArray(_useState, 2),
@@ -76,6 +77,11 @@ var CheckYourAnswers = function CheckYourAnswers(_ref) {
       errors = _useState4[0],
       setErrors = _useState4[1];
 
+  var _useState5 = (0, _react.useState)([]),
+      _useState6 = _slicedToArray(_useState5, 2),
+      listOfGroups = _useState6[0],
+      setListOfGroups = _useState6[1];
+
   (0, _react.useEffect)(function () {
     var getRows = function getRows(page, pageIndex) {
       var rows = _utils.default.CheckYourAnswers.getRows(page, onRowAction);
@@ -110,22 +116,56 @@ var CheckYourAnswers = function CheckYourAnswers(_ref) {
     setErrors(errors);
   };
 
+  (0, _react.useEffect)(function () {
+    var groupsList = function groupsList() {
+      var groupIds = [];
+      groups !== undefined && groups.length && groups.forEach(function (group) {
+        var groupedPageId = group.pageId;
+        groupIds.push(groupedPageId);
+      });
+      setListOfGroups(groupIds);
+    };
+
+    groupsList();
+  }, [setListOfGroups, groups]);
+
+  var isGroup = function isGroup(pageId) {
+    return listOfGroups.includes(pageId);
+  };
+
+  var getGroupForPage = function getGroupForPage(pageId) {
+    var groupAnswer;
+    groups !== undefined && groups.length && pageId !== undefined && groups.forEach(function (group) {
+      if (group.pageId === pageId) {
+        groupAnswer = group;
+      }
+    });
+    return groupAnswer;
+  };
+
   return /*#__PURE__*/_react.default.createElement("div", {
     className: DEFAULT_CLASS
   }, title && !hide_title && /*#__PURE__*/_react.default.createElement(_copReactComponents.LargeHeading, {
     key: "heading"
   }, title), errors && errors.length > 0 && /*#__PURE__*/_react.default.createElement(_copReactComponents.ErrorSummary, {
     errors: errors
-  }), pages && pages.map(function (page, pageIndex) {
-    var pageMarginBottom = isLastPage(pageIndex) ? DEFAULT_MARGIN_BOTTOM : listMarginBottom;
+  }), 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 currentGroup;
+    isGroup(page.id) && (currentGroup = getGroupForPage(page.id));
     var className = "govuk-!-margin-bottom-".concat(pageMarginBottom);
+    var hideActionButtons;
+    isGroup(page.id) ? hideActionButtons = true : hideActionButtons = noChangeAction;
     return /*#__PURE__*/_react.default.createElement(_react.Fragment, {
       key: pageIndex
-    }, !hide_page_titles && page.title && /*#__PURE__*/_react.default.createElement(_copReactComponents.MediumHeading, null, page.title), /*#__PURE__*/_react.default.createElement(_SummaryList.default, {
+    }, !hide_page_titles && page.title && !isGroup(page.id) && /*#__PURE__*/_react.default.createElement(_copReactComponents.MediumHeading, null, page.title), isGroup(page.id) && /*#__PURE__*/_react.default.createElement("div", {
+      className: "group-title"
+    }, /*#__PURE__*/_react.default.createElement(_copReactComponents.MediumHeading, null, currentGroup.title ? currentGroup.title : page.title)), /*#__PURE__*/_react.default.createElement(_SummaryList.default, {
       className: className,
       rows: page.rows,
       classModifiers: summaryListClassModifiers,
-      noChangeAction: noChangeAction
+      noChangeAction: hideActionButtons,
+      isGroup: isGroup(page.id)
     }));
   }), !hide_actions && /*#__PURE__*/_react.default.createElement(_PageActions.default, {
     actions: actions,

package/dist/components/CheckYourAnswers/CheckYourAnswers.scss

@@ -1,2 +1,12 @@
 @import "node_modules/govuk-frontend/govuk/_base";
 @import "node_modules/govuk-frontend/govuk/overrides/spacing";
+
+.govuk-link {
+    @include govuk-font($size: 19);
+    color: govuk-colour('blue');
+    cursor: pointer;
+  }
+
+.group-title{
+    padding-right: 75px;
+}