@hmcts/ccd-case-ui-toolkit 7.0.13 → 7.0.14-address-field-check

package/fesm2020/hmcts-ccd-case-ui-toolkit.mjs

@@ -8,7 +8,7 @@ import * as i1$1 from '@angular/router';
 import { RouterModule, NavigationStart, NavigationEnd } from '@angular/router';
 import * as i3 from '@angular/forms';
 import { NG_VALUE_ACCESSOR, NG_VALIDATORS, FormArray, FormGroup, FormControl, Validators, ReactiveFormsModule, FormsModule } from '@angular/forms';
-import { throwError, Subject, EMPTY, Observable, of, BehaviorSubject, timer, fromEvent, forkJoin, Subscription, combineLatest } from 'rxjs';
+import { throwError, Subject, EMPTY, Observable, BehaviorSubject, of, timer, fromEvent, forkJoin, Subscription, combineLatest } from 'rxjs';
 import * as i1$2 from '@angular/common/http';
 import { HttpErrorResponse, HttpHeaders, HttpParams } from '@angular/common/http';
 import { catchError, map, publish, refCount, switchMap, debounceTime, delay, distinctUntilChanged, finalize, timeout, mergeMap, retryWhen, tap, delayWhen, publishReplay, take, first, takeUntil, filter } from 'rxjs/operators';
@@ -1241,9 +1241,14 @@ class HttpError {
     }
     static from(response) {
         const error = new HttpError();
+        if (response?.status === 429) {
+            error.error = HttpError.MESSAGE_ERROR_429;
+            error.status = response.status;
+            error.message = response.message;
+        }
         // Check that the HttpErrorResponse contains an "error" object before mapping the error properties
         if (!!(response && response.error)) {
-            Object.keys(error).forEach(key => {
+            Object.keys(error).forEach((key) => {
                 error[key] = response.error.hasOwnProperty(key) && response.error[key] ? response.error[key] : error[key];
             });
         }
@@ -1260,6 +1265,7 @@ class HttpError {
 HttpError.DEFAULT_ERROR = 'Unknown error';
 HttpError.DEFAULT_MESSAGE = 'Something unexpected happened, our technical staff have been automatically notified';
 HttpError.DEFAULT_STATUS = 500;
+HttpError.MESSAGE_ERROR_429 = 'Your request was rate limited. Please wait a few seconds before retrying your document upload';
 
 /**
  * `Oauth2Service` and `AuthService` cannot be merged as it creates a cyclic dependency on `AuthService` through `HttpErrorService`.
@@ -4606,7 +4612,11 @@ class AbstractFormFieldComponent {
             return control;
         }
         const existing = container.controls[this.caseField.id];
+        // update the field value which has been set in mid-event call back
         if (existing) {
+            if (existing.value === null && this.caseField?.value) {
+                existing.value = this.caseField.value;
+            }
             if (replace) {
                 // Set the validators on the replacement with what already exists.
                 control.setValidators(existing.validator);
@@ -6253,6 +6263,7 @@ class AddressesService {
     constructor(http, appConfig) {
         this.http = http;
         this.appConfig = appConfig;
+        this.mandatoryError = new BehaviorSubject(false);
     }
     getAddressesForPostcode(postcode) {
         return this.http
@@ -6261,6 +6272,12 @@ class AddressesService {
             .pipe(map(res => res.results))
             .pipe(map(output => output.map(addresses => this.format(new AddressParser().parse(addresses[AddressType.DPA])))));
     }
+    getMandatoryError() {
+        return this.mandatoryError.asObservable();
+    }
+    setMandatoryError(value) {
+        this.mandatoryError.next(value);
+    }
     format(addressModel) {
         return this.formatAddressLines(this.shiftAddressLinesUp(addressModel));
     }
@@ -9616,7 +9633,7 @@ function CaseEditPageComponent_ccd_case_event_completion_11_Template(rf, ctx) {
     i0.ɵɵproperty("eventCompletionParams", ctx_r8.caseEdit.eventCompletionParams);
 } }
 class CaseEditPageComponent {
-    constructor(caseEdit, route, formValueService, formErrorService, cdRef, pageValidationService, dialog, caseFieldService, caseEditDataService, loadingService, validPageListCaseFieldsService) {
+    constructor(caseEdit, route, formValueService, formErrorService, cdRef, pageValidationService, dialog, caseFieldService, caseEditDataService, loadingService, validPageListCaseFieldsService, addressService) {
         this.caseEdit = caseEdit;
         this.route = route;
         this.formValueService = formValueService;
@@ -9628,6 +9645,7 @@ class CaseEditPageComponent {
         this.caseEditDataService = caseEditDataService;
         this.loadingService = loadingService;
         this.validPageListCaseFieldsService = validPageListCaseFieldsService;
+        this.addressService = addressService;
         this.triggerTextStart = CaseEditPageComponent.TRIGGER_TEXT_START;
         this.triggerTextIgnoreWarnings = CaseEditPageComponent.TRIGGER_TEXT_CONTINUE;
         this.formValuesChanged = false;
@@ -9750,7 +9768,14 @@ class CaseEditPageComponent {
                     }
                 }
                 if (fieldElement.hasError('required')) {
-                    this.caseEditDataService.addFormValidationError({ id, message: `%FIELDLABEL% is required`, label });
+                    if (casefield.id === 'AddressLine1') {
+                        // EUI-1067 - Display more relevant error message to user and correctly navigate to the field
+                        this.addressService.setMandatoryError(true);
+                        this.caseEditDataService.addFormValidationError({ id: `${path}_${path}`, message: `An address is required` });
+                    }
+                    else {
+                        this.caseEditDataService.addFormValidationError({ id, message: `%FIELDLABEL% is required`, label });
+                    }
                     fieldElement.markAsDirty();
                     // For the JudicialUser field type, an error needs to be set on the component so that an error message
                     // can be displayed at field level
@@ -9825,6 +9850,7 @@ class CaseEditPageComponent {
             }
         }
         if (!this.caseEdit.isSubmitting && !this.currentPageIsNotValid()) {
+            this.addressService.setMandatoryError(false);
             console.log('Case Edit Error', this.caseEdit.error);
             if (this.caseEdit.validPageList.findIndex(page => page.id === this.currentPage.id) === -1) {
                 this.caseEdit.validPageList.push(this.currentPage);
@@ -10124,7 +10150,7 @@ CaseEditPageComponent.RESUMED_FORM_SAVE = 'RESUMED_FORM_SAVE';
 CaseEditPageComponent.TRIGGER_TEXT_START = 'Continue';
 CaseEditPageComponent.TRIGGER_TEXT_SAVE = 'Save and continue';
 CaseEditPageComponent.TRIGGER_TEXT_CONTINUE = 'Ignore Warning and Continue';
-CaseEditPageComponent.ɵfac = function CaseEditPageComponent_Factory(t) { return new (t || CaseEditPageComponent)(i0.ɵɵdirectiveInject(CaseEditComponent), i0.ɵɵdirectiveInject(i1$1.ActivatedRoute), i0.ɵɵdirectiveInject(FormValueService), i0.ɵɵdirectiveInject(FormErrorService), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(PageValidationService), i0.ɵɵdirectiveInject(i1$3.MatLegacyDialog), i0.ɵɵdirectiveInject(CaseFieldService), i0.ɵɵdirectiveInject(CaseEditDataService), i0.ɵɵdirectiveInject(LoadingService), i0.ɵɵdirectiveInject(ValidPageListCaseFieldsService)); };
+CaseEditPageComponent.ɵfac = function CaseEditPageComponent_Factory(t) { return new (t || CaseEditPageComponent)(i0.ɵɵdirectiveInject(CaseEditComponent), i0.ɵɵdirectiveInject(i1$1.ActivatedRoute), i0.ɵɵdirectiveInject(FormValueService), i0.ɵɵdirectiveInject(FormErrorService), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(PageValidationService), i0.ɵɵdirectiveInject(i1$3.MatLegacyDialog), i0.ɵɵdirectiveInject(CaseFieldService), i0.ɵɵdirectiveInject(CaseEditDataService), i0.ɵɵdirectiveInject(LoadingService), i0.ɵɵdirectiveInject(ValidPageListCaseFieldsService), i0.ɵɵdirectiveInject(AddressesService)); };
 CaseEditPageComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseEditPageComponent, selectors: [["ccd-case-edit-page"]], decls: 12, vars: 11, consts: [[4, "ngIf"], [4, "ngIf", "ngIfThen", "ngIfElse"], ["titleBlock", ""], ["idBlock", ""], ["class", "govuk-error-summary", "aria-labelledby", "error-summary-title", "role", "alert", "tabindex", "-1", "data-module", "govuk-error-summary", 4, "ngIf"], [3, "error"], [3, "triggerTextContinue", "triggerTextIgnore", "callbackErrorsSubject", "callbackErrorsContext"], [1, "width-50"], ["class", "form", 3, "formGroup", "submit", 4, "ngIf"], [3, "eventCompletionParams", "eventCanBeCompleted", 4, "ngIf"], ["class", "govuk-heading-l", 4, "ngIf"], [1, "govuk-heading-l"], [1, "govuk-caption-l"], [3, "content"], ["class", "heading-h2", 4, "ngIf"], [1, "heading-h2"], ["aria-labelledby", "error-summary-title", "role", "alert", "tabindex", "-1", "data-module", "govuk-error-summary", 1, "govuk-error-summary"], ["id", "error-summary-title", 1, "govuk-error-summary__title"], ["class", "govuk-error-summary__body", 4, "ngFor", "ngForOf"], [1, "govuk-error-summary__body"], [1, "govuk-list", "govuk-error-summary__list"], [1, "validation-error", 3, "click"], [1, "form", 3, "formGroup", "submit"], ["id", "fieldset-case-data"], [2, "display", "none"], ["id", "caseEditForm", 3, "fields", "formGroup", "caseFields", "pageChangeSubject", "valuesChanged", 4, "ngIf"], ["class", "grid-row", 4, "ngIf"], [1, "form-group", "form-group-related"], ["type", "button", 1, "button", "button-secondary", 3, "disabled", "click"], ["type", "submit", 1, "button", 3, "disabled"], [1, "cancel"], ["href", "javascript:void(0)", 3, "click"], ["id", "caseEditForm", 3, "fields", "formGroup", "caseFields", "pageChangeSubject", "valuesChanged"], [1, "grid-row"], [1, "column-two-thirds", "rightBorderSeparator"], ["id", "caseEditForm1", 3, "fields", "formGroup", "caseFields"], [1, "column-one-third"], ["id", "caseEditForm2", 3, "fields", "formGroup", "caseFields"], [3, "eventCompletionParams", "eventCanBeCompleted"]], template: function CaseEditPageComponent_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵtemplate(0, CaseEditPageComponent_ng_container_0_Template, 3, 2, "ng-container", 0);
         i0.ɵɵtemplate(1, CaseEditPageComponent_div_1_Template, 1, 0, "div", 1);
@@ -10159,7 +10185,7 @@ CaseEditPageComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseE
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseEditPageComponent, [{
         type: Component,
         args: [{ selector: 'ccd-case-edit-page', template: "<ng-container *ngIf=\"currentPage\">\n  <h1 *ngIf=\"!currentPage.label\" class=\"govuk-heading-l\">{{eventTrigger.name | rpxTranslate}}</h1>\n  <ng-container *ngIf=\"currentPage.label\">\n    <span class=\"govuk-caption-l\">{{ eventTrigger.name | rpxTranslate}}</span>\n    <h1 class=\"govuk-heading-l\">{{currentPage.label | rpxTranslate}}</h1>\n  </ng-container>\n</ng-container>\n\n<!--Case ID or Title -->\n<div *ngIf=\"getCaseTitle(); then titleBlock; else idBlock\"></div>\n<ng-template #titleBlock>\n  <ccd-markdown [content]=\"getCaseTitle() | ccdCaseTitle: caseFields : editForm.controls['data']\"></ccd-markdown>\n</ng-template>\n<ng-template #idBlock>\n  <h2 *ngIf=\"getCaseId()\" class=\"heading-h2\">#{{ getCaseId() | ccdCaseReference }}</h2>\n</ng-template>\n\n<!-- Error message summary -->\n<div *ngIf=\"validationErrors.length > 0\" class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    {{'There is a problem' | rpxTranslate}}\n  </h2>\n  <div *ngFor=\"let validationError of validationErrors\" class=\"govuk-error-summary__body\">\n    <ul class=\"govuk-list govuk-error-summary__list\">\n      <li>\n        <a (click)=\"navigateToErrorElement(validationError.id)\" class=\"validation-error\">\n          {{ validationError.message | rpxTranslate: getRpxTranslatePipeArgs(validationError.label | rpxTranslate): null }}\n        </a>\n      </li>\n    </ul>\n  </div>\n</div>\n\n<ccd-case-edit-generic-errors [error]=\"caseEdit.error\"></ccd-case-edit-generic-errors>\n\n<ccd-callback-errors\n  [triggerTextContinue]=\"triggerTextStart\"\n  [triggerTextIgnore]=\"triggerTextIgnoreWarnings\"\n  [callbackErrorsSubject]=\"caseEdit.callbackErrorsSubject\"\n  (callbackErrorsContext)=\"callbackErrorsNotify($event)\">\n</ccd-callback-errors>\n<div class=\"width-50\">\n  <form *ngIf=\"currentPage\" class=\"form\" [formGroup]=\"editForm\" (submit)=\"submit()\">\n    <fieldset id=\"fieldset-case-data\">\n      <legend style=\"display: none;\"></legend>\n      <!-- single column -->\n      <ccd-case-edit-form id='caseEditForm' *ngIf=\"!currentPage.isMultiColumn()\" [fields]=\"currentPage.getCol1Fields()\"\n                          [formGroup]=\"editForm.controls['data']\" [caseFields]=\"caseFields\"\n                          [pageChangeSubject]=\"pageChangeSubject\"\n                          (valuesChanged)=\"applyValuesChanged($event)\"></ccd-case-edit-form>\n      <!-- two columns -->\n      <div *ngIf=\"currentPage.isMultiColumn()\" class=\"grid-row\">\n        <div class=\"column-two-thirds rightBorderSeparator\">\n          <ccd-case-edit-form id='caseEditForm1' [fields]=\"currentPage.getCol1Fields()\"\n                              [formGroup]=\"editForm.controls['data']\" [caseFields]=\"caseFields\"></ccd-case-edit-form>\n        </div>\n        <div class=\"column-one-third\">\n          <ccd-case-edit-form id='caseEditForm2' [fields]=\"currentPage.getCol2Fields()\"\n                              [formGroup]=\"editForm.controls['data']\" [caseFields]=\"caseFields\"></ccd-case-edit-form>\n        </div>\n      </div>\n    </fieldset>\n\n    <div class=\"form-group form-group-related\">\n      <button class=\"button button-secondary\" type=\"button\" [disabled]=\"!(hasPreviousPage$ | async)\" (click)=\"toPreviousPage()\">\n        {{'Previous' | rpxTranslate}}\n      </button>\n      <button class=\"button\" type=\"submit\" [disabled]=\"submitting()\">{{triggerText | rpxTranslate}}</button>\n    </div>\n\n    <p class=\"cancel\"><a (click)=\"cancel()\" href=\"javascript:void(0)\">{{getCancelText() | rpxTranslate}}</a></p>\n  </form>\n</div>\n\n<ccd-case-event-completion *ngIf=\"caseEdit.isEventCompletionChecksRequired\"\n  [eventCompletionParams]=\"caseEdit.eventCompletionParams\"\n  (eventCanBeCompleted)=\"onEventCanBeCompleted($event)\">\n</ccd-case-event-completion>\n", styles: [".rightBorderSeparator{border-right-width:4px;border-right-color:#ffcc02;border-right-style:solid}.validation-error{cursor:pointer;text-decoration:underline;color:#d4351c}\n"] }]
-    }], function () { return [{ type: CaseEditComponent }, { type: i1$1.ActivatedRoute }, { type: FormValueService }, { type: FormErrorService }, { type: i0.ChangeDetectorRef }, { type: PageValidationService }, { type: i1$3.MatLegacyDialog }, { type: CaseFieldService }, { type: CaseEditDataService }, { type: LoadingService }, { type: ValidPageListCaseFieldsService }]; }, null); })();
+    }], function () { return [{ type: CaseEditComponent }, { type: i1$1.ActivatedRoute }, { type: FormValueService }, { type: FormErrorService }, { type: i0.ChangeDetectorRef }, { type: PageValidationService }, { type: i1$3.MatLegacyDialog }, { type: CaseFieldService }, { type: CaseEditDataService }, { type: LoadingService }, { type: ValidPageListCaseFieldsService }, { type: AddressesService }]; }, null); })();
 
 class CallbackErrorsContext {
 }
@@ -10606,6 +10632,17 @@ class AddressOption {
     }
 }
 
+class AddressValidationConstants {
+}
+// allow alpha-numeric characters and spaces possibly between a connecting - character
+// this applies validation while allowing partial postcodes
+AddressValidationConstants.REGEX_POSTCODE = /^([A-Za-z0-9]-*| )+$/;
+AddressValidationConstants.ɵfac = function AddressValidationConstants_Factory(t) { return new (t || AddressValidationConstants)(); };
+AddressValidationConstants.ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: AddressValidationConstants, factory: AddressValidationConstants.ɵfac });
+(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(AddressValidationConstants, [{
+        type: Injectable
+    }], null, null); })();
+
 class FieldsFilterPipe {
     /**
      * Complex type should have at least on simple field descendant with a value.
@@ -10872,8 +10909,9 @@ function WriteAddressFieldComponent_div_1_div_4_span_5_Template(rf, ctx) { if (r
     i0.ɵɵpipe(2, "rpxTranslate");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
+    const ctx_r5 = i0.ɵɵnextContext(3);
     i0.ɵɵadvance(1);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(2, 1, "Enter the Postcode"));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(2, 1, ctx_r5.errorMessage));
 } }
 const _c1$n = function (a0) { return { "form-group-error": a0 }; };
 const _c2$2 = function (a0) { return { "govuk-input--error": a0 }; };
@@ -10904,42 +10942,56 @@ function WriteAddressFieldComponent_div_1_div_4_Template(rf, ctx) { if (rf & 1)
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(9, 11, "Find address"));
 } }
-function WriteAddressFieldComponent_div_1_div_5_option_6_Template(rf, ctx) { if (rf & 1) {
+function WriteAddressFieldComponent_div_1_div_5_span_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 14);
+    i0.ɵɵtext(1);
+    i0.ɵɵpipe(2, "rpxTranslate");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r8 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance(1);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(2, 1, ctx_r8.errorMessage));
+} }
+function WriteAddressFieldComponent_div_1_div_5_option_7_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "option", 18);
     i0.ɵɵtext(1);
     i0.ɵɵpipe(2, "rpxTranslate");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const addressOption_r9 = ctx.$implicit;
-    i0.ɵɵproperty("ngValue", addressOption_r9.value);
+    const addressOption_r10 = ctx.$implicit;
+    i0.ɵɵproperty("ngValue", addressOption_r10.value);
     i0.ɵɵadvance(1);
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(2, 2, addressOption_r9.description), " ");
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(2, 2, addressOption_r10.description), " ");
 } }
 function WriteAddressFieldComponent_div_1_div_5_Template(rf, ctx) { if (rf & 1) {
-    const _r11 = i0.ɵɵgetCurrentView();
+    const _r12 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 15)(1, "label", 9)(2, "span", 10);
     i0.ɵɵtext(3);
     i0.ɵɵpipe(4, "rpxTranslate");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(5, "select", 16);
-    i0.ɵɵlistener("change", function WriteAddressFieldComponent_div_1_div_5_Template_select_change_5_listener() { i0.ɵɵrestoreView(_r11); const ctx_r10 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r10.addressSelected()); });
-    i0.ɵɵtemplate(6, WriteAddressFieldComponent_div_1_div_5_option_6_Template, 3, 4, "option", 17);
+    i0.ɵɵtemplate(5, WriteAddressFieldComponent_div_1_div_5_span_5_Template, 3, 3, "span", 11);
+    i0.ɵɵelementStart(6, "select", 16);
+    i0.ɵɵlistener("change", function WriteAddressFieldComponent_div_1_div_5_Template_select_change_6_listener() { i0.ɵɵrestoreView(_r12); const ctx_r11 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r11.addressSelected()); });
+    i0.ɵɵtemplate(7, WriteAddressFieldComponent_div_1_div_5_option_7_Template, 3, 4, "option", 17);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r3 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(9, _c1$n, ctx_r3.noAddressSelected));
     i0.ɵɵadvance(1);
     i0.ɵɵproperty("for", ctx_r3.createElementId("addressList"));
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(4, 5, "Select an address"));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(4, 7, "Select an address"));
     i0.ɵɵadvance(2);
+    i0.ɵɵproperty("ngIf", ctx_r3.noAddressSelected);
+    i0.ɵɵadvance(1);
     i0.ɵɵproperty("id", ctx_r3.createElementId("addressList"))("formControl", ctx_r3.addressList);
     i0.ɵɵadvance(1);
     i0.ɵɵproperty("ngForOf", ctx_r3.addressOptions);
 } }
 function WriteAddressFieldComponent_div_1_a_6_Template(rf, ctx) { if (rf & 1) {
-    const _r13 = i0.ɵɵgetCurrentView();
+    const _r14 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "a", 19);
-    i0.ɵɵlistener("click", function WriteAddressFieldComponent_div_1_a_6_Template_a_click_0_listener() { i0.ɵɵrestoreView(_r13); const ctx_r12 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r12.blankAddress()); });
+    i0.ɵɵlistener("click", function WriteAddressFieldComponent_div_1_a_6_Template_a_click_0_listener() { i0.ɵɵrestoreView(_r14); const ctx_r13 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r13.blankAddress()); });
     i0.ɵɵtext(1);
     i0.ɵɵpipe(2, "rpxTranslate");
     i0.ɵɵelementEnd();
@@ -10953,7 +11005,7 @@ function WriteAddressFieldComponent_div_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵpipe(3, "ccdFieldLabel");
     i0.ɵɵelementEnd();
     i0.ɵɵtemplate(4, WriteAddressFieldComponent_div_1_div_4_Template, 10, 17, "div", 5);
-    i0.ɵɵtemplate(5, WriteAddressFieldComponent_div_1_div_5_Template, 7, 7, "div", 6);
+    i0.ɵɵtemplate(5, WriteAddressFieldComponent_div_1_div_5_Template, 8, 11, "div", 6);
     i0.ɵɵtemplate(6, WriteAddressFieldComponent_div_1_a_6_Template, 3, 3, "a", 7);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -10972,19 +11024,30 @@ class WriteAddressFieldComponent extends AbstractFieldWriteComponent {
         super();
         this.isCompoundPipe = isCompoundPipe;
         this.addressFormGroup = new FormGroup({});
+        this.errorMessage = WriteAddressFieldComponent.REQUIRED_ERROR_MESSAGE;
         this.missingPostcode = false;
+        this.noAddressSelected = false;
         this.addressesService = addressesService;
     }
     ngOnInit() {
         if (!this.isComplexWithHiddenFields()) {
-            this.postcode = new FormControl('');
+            this.postcode = new FormControl('', [Validators.required]);
             this.addressFormGroup.addControl('postcode', this.postcode);
             this.addressList = new FormControl('');
             this.addressFormGroup.addControl('address', this.addressList);
         }
+        this.addressesService.getMandatoryError().subscribe((value) => {
+            this.updateErrorsOnContinue(value);
+        });
     }
     findAddress() {
+        this.noAddressSelected = false;
         if (!this.postcode.value) {
+            this.errorMessage = WriteAddressFieldComponent.REQUIRED_ERROR_MESSAGE;
+            this.missingPostcode = true;
+        }
+        else if (!this.postcode.value.trim().match(AddressValidationConstants.REGEX_POSTCODE)) {
+            this.errorMessage = WriteAddressFieldComponent.INVALID_ERROR_MESSAGE;
             this.missingPostcode = true;
         }
         else {
@@ -11013,6 +11076,8 @@ class WriteAddressFieldComponent extends AbstractFieldWriteComponent {
     blankAddress() {
         this.caseField.value = new AddressModel();
         this.setFormValue();
+        this.missingPostcode = false;
+        this.noAddressSelected = false;
     }
     isComplexWithHiddenFields() {
         if (this.caseField.isComplex() && this.caseField.field_type.complex_fields
@@ -11044,6 +11109,7 @@ class WriteAddressFieldComponent extends AbstractFieldWriteComponent {
     addressSelected() {
         this.caseField.value = this.addressList.value;
         this.setFormValue();
+        this.noAddressSelected = false;
     }
     ngOnChanges(changes) {
         super.ngOnChanges(changes);
@@ -11064,7 +11130,14 @@ class WriteAddressFieldComponent extends AbstractFieldWriteComponent {
             this.writeComplexFieldComponent.complexGroup.setValue(this.caseField.value);
         }
     }
+    updateErrorsOnContinue(value) {
+        this.missingPostcode = value && !this.shouldShowDetailFields() && !this.addressOptions;
+        this.noAddressSelected = value && !this.shouldShowDetailFields() && !!this.addressOptions;
+        this.errorMessage = this.noAddressSelected ? 'Select an address' : this.errorMessage;
+    }
 }
+WriteAddressFieldComponent.REQUIRED_ERROR_MESSAGE = 'Enter a Postcode';
+WriteAddressFieldComponent.INVALID_ERROR_MESSAGE = 'Enter a valid Postcode';
 WriteAddressFieldComponent.ɵfac = function WriteAddressFieldComponent_Factory(t) { return new (t || WriteAddressFieldComponent)(i0.ɵɵdirectiveInject(AddressesService), i0.ɵɵdirectiveInject(IsCompoundPipe)); };
 WriteAddressFieldComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: WriteAddressFieldComponent, selectors: [["ccd-write-address-field"]], viewQuery: function WriteAddressFieldComponent_Query(rf, ctx) { if (rf & 1) {
         i0.ɵɵviewQuery(_c0$U, 5);
@@ -11073,7 +11146,7 @@ WriteAddressFieldComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type:
         let _t;
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.writeComplexFieldComponent = _t.first);
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.focusElementDirectives = _t);
-    } }, inputs: { formGroup: "formGroup" }, features: [i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], decls: 4, vars: 9, consts: [[1, "form-group", 3, "id"], [4, "ngIf"], [3, "hidden", "caseField", "renderLabel", "parent", "formGroup", "ignoreMandatory", "idPrefix"], ["writeComplexFieldComponent", ""], [1, "heading-h2"], ["class", "form-group bottom-30 postcodeLookup", 3, "id", "ngClass", 4, "ngIf"], ["class", "form-group", "id", "selectAddress", 4, "ngIf"], ["class", "manual-link bottom-30", "href", "javascript:void(0)", 3, "click", 4, "ngIf"], [1, "form-group", "bottom-30", "postcodeLookup", 3, "id", "ngClass"], [3, "for"], [1, "form-label"], ["class", "error-message", 4, "ngIf"], ["type", "text", "name", "postcode", 1, "form-control", "postcodeinput", "inline-block", 3, "ngClass", "id", "formControl"], ["type", "button", 1, "button", "button-30", 3, "click"], [1, "error-message"], ["id", "selectAddress", 1, "form-group"], ["name", "address", "focusElement", "", 1, "form-control", "ccd-dropdown", "addressList", 3, "id", "formControl", "change"], [3, "ngValue", 4, "ngFor", "ngForOf"], [3, "ngValue"], ["href", "javascript:void(0)", 1, "manual-link", "bottom-30", 3, "click"]], template: function WriteAddressFieldComponent_Template(rf, ctx) { if (rf & 1) {
+    } }, inputs: { formGroup: "formGroup" }, features: [i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], decls: 4, vars: 9, consts: [[1, "form-group", 3, "id"], [4, "ngIf"], [3, "hidden", "caseField", "renderLabel", "parent", "formGroup", "ignoreMandatory", "idPrefix"], ["writeComplexFieldComponent", ""], [1, "heading-h2"], ["class", "form-group bottom-30 postcodeLookup", 3, "id", "ngClass", 4, "ngIf"], ["class", "form-group", "id", "selectAddress", 3, "ngClass", 4, "ngIf"], ["class", "manual-link bottom-30", "href", "javascript:void(0)", 3, "click", 4, "ngIf"], [1, "form-group", "bottom-30", "postcodeLookup", 3, "id", "ngClass"], [3, "for"], [1, "form-label"], ["class", "error-message", 4, "ngIf"], ["type", "text", "name", "postcode", 1, "form-control", "postcodeinput", "inline-block", 3, "ngClass", "id", "formControl"], ["type", "button", 1, "button", "button-30", 3, "click"], [1, "error-message"], ["id", "selectAddress", 1, "form-group", 3, "ngClass"], ["name", "address", "focusElement", "", 1, "form-control", "ccd-dropdown", "addressList", 3, "id", "formControl", "change"], [3, "ngValue", 4, "ngFor", "ngForOf"], [3, "ngValue"], ["href", "javascript:void(0)", 1, "manual-link", "bottom-30", 3, "click"]], template: function WriteAddressFieldComponent_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵelementStart(0, "div", 0);
         i0.ɵɵtemplate(1, WriteAddressFieldComponent_div_1_Template, 7, 6, "div", 1);
         i0.ɵɵelement(2, "ccd-write-complex-type-field", 2, 3);
@@ -11087,7 +11160,7 @@ WriteAddressFieldComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type:
     } }, styles: [".manual-link[_ngcontent-%COMP%]{cursor:pointer;display:block;text-decoration:underline}"] });
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(WriteAddressFieldComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-write-address-field', template: "<div class=\"form-group\" [id]=\"id()\">\n  <div *ngIf=\"!isComplexWithHiddenFields()\">\n    <h2 class=\"heading-h2\">{{caseField | ccdFieldLabel}}</h2>\n\n    <div class=\"form-group bottom-30 postcodeLookup\" [id]=\"createElementId('postcodeLookup')\" [ngClass]=\"{'form-group-error': missingPostcode}\" *ngIf=\"!isExpanded\">\n      <label [for]=\"createElementId('postcodeInput')\">\n        <span class=\"form-label\">{{'Enter a UK postcode' | rpxTranslate}}</span>\n      </label>\n      <span class=\"error-message\" *ngIf=\"missingPostcode\">{{'Enter the Postcode' | rpxTranslate}}</span>\n      <input type=\"text\" [ngClass]=\"{'govuk-input--error': missingPostcode}\"\n      [id]=\"createElementId('postcodeInput')\" name=\"postcode\" class=\"form-control postcodeinput inline-block\" [formControl]=\"postcode\">\n      <button type=\"button\" class=\"button button-30\" (click)=\"findAddress()\">{{'Find address' | rpxTranslate}}</button>\n    </div>\n\n    <div class=\"form-group\" *ngIf=\"addressOptions\" id=\"selectAddress\">\n      <label [for]=\"createElementId('addressList')\">\n        <span class=\"form-label\">{{'Select an address' | rpxTranslate}}</span>\n      </label>\n\n      <select class=\"form-control ccd-dropdown addressList\" [id]=\"createElementId('addressList')\" name=\"address\" [formControl]=\"addressList\" (change)=\"addressSelected()\" focusElement>\n        <option *ngFor=\"let addressOption of addressOptions\" [ngValue]=\"addressOption.value\">\n          {{addressOption.description | rpxTranslate}}\n        </option>\n      </select>\n    </div>\n\n    <a class=\"manual-link bottom-30\" *ngIf=\"!shouldShowDetailFields()\" (click)=\"blankAddress()\" href=\"javascript:void(0)\">\n      {{\"I can't enter a UK postcode\" | rpxTranslate}}\n    </a>\n  </div>\n\n  <ccd-write-complex-type-field\n    [hidden]=\"!shouldShowDetailFields()\"\n    [caseField]=\"caseField\"\n    [renderLabel]=\"false\"\n    [parent]=\"parent\"\n    [formGroup]=\"formGroup\"\n    [ignoreMandatory]=\"true\"\n    [idPrefix]=\"buildIdPrefix('detail')\"\n    #writeComplexFieldComponent>\n  </ccd-write-complex-type-field>\n</div>\n", styles: [".manual-link{cursor:pointer;display:block;text-decoration:underline}\n"] }]
+        args: [{ selector: 'ccd-write-address-field', template: "<div class=\"form-group\" [id]=\"id()\">\n  <div *ngIf=\"!isComplexWithHiddenFields()\">\n    <h2 class=\"heading-h2\">{{caseField | ccdFieldLabel}}</h2>\n\n    <div class=\"form-group bottom-30 postcodeLookup\" [id]=\"createElementId('postcodeLookup')\" [ngClass]=\"{'form-group-error': missingPostcode}\" *ngIf=\"!isExpanded\">\n      <label [for]=\"createElementId('postcodeInput')\">\n        <span class=\"form-label\">{{'Enter a UK postcode' | rpxTranslate}}</span>\n      </label>\n      <span class=\"error-message\" *ngIf=\"missingPostcode\">{{errorMessage | rpxTranslate}}</span>\n      <input type=\"text\" [ngClass]=\"{'govuk-input--error': missingPostcode}\"\n      [id]=\"createElementId('postcodeInput')\" name=\"postcode\" class=\"form-control postcodeinput inline-block\" [formControl]=\"postcode\">\n      <button type=\"button\" class=\"button button-30\" (click)=\"findAddress()\">{{'Find address' | rpxTranslate}}</button>\n    </div>\n\n    <div class=\"form-group\" *ngIf=\"addressOptions\" id=\"selectAddress\" [ngClass]=\"{'form-group-error': noAddressSelected}\">\n      <label [for]=\"createElementId('addressList')\">\n        <span class=\"form-label\">{{'Select an address' | rpxTranslate}}</span>\n      </label>\n      <span class=\"error-message\" *ngIf=\"noAddressSelected\">{{errorMessage | rpxTranslate}}</span>\n      <select class=\"form-control ccd-dropdown addressList\" [id]=\"createElementId('addressList')\" name=\"address\" [formControl]=\"addressList\" (change)=\"addressSelected()\" focusElement>\n        <option *ngFor=\"let addressOption of addressOptions\" [ngValue]=\"addressOption.value\">\n          {{addressOption.description | rpxTranslate}}\n        </option>\n      </select>\n    </div>\n\n    <a class=\"manual-link bottom-30\" *ngIf=\"!shouldShowDetailFields()\" (click)=\"blankAddress()\" href=\"javascript:void(0)\">\n      {{\"I can't enter a UK postcode\" | rpxTranslate}}\n    </a>\n  </div>\n\n  <ccd-write-complex-type-field\n    [hidden]=\"!shouldShowDetailFields()\"\n    [caseField]=\"caseField\"\n    [renderLabel]=\"false\"\n    [parent]=\"parent\"\n    [formGroup]=\"formGroup\"\n    [ignoreMandatory]=\"true\"\n    [idPrefix]=\"buildIdPrefix('detail')\"\n    #writeComplexFieldComponent>\n  </ccd-write-complex-type-field>\n</div>\n", styles: [".manual-link{cursor:pointer;display:block;text-decoration:underline}\n"] }]
     }], function () { return [{ type: AddressesService }, { type: IsCompoundPipe }]; }, { writeComplexFieldComponent: [{
             type: ViewChild,
             args: ['writeComplexFieldComponent', { static: false }]