@hmcts/rpx-xui-common-lib 1.8.10-generic-filter-readonly-changes → 1.8.10-task-name-field-generic-filter

package/bundles/hmcts-rpx-xui-common-lib.umd.js

@@ -923,7 +923,7 @@
             }
             if (typeof field.showCondition === 'string') {
                 var control = form.get(field.name);
-                var _a = __read(field.showCondition.split('='), 2), name = _a[0], value = _a[1];
+                var _b = __read(field.showCondition.split('='), 2), name = _b[0], value = _b[1];
                 if (form.value && form.value[name] === value) {
                     if (field.type === 'find-person') {
                         control.get('email').setValidators(forms.Validators.required);
@@ -954,7 +954,7 @@
             }
             if (typeof field.enableCondition === 'string') {
                 var control = form.get(field.name);
-                var _a = __read(field.enableCondition.split('='), 2), name = _a[0], value = _a[1];
+                var _b = __read(field.enableCondition.split('='), 2), name = _b[0], value = _b[1];
                 if (form.value && form.value[name] === value) {
                     if (field.type === 'find-person') {
                         control.get('email').setValidators(forms.Validators.required);
@@ -1007,19 +1007,19 @@
         };
         // when domain changes ensure that person field is reset
         GenericFilterComponent.prototype.fieldChanged = function (field, form) {
-            var e_1, _a;
+            var e_1, _b;
             // TODO - Do similar with jurisdiction/service for caseworkers by services
             if (field.changeResetFields && field.changeResetFields.length) {
                 try {
-                    for (var _b = __values(field.changeResetFields), _c = _b.next(); !_c.done; _c = _b.next()) {
-                        var resetField = _c.value;
+                    for (var _c = __values(field.changeResetFields), _d = _c.next(); !_d.done; _d = _c.next()) {
+                        var resetField = _d.value;
                         this.resetField(resetField, form);
                     }
                 }
                 catch (e_1_1) { e_1 = { error: e_1_1 }; }
                 finally {
                     try {
-                        if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+                        if (_d && !_d.done && (_b = _c.return)) _b.call(_c);
                     }
                     finally { if (e_1) throw e_1.error; }
                 }
@@ -1028,7 +1028,7 @@
         // when user enters input change radio button
         GenericFilterComponent.prototype.inputChanged = function (field) {
             if (field.radioSelectionChange && typeof field.radioSelectionChange === 'string') {
-                var _a = __read(field.enableCondition.split('='), 2), name = _a[0], value = _a[1];
+                var _b = __read(field.enableCondition.split('='), 2), name = _b[0], value = _b[1];
                 this.form.get(name).patchValue(value);
             }
         };
@@ -1058,7 +1058,7 @@
             }
         };
         GenericFilterComponent.prototype.updatePersonControls = function (values, field) {
-            var e_2, _a;
+            var e_2, _b;
             var keys;
             if (!values) {
                 keys = Object.keys(this.form.get(field.name).value);
@@ -1078,7 +1078,7 @@
             catch (e_2_1) { e_2 = { error: e_2_1 }; }
             finally {
                 try {
-                    if (keys_1_1 && !keys_1_1.done && (_a = keys_1.return)) _a.call(keys_1);
+                    if (keys_1_1 && !keys_1_1.done && (_b = keys_1.return)) _b.call(keys_1);
                 }
                 finally { if (e_2) throw e_2.error; }
             }
@@ -1087,10 +1087,33 @@
             return this.form.get(field.name)['controls'][i]['value'];
         };
         GenericFilterComponent.prototype.updateTaskNameControls = function (values, field) {
-            this.form.get(field.name).patchValue(values);
+            var e_3, _b;
+            var keys;
+            if (!values) {
+                keys = Object.keys(this.form.get(field.name).value);
+            }
+            else {
+                keys = values.task_type ? Object.keys(values.task_type) : Object.keys(this.form.get(field.name).value);
+            }
+            try {
+                for (var keys_2 = __values(keys), keys_2_1 = keys_2.next(); !keys_2_1.done; keys_2_1 = keys_2.next()) {
+                    var key = keys_2_1.value;
+                    if (this.form.get(field.name) && this.form.get(field.name).get(key)) {
+                        var value = values.task_type && values.task_type[key] ? values.task_type[key] : null;
+                        this.form.get(field.name).get(key).patchValue(value);
+                    }
+                }
+            }
+            catch (e_3_1) { e_3 = { error: e_3_1 }; }
+            finally {
+                try {
+                    if (keys_2_1 && !keys_2_1.done && (_b = keys_2.return)) _b.call(keys_2);
+                }
+                finally { if (e_3) throw e_3.error; }
+            }
         };
         GenericFilterComponent.prototype.toggleSelectAll = function (event, form, item, field) {
-            var e_3, _a;
+            var e_4, _b;
             var isChecked = event.target.checked;
             var formArray = form.get(field.name);
             if (!item.selectAll) {
@@ -1130,17 +1153,17 @@
             }
             if (field.changeResetFields && field.changeResetFields.length) {
                 try {
-                    for (var _b = __values(field.changeResetFields), _c = _b.next(); !_c.done; _c = _b.next()) {
-                        var resetField = _c.value;
+                    for (var _c = __values(field.changeResetFields), _d = _c.next(); !_d.done; _d = _c.next()) {
+                        var resetField = _d.value;
                         this.resetField(resetField, form);
                     }
                 }
-                catch (e_3_1) { e_3 = { error: e_3_1 }; }
+                catch (e_4_1) { e_4 = { error: e_4_1 }; }
                 finally {
                     try {
-                        if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+                        if (_d && !_d.done && (_b = _c.return)) _b.call(_c);
                     }
-                    finally { if (e_3) throw e_3.error; }
+                    finally { if (e_4) throw e_4.error; }
                 }
             }
             if (field.name === 'user-services') {
@@ -1172,7 +1195,7 @@
             this.filterSkillsByServices(servicesArray, this.config);
         };
         GenericFilterComponent.prototype.resetField = function (resetField, form) {
-            var e_4, _a;
+            var e_5, _b;
             var control = form.get(resetField);
             var defaultValue = this.config.cancelSetting.fields.find(function (f) { return f.name === resetField; });
             if (control instanceof forms.FormArray) {
@@ -1183,17 +1206,17 @@
             else if (control instanceof forms.FormGroup) {
                 var keys = Object.keys(control.value);
                 try {
-                    for (var keys_2 = __values(keys), keys_2_1 = keys_2.next(); !keys_2_1.done; keys_2_1 = keys_2.next()) {
-                        var key = keys_2_1.value;
+                    for (var keys_3 = __values(keys), keys_3_1 = keys_3.next(); !keys_3_1.done; keys_3_1 = keys_3.next()) {
+                        var key = keys_3_1.value;
                         this.resetField(key, control);
                     }
                 }
-                catch (e_4_1) { e_4 = { error: e_4_1 }; }
+                catch (e_5_1) { e_5 = { error: e_5_1 }; }
                 finally {
                     try {
-                        if (keys_2_1 && !keys_2_1.done && (_a = keys_2.return)) _a.call(keys_2);
+                        if (keys_3_1 && !keys_3_1.done && (_b = keys_3.return)) _b.call(keys_3);
                     }
-                    finally { if (e_4) throw e_4.error; }
+                    finally { if (e_5) throw e_5.error; }
                 }
             }
             else if (control instanceof forms.FormControl) {
@@ -1216,13 +1239,18 @@
             this._settings = this.filterService.get(this.config.id);
         };
         GenericFilterComponent.prototype.buildForm = function (config, settings, reset) {
-            var e_5, _a;
+            var e_6, _b;
+            var _a;
             var findPersonControl = this.form ? this.form.get('findPersonControl') : null;
+            var findTaskNameControl = this.form ? this.form.get('findTaskNameControl') : null;
             this.form = this.fb.group({});
             if (findPersonControl) {
                 // in order to maintain find person component, control needs to be kept
                 this.form.addControl('findPersonControl', findPersonControl);
             }
+            if (findTaskNameControl) {
+                this.form.addControl('findTaskNameControl', findTaskNameControl);
+            }
             var _loop_1 = function (field) {
                 if (field.type === 'checkbox' || field.type === 'checkbox-large' || field.type === 'nested-checkbox') {
                     var formArray = this_1.buildCheckBoxFormArray(field, settings);
@@ -1264,6 +1292,16 @@
                         });
                         this_1.form.addControl(field.name, formGroup);
                     }
+                    else if (field.type === 'find-task-name') {
+                        var formGroup = new forms.FormGroup({
+                            task_type_id: new forms.FormControl(defaultValue && defaultValue.hasOwnProperty('task_type_id') ? defaultValue.task_type_id : ''),
+                            task_type_name: new forms.FormControl(defaultValue && defaultValue.hasOwnProperty('task_type_name') ? defaultValue.task_type_name : ''),
+                        });
+                        this_1.form.addControl(field.name, formGroup);
+                        if (!defaultValue || !defaultValue.task_type_id) {
+                            (_a = this_1.form.get('findTaskNameControl')) === null || _a === void 0 ? void 0 : _a.patchValue('');
+                        }
+                    }
                     else if (field.type !== 'group-title') {
                         var control = new forms.FormControl(defaultValue, validators);
                         this_1.form.addControl(field.name, control);
@@ -1276,21 +1314,21 @@
             };
             var this_1 = this;
             try {
-                for (var _b = __values(config.fields), _c = _b.next(); !_c.done; _c = _b.next()) {
-                    var field = _c.value;
+                for (var _c = __values(config.fields), _d = _c.next(); !_d.done; _d = _c.next()) {
+                    var field = _d.value;
                     _loop_1(field);
                 }
             }
-            catch (e_5_1) { e_5 = { error: e_5_1 }; }
+            catch (e_6_1) { e_6 = { error: e_6_1 }; }
             finally {
                 try {
-                    if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+                    if (_d && !_d.done && (_b = _c.return)) _b.call(_c);
                 }
-                finally { if (e_5) throw e_5.error; }
+                finally { if (e_6) throw e_6.error; }
             }
         };
         GenericFilterComponent.prototype.buildCheckBoxFormArray = function (field, settings) {
-            var e_6, _a;
+            var e_7, _b;
             var validators = GenericFilterComponent.addFormValidators(field);
             var formArray = this.fb.array([], validators);
             var defaultValues;
@@ -1305,22 +1343,22 @@
                 formArray.push(new forms.FormControl(checked));
             };
             try {
-                for (var _b = __values(field.options), _c = _b.next(); !_c.done; _c = _b.next()) {
-                    var option = _c.value;
+                for (var _c = __values(field.options), _d = _c.next(); !_d.done; _d = _c.next()) {
+                    var option = _d.value;
                     _loop_2(option);
                 }
             }
-            catch (e_6_1) { e_6 = { error: e_6_1 }; }
+            catch (e_7_1) { e_7 = { error: e_7_1 }; }
             finally {
                 try {
-                    if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+                    if (_d && !_d.done && (_b = _c.return)) _b.call(_c);
                 }
-                finally { if (e_6) throw e_6.error; }
+                finally { if (e_7) throw e_7.error; }
             }
             return formArray;
         };
         GenericFilterComponent.prototype.buildFormArray = function (field, settings) {
-            var e_7, _a;
+            var e_8, _b;
             var validators = GenericFilterComponent.addFormValidators(field);
             var formArray = this.fb.array([], validators);
             var defaultValues;
@@ -1328,17 +1366,17 @@
                 defaultValues = settings.fields.find(function (f) { return f.name === field.name; });
                 if (defaultValues && defaultValues.value && defaultValues.value.length > 0) {
                     try {
-                        for (var _b = __values(defaultValues.value), _c = _b.next(); !_c.done; _c = _b.next()) {
-                            var defaultValue = _c.value;
+                        for (var _c = __values(defaultValues.value), _d = _c.next(); !_d.done; _d = _c.next()) {
+                            var defaultValue = _d.value;
                             formArray.push(new forms.FormControl(defaultValue));
                         }
                     }
-                    catch (e_7_1) { e_7 = { error: e_7_1 }; }
+                    catch (e_8_1) { e_8 = { error: e_8_1 }; }
                     finally {
                         try {
-                            if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+                            if (_d && !_d.done && (_b = _c.return)) _b.call(_c);
                         }
-                        finally { if (e_7) throw e_7.error; }
+                        finally { if (e_8) throw e_8.error; }
                     }
                 }
             }
@@ -1362,11 +1400,11 @@
             });
         };
         GenericFilterComponent.prototype.emitFormErrors = function (form) {
-            var e_8, _a;
+            var e_9, _b;
             var errors = [];
             try {
-                for (var _b = __values(this.config.fields), _c = _b.next(); !_c.done; _c = _b.next()) {
-                    var field = _c.value;
+                for (var _c = __values(this.config.fields), _d = _c.next(); !_d.done; _d = _c.next()) {
+                    var field = _d.value;
                     var formGroup = form.get(field.name);
                     if (formGroup && formGroup.errors && (formGroup.errors.minlength || formGroup.errors.required)) {
                         errors.push({ name: field.name, error: field.minSelectedError });
@@ -1376,12 +1414,12 @@
                     }
                 }
             }
-            catch (e_8_1) { e_8 = { error: e_8_1 }; }
+            catch (e_9_1) { e_9 = { error: e_9_1 }; }
             finally {
                 try {
-                    if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+                    if (_d && !_d.done && (_b = _c.return)) _b.call(_c);
                 }
-                finally { if (e_8) throw e_8.error; }
+                finally { if (e_9) throw e_9.error; }
             }
             // remove duplicates
             errors = errors.filter(function (filterError, i, arr) {
@@ -1393,10 +1431,10 @@
         };
         GenericFilterComponent.prototype.initValuesFromCacheForSkillsByServices = function () {
             var _this = this;
-            if (this.settings && this.settings.fields) {
-                var cachedValues = this.filteredSkillsByServicesCheckbox.map(function (skill) {
-                    var selected = false;
-                    var isSelectedUserSkill;
+            var cachedValues = this.filteredSkillsByServicesCheckbox.map(function (skill) {
+                var selected = false;
+                if (_this.settings && _this.settings.fields) {
+                    var isSelectedUserSkill = void 0;
                     var selectedUserSkills = _this.settings.fields.find(function (setting) { return setting.name === 'user-skills'; });
                     if (selectedUserSkills && selectedUserSkills.value && selectedUserSkills.value.length > 0) {
                         isSelectedUserSkill = selectedUserSkills.value.findIndex(function (val) {
@@ -1404,11 +1442,11 @@
                         });
                         selected = isSelectedUserSkill !== -1;
                     }
-                    return selected;
-                });
-                if (cachedValues.length > 0) {
-                    this.form.get('user-skills').setValue(cachedValues);
                 }
+                return selected;
+            });
+            if (cachedValues.length > 0) {
+                this.form.get('user-skills').setValue(cachedValues);
             }
         };
         GenericFilterComponent.prototype.filterSkillsByServices = function (services, config) {
@@ -1513,7 +1551,7 @@
     GenericFilterComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'xuilib-generic-filter',
-                    template: "<form [formGroup]=\"form\" (ngSubmit)=\"applyFilter(form)\">\n  <div class=\"contain-classes\" *ngFor=\"let field of config.fields\">\n    <hr *ngIf=\"field.lineBreakBefore\" class=\"govuk-section-break govuk-section-break--visible elevated-break\">\n    <ng-container [ngSwitch]=\"field.type\">\n      <ng-container *ngSwitchCase=\"'group-title'\">\n        <div [class]=\"field.titleClasses ? field.titleClasses: 'govuk-label govuk-label--m govuk-!-margin-bottom-4'\">\n          {{ field.name | capitalize }}\n        </div>\n    </ng-container>\n      <ng-container *ngSwitchDefault>\n    <div class=\"govuk-form-group xui-generic-filter\"\n         [hidden]=\"hidden(field, form)\"\n         [id]=\"field.name\"\n         [ngClass]=\"{'form-group-error': submitted && (form.get(field.name).errors?.minLength || form.get(field.name).errors?.maxLength)}\">\n         <div *ngIf=\"field.title\" class=\"xui-generic-filter__field-title\">\n          <h3 [class]=\"field.titleClasses ? field.titleClasses : 'govuk-heading-s'\" style=\"margin-bottom: 0!important\">\n            {{field.title | capitalize}}\n          </h3>\n          <div *ngIf=\"field?.titleHint\" class=\"govuk-!-margin-left-2\">\n            {{ field.titleHint }}\n          </div>\n        </div>\n      <p class=\"govuk-body\" *ngIf=\"field.subTitle\">{{field.subTitle}}</p>\n      <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\" *ngIf=\"field.displayMinSelectedError && submitted && form.get(field.name).errors?.minLength\">\n        <span class=\"govuk-visually-hidden\">Error:</span> {{field.minSelectedError}}\n      </span>\n      <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\" *ngIf=\"field.displayMaxSelectedError && submitted && form.get(field.name).errors?.maxLength\">\n        <span class=\"govuk-visually-hidden\">Error:</span> {{field.maxSelectedError}}\n      </span>\n      <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\"\n        *ngIf=\"field.emailError && submitted && form.get(field.name).errors?.email\">\n        <span class=\"govuk-visually-hidden\">Error:</span> {{field.emailError}}\n      </span>\n        <div class=\"govuk-body\"  [class.govuk-body--maxWidth480px]=\"field.maxWidth480px\" [ngSwitch]=\"field.type\">\n        <ng-container *ngSwitchCase=\"'select'\">\n          <select class=\"govuk-select\" (change)=\"fieldChanged(field, form)\" [attr.disabled]=\"disabled(field, form)\" [name]=\"'select_' + field.name\" [id]=\"'select_' + field.name\" [formControlName]=\"field.name\">\n            <option disabled selected hidden value=\"\">{{field.disabledText}}</option>\n            <option *ngIf=\"field.defaultOption\" [attr.selected]=\"true\" [value]=\"field.defaultOption.key\">{{field.defaultOption.label}}</option>\n            <option class=\"govuk-radios__item\" *ngFor=\"let item of field.options\" [value]=\"item.key\">{{item.label}}</option>\n          </select>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'group-select'\">\n          <select class=\"govuk-select\" (change)=\"fieldChanged(field, form)\" [attr.disabled]=\"disabled(field, form)\" [name]=\"'select_' + field.name\" [id]=\"'select_' + field.name\" [formControlName]=\"field.name\">\n            <option disabled selected hidden value=\"\">{{field.disabledText}}</option>\n            <option *ngIf=\"field.defaultOption\" selected [value]=\"field.defaultOption.key\">{{field.defaultOption.label}}</option>\n            <optgroup *ngFor = 'let grp of filteredSkillsByServices' label=\"{{grp.group | titlecase}}\">\n              <option *ngFor = 'let item of grp.options' [value]=\"item.key\">{{item.label}}</option>\n            </optgroup>\n          </select>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'checkbox'\">\n          <div class=\"govuk-checkboxes govuk-checkboxes--small\" [formGroupName]=\"field.name\" [attr.field]=\"field.name\" [id]=\"'checkbox_' + field.name\">\n            <div *ngFor=\"let item of field.options; let i = index\" class=\"govuk-checkboxes__item\">\n              <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n                     [attr.disabled]=\"disabled(field, form)\"\n                     [formControlName]=\"i\"\n                     (change)=\"toggleSelectAll($event, form, item, field)\"\n                     [value]=\"item.key\" [id]=\"'checkbox_' + field.name + item.key\"\n                     [name]=\"'checkbox_' + field.name + item.key\"\n              />\n              <label\n                [for]=\"'checkbox_' + field.name + item.key\"\n                class=\"govuk-label govuk-checkboxes__label\"\n                [ngClass]=\"{'govuk-!-font-weight-bold': item.selectAll}\"\n              >{{item.label}}</label>\n            </div>\n          </div>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'nested-checkbox'\">\n          <div class=\"govuk-checkboxes govuk-checkboxes--small\" [formGroupName]=\"field.name\" [attr.field]=\"field.name\" [id]=\"'checkbox_' + field.name\">\n            <div *ngFor=\"let item of filteredSkillsByServicesCheckbox; let i = index\" class=\"govuk-checkboxes__item\">\n              <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n                     [attr.disabled]=\"disabled(field, form)\"\n                     [formControlName]=\"i\"\n                     (change)=\"toggleSelectAll($event, form, item, field)\"\n                     [value]=\"item.key\" [id]=\"'checkbox_' + field.name + item.key\"\n                     [name]=\"'checkbox_' + field.name + item.key\"\n              />\n              <label\n                [for]=\"'checkbox_' + field.name + item.key\"\n                class=\"govuk-label govuk-checkboxes__label\"\n                [ngClass]=\"{'govuk-!-font-weight-bold': item.selectAll}\"\n              >{{item.label}}</label>\n            </div>\n          </div>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'checkbox-large'\">\n          <div class=\"govuk-checkboxes\" [formGroupName]=\"field.name\" [attr.field]=\"field.name\" [id]=\"'checkbox_' + field.name\">\n            <div *ngFor=\"let item of field.options; let i = index\" class=\"govuk-checkboxes__item\">\n              <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n                     [attr.disabled]=\"disabled(field, form)\"\n                     [formControlName]=\"i\"\n                     (change)=\"toggleSelectAll($event, form, item, field)\"\n                     [value]=\"item.key\" [id]=\"'checkbox_' + field.name + item.key\"\n                     [name]=\"'checkbox_' + field.name + item.key\"\n              />\n              <label\n                [for]=\"'checkbox_' + field.name + item.key\"\n                class=\"govuk-label govuk-checkboxes__label\"\n                [ngClass]=\"{'govuk-!-font-weight-bold': item.selectAll}\"\n              >{{item.label}}</label>\n            </div>\n          </div>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'radio'\">\n          <div class=\"govuk-radios\">\n            <div *ngFor=\"let item of field.options\" class=\"govuk-radios__item\">\n              <input type=\"radio\"\n                     [formControlName]=\"field.name\"\n                     [id]=\"'radio_' + item.key\"\n                     [attr.disabled]=\"disabled(field, form)\"\n                     [checked]=\"item.key === form.get(field.name).value\"\n                     class=\"govuk-radios__input\"\n                     [value]=\"item.key\"\n                     (change)=\"fieldChanged(field, form)\"\n              />\n              <label [for]=\"'radio_' + item.key\" class=\"govuk-label govuk-radios__label\">{{item.label}}</label>\n            </div>\n          </div>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'find-person'\">\n          <xuilib-find-person subTitle=\"\" (personSelected)=\"updatePersonControls($event, field)\"\n                              (personFieldChanged)=\"inputChanged(field)\"\n                              [submitted]=\"submitted\"\n                              [disabled]=\"disabled(field, form)\"\n                              [domain]=\"form.get(field.domainField)?.value\"\n                              [findPersonGroup]=\"form\"\n                              [selectedPerson]=\"form.get(field.name)?.value?.email\"\n                              [userIncluded]=\"false\"\n                              [placeholderContent]=\"field.placeholderContent ? field.placeholderContent : ''\"\n                              [services]=\"form.get(field.servicesField)?.value\"\n          ></xuilib-find-person>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'find-location'\">\n          <xuilib-find-location (locationFieldChanged)=\"inputChanged(field)\"\n                                [form]=\"form\"\n                                [fields]=\"config.fields\"\n                                [locationTitle]=\"field.locationTitle\"\n                                [enableAddLocationButton]=\"field.enableAddButton\"\n                                [disabled]=\"disabled(field, form)\"\n                                [disableInputField]=\"field.disable\"\n                                [selectedLocations]=\"form.get(field.name)?.value\"\n                                [submitted]=\"submitted\"\n                                [field]=\"field\"\n                                [services]=\"form.get(field.findLocationField)?.value\"\n          ></xuilib-find-location>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'find-task-name'\">\n          <xuilib-find-task-name subTitle=\"\" (taskNameSelected)=\"updateTaskNameControls($event, field)\"\n                              (taskNameFieldChanged)=\"inputChanged(field)\"\n                              [submitted]=\"submitted\"\n                              [disabled]=\"disabled(field, form)\"\n                              [domain]=\"form.get(field.domainField)?.value\"\n                              [findTaskNameGroup]=\"form\"\n                              [selectedTaskName]=\"form.get(field.name).value.taskName\"\n                              [userIncluded]=\"false\"\n          ></xuilib-find-task-name>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'find-service'\">\n          <xuilib-find-service (serviceFieldChanged)=\"inputServiceChanged($event, field)\"\n                                [form]=\"form\"\n                                [fields]=\"config.fields\"\n                                [title]=\"field.title\"\n                                [enableAddServiceButton]=\"field.enableAddButton\"\n                                [disabled]=\"disabled(field, form)\"\n                                [selectedServices]=\"form.get(field.name)?.value\"\n                                [services]=\"field.options\"\n                                [field]=\"field\">\n          ></xuilib-find-service>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'text-input'\">\n          <input class=\"govuk-input\" type=\"text\"\n                 [formControlName]=\"field.name\"\n                 [id]=\"field.name\"\n                 [attr.disabled]=\"disabled(field, form)\"\n                 (change)=\"fieldChanged(field, form)\"\n                 [attr.maxlength]=\"field.maxlength ? field.maxlength : null\"\n                 [readonly]=\"field.readonly\"\n          />\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'email-input'\">\n          <input class=\"govuk-input\" type=\"email\"\n                 [formControlName]=\"field.name\"\n                 [id]=\"field.name\"\n                 [attr.disabled]=\"disabled(field, form)\"\n                 (change)=\"fieldChanged(field, form)\"\n                 [readonly]=\"field.readonly\"\n          />\n        </ng-container>\n      </div>\n    </div>\n  </ng-container>\n</ng-container>\n  </div>\n  <hr class=\"govuk-section-break govuk-section-break--m govuk-section-break--visible\"/>\n  <div class=\"govuk-grid-row\">\n    <div class=\"govuk-grid-column-full\">\n      <button\n        class=\"govuk-button govuk-!-margin-right-1 govuk-!-margin-bottom-0\"\n        type=\"submit\"\n        id=\"applyFilter\"\n        [disabled]=\"config.enableDisabledButton && form.invalid\"\n      >{{config.applyButtonText || 'Apply'}}</button>\n      <button *ngIf=\"config.showCancelFilterButton\"\n        class=\"govuk-button govuk-button--secondary govuk-!-margin-bottom-0\"\n        type=\"button\"\n        id=\"cancelFilter\"\n        (click)=\"cancelFilter()\">{{ config.cancelButtonText || 'Cancel'}}</button>\n    </div>\n  </div>\n</form>\n",
+                    template: "<form [formGroup]=\"form\" (ngSubmit)=\"applyFilter(form)\">\n  <div class=\"contain-classes\" *ngFor=\"let field of config.fields\">\n    <hr *ngIf=\"field.lineBreakBefore\" class=\"govuk-section-break govuk-section-break--visible elevated-break\">\n    <ng-container [ngSwitch]=\"field.type\">\n      <ng-container *ngSwitchCase=\"'group-title'\">\n        <div [class]=\"field.titleClasses ? field.titleClasses: 'govuk-label govuk-label--m govuk-!-margin-bottom-4'\">\n          {{ field.name | capitalize }}\n        </div>\n    </ng-container>\n      <ng-container *ngSwitchDefault>\n    <div class=\"govuk-form-group xui-generic-filter\"\n         [hidden]=\"hidden(field, form)\"\n         [id]=\"field.name\"\n         [ngClass]=\"{'form-group-error': submitted && (form.get(field.name).errors?.minLength || form.get(field.name).errors?.maxLength)}\">\n         <div *ngIf=\"field.title\" class=\"xui-generic-filter__field-title\">\n          <h3 [class]=\"field.titleClasses ? field.titleClasses : 'govuk-heading-s'\" style=\"margin-bottom: 0!important\">\n            {{field.title | capitalize}}\n          </h3>\n          <div *ngIf=\"field?.titleHint\" class=\"govuk-!-margin-left-2\">\n            {{ field.titleHint }}\n          </div>\n        </div>\n      <p class=\"govuk-body\" *ngIf=\"field.subTitle\">{{field.subTitle}}</p>\n      <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\" *ngIf=\"field.displayMinSelectedError && submitted && form.get(field.name).errors?.minLength\">\n        <span class=\"govuk-visually-hidden\">Error:</span> {{field.minSelectedError}}\n      </span>\n      <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\" *ngIf=\"field.displayMaxSelectedError && submitted && form.get(field.name).errors?.maxLength\">\n        <span class=\"govuk-visually-hidden\">Error:</span> {{field.maxSelectedError}}\n      </span>\n      <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\"\n        *ngIf=\"field.emailError && submitted && form.get(field.name).errors?.email\">\n        <span class=\"govuk-visually-hidden\">Error:</span> {{field.emailError}}\n      </span>\n        <div class=\"govuk-body\"  [class.govuk-body--maxWidth480px]=\"field.maxWidth480px\" [ngSwitch]=\"field.type\">\n        <ng-container *ngSwitchCase=\"'select'\">\n          <select class=\"govuk-select\" (change)=\"fieldChanged(field, form)\" [attr.disabled]=\"disabled(field, form)\" [name]=\"'select_' + field.name\" [id]=\"'select_' + field.name\" [formControlName]=\"field.name\">\n            <option disabled selected hidden value=\"\">{{field.disabledText}}</option>\n            <option *ngIf=\"field.defaultOption\" [attr.selected]=\"true\" [value]=\"field.defaultOption.key\">{{field.defaultOption.label}}</option>\n            <option class=\"govuk-radios__item\" *ngFor=\"let item of field.options\" [value]=\"item.key\">{{item.label}}</option>\n          </select>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'group-select'\">\n          <select class=\"govuk-select\" (change)=\"fieldChanged(field, form)\" [attr.disabled]=\"disabled(field, form)\" [name]=\"'select_' + field.name\" [id]=\"'select_' + field.name\" [formControlName]=\"field.name\">\n            <option disabled selected hidden value=\"\">{{field.disabledText}}</option>\n            <option *ngIf=\"field.defaultOption\" selected [value]=\"field.defaultOption.key\">{{field.defaultOption.label}}</option>\n            <optgroup *ngFor = 'let grp of filteredSkillsByServices' label=\"{{grp.group | titlecase}}\">\n              <option *ngFor = 'let item of grp.options' [value]=\"item.key\">{{item.label}}</option>\n            </optgroup>\n          </select>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'checkbox'\">\n          <div class=\"govuk-checkboxes govuk-checkboxes--small\" [formGroupName]=\"field.name\" [attr.field]=\"field.name\" [id]=\"'checkbox_' + field.name\">\n            <div *ngFor=\"let item of field.options; let i = index\" class=\"govuk-checkboxes__item\">\n              <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n                     [attr.disabled]=\"disabled(field, form)\"\n                     [formControlName]=\"i\"\n                     (change)=\"toggleSelectAll($event, form, item, field)\"\n                     [value]=\"item.key\" [id]=\"'checkbox_' + item.key\"\n                     [name]=\"'checkbox_' + item.key\"\n              />\n              <label\n                [for]=\"'checkbox_' + item.key\"\n                class=\"govuk-label govuk-checkboxes__label\"\n                [ngClass]=\"{'govuk-!-font-weight-bold': item.selectAll}\"\n              >{{item.label}}</label>\n            </div>\n          </div>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'nested-checkbox'\">\n          <div class=\"govuk-checkboxes govuk-checkboxes--small\" [formGroupName]=\"field.name\" [attr.field]=\"field.name\" [id]=\"'checkbox_' + field.name\">\n            <div *ngFor=\"let item of filteredSkillsByServicesCheckbox; let i = index\" class=\"govuk-checkboxes__item\">\n              <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n                     [attr.disabled]=\"disabled(field, form)\"\n                     [formControlName]=\"i\"\n                     (change)=\"toggleSelectAll($event, form, item, field)\"\n                     [value]=\"item.key\" [id]=\"'checkbox_' + item.key\"\n                     [name]=\"'checkbox_' + item.key\"\n              />\n              <label\n                [for]=\"'checkbox_' + item.key\"\n                class=\"govuk-label govuk-checkboxes__label\"\n                [ngClass]=\"{'govuk-!-font-weight-bold': item.selectAll}\"\n              >{{item.label}}</label>\n            </div>\n          </div>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'checkbox-large'\">\n          <div class=\"govuk-checkboxes\" [formGroupName]=\"field.name\" [attr.field]=\"field.name\" [id]=\"'checkbox_' + field.name\">\n            <div *ngFor=\"let item of field.options; let i = index\" class=\"govuk-checkboxes__item\">\n              <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n                     [attr.disabled]=\"disabled(field, form)\"\n                     [formControlName]=\"i\"\n                     (change)=\"toggleSelectAll($event, form, item, field)\"\n                     [value]=\"item.key\" [id]=\"'checkbox_' + item.key\"\n                     [name]=\"'checkbox_' + item.key\"\n              />\n              <label\n                [for]=\"'checkbox_' + item.key\"\n                class=\"govuk-label govuk-checkboxes__label\"\n                [ngClass]=\"{'govuk-!-font-weight-bold': item.selectAll}\"\n              >{{item.label}}</label>\n            </div>\n          </div>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'radio'\">\n          <div class=\"govuk-radios\">\n            <div *ngFor=\"let item of field.options\" class=\"govuk-radios__item\">\n              <input type=\"radio\"\n                     [formControlName]=\"field.name\"\n                     [id]=\"'radio_' + item.key\"\n                     [attr.disabled]=\"disabled(field, form)\"\n                     [checked]=\"item.key === form.get(field.name).value\"\n                     class=\"govuk-radios__input\"\n                     [value]=\"item.key\"\n                     (change)=\"fieldChanged(field, form)\"\n              />\n              <label [for]=\"'radio_' + item.key\" class=\"govuk-label govuk-radios__label\">{{item.label}}</label>\n            </div>\n          </div>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'find-person'\">\n          <xuilib-find-person subTitle=\"\" (personSelected)=\"updatePersonControls($event, field)\"\n                              (personFieldChanged)=\"inputChanged(field)\"\n                              [submitted]=\"submitted\"\n                              [disabled]=\"disabled(field, form)\"\n                              [domain]=\"form.get(field.domainField)?.value\"\n                              [findPersonGroup]=\"form\"\n                              [selectedPerson]=\"form.get(field.name)?.value?.email\"\n                              [userIncluded]=\"false\"\n                              [placeholderContent]=\"field.placeholderContent ? field.placeholderContent : ''\"\n                              [services]=\"form.get(field.servicesField)?.value\"\n          ></xuilib-find-person>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'find-location'\">\n          <xuilib-find-location (locationFieldChanged)=\"inputChanged(field)\"\n                                [form]=\"form\"                                \n                                [fields]=\"config.fields\"\n                                [locationTitle]=\"field.locationTitle\"\n                                [enableAddLocationButton]=\"field.enableAddButton\"\n                                [disabled]=\"disabled(field, form)\"\n                                [disableInputField]=\"field.disable\"\n                                [selectedLocations]=\"form.get(field.name)?.value\"\n                                [submitted]=\"submitted\"\n                                [field]=\"field\"\n                                [services]=\"form.get(field.findLocationField)?.value\"\n          ></xuilib-find-location>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'find-task-name'\">\n          <xuilib-find-task-name subTitle=\"\" (taskNameSelected)=\"updateTaskNameControls($event, field)\"\n                              (taskNameFieldChanged)=\"inputChanged(field)\"\n                              [submitted]=\"submitted\"\n                              [disabled]=\"disabled(field, form)\"\n                              [domain]=\"form.get(field.domainField)?.value\"\n                              [findTaskNameGroup]=\"form\"\n                              [selectedTaskName]=\"form.get(field.name)?.value?.task_type_name\"\n                              [placeholderContent]=\"field.placeholderContent ? field.placeholderContent : ''\"\n                              [services]=\"form.get(field.servicesField)?.value\"\n          ></xuilib-find-task-name>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'find-service'\">\n          <xuilib-find-service (serviceFieldChanged)=\"inputServiceChanged($event, field)\"\n                                [form]=\"form\"\n                                [fields]=\"config.fields\"\n                                [title]=\"field.title\"\n                                [enableAddServiceButton]=\"field.enableAddButton\"\n                                [disabled]=\"disabled(field, form)\"\n                                [selectedServices]=\"form.get(field.name)?.value\"\n                                [services]=\"field.options\"\n                                [field]=\"field\">\n          ></xuilib-find-service>\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'text-input'\">\n          <input class=\"govuk-input\" type=\"text\"\n                 [formControlName]=\"field.name\"\n                 [id]=\"field.name\"\n                 [attr.disabled]=\"disabled(field, form)\"\n                 (change)=\"fieldChanged(field, form)\"\n                 [attr.maxlength]=\"field.maxlength ? field.maxlength : null\"\n          />\n        </ng-container>\n        <ng-container *ngSwitchCase=\"'email-input'\">\n          <input class=\"govuk-input\" type=\"email\"\n                 [formControlName]=\"field.name\"\n                 [id]=\"field.name\"\n                 [attr.disabled]=\"disabled(field, form)\"\n                 (change)=\"fieldChanged(field, form)\"\n          />\n        </ng-container>\n      </div>\n    </div>\n  </ng-container>\n</ng-container>\n  </div>\n  <hr class=\"govuk-section-break govuk-section-break--m govuk-section-break--visible\"/>\n  <div class=\"govuk-grid-row\">\n    <div class=\"govuk-grid-column-full\">\n      <button\n        class=\"govuk-button govuk-!-margin-right-1 govuk-!-margin-bottom-0\"\n        type=\"submit\"\n        id=\"applyFilter\"\n        [disabled]=\"config.enableDisabledButton && form.invalid\"\n      >{{config.applyButtonText || 'Apply'}}</button>\n      <button *ngIf=\"config.showCancelFilterButton\"\n        class=\"govuk-button govuk-button--secondary govuk-!-margin-bottom-0\"\n        type=\"button\"\n        id=\"cancelFilter\"\n        (click)=\"cancelFilter()\">{{ config.cancelButtonText || 'Cancel'}}</button>\n    </div>\n  </div>\n</form>\n",
                     changeDetection: i0.ChangeDetectionStrategy.OnPush,
                     encapsulation: i0.ViewEncapsulation.None,
                     styles: [".contain-classes .elevated-break{margin-bottom:20px}@media (min-width:40.0625em){.contain-classes .elevated-break{margin-bottom:30px}}.contain-classes .govuk-body--maxWidth480px{max-width:480px}.contain-classes .xui-generic-filter .select-all{margin-bottom:10px}.contain-classes .xui-generic-filter .govuk-checkboxes{display:flex;flex-direction:column;flex-wrap:wrap}.contain-classes .xui-generic-filter .govuk-checkboxes>div{flex-grow:1;flex-shrink:0}.contain-classes .xui-generic-filter__field-title{display:flex;align-items:center;margin-bottom:10px}.contain-classes .govuk-select{width:100%}"]
@@ -4021,13 +4059,14 @@
         /**
          * @return Observable<any[]>: Array of taskName in Observable
          */
-        TaskNameService.prototype.getTaskName = function () {
+        TaskNameService.prototype.getTaskName = function (service) {
             var _this = this;
-            if (this.sessionStorageService.getItem(TaskNameService.taskNamesKey)) {
-                var taskNames = JSON.parse(this.sessionStorageService.getItem(TaskNameService.taskNamesKey));
+            var serviceTaskTypeKey = service + "-" + TaskNameService.taskNamesKey;
+            if (this.sessionStorageService.getItem(serviceTaskTypeKey)) {
+                var taskNames = JSON.parse(this.sessionStorageService.getItem(serviceTaskTypeKey));
                 return rxjs.of(taskNames);
             }
-            return this.http.get("/workallocation/taskNames").pipe(operators.tap(function (taskNames) { return _this.sessionStorageService.setItem(TaskNameService.taskNamesKey, JSON.stringify(taskNames)); }));
+            return this.http.post("/workallocation/taskNames", { service: service }).pipe(operators.tap(function (taskNames) { return _this.sessionStorageService.setItem(serviceTaskTypeKey, JSON.stringify(taskNames)); }));
         };
         return TaskNameService;
     }());
@@ -4054,14 +4093,13 @@
             this.domain = exports.PersonRole.ALL;
             this.findTaskNameGroup = new forms.FormGroup({});
             this.submitted = true;
-            this.userIncluded = false;
             this.placeholderContent = '';
             this.isNoResultsShown = true;
             this.showUpdatedColor = false;
             this.selectedTaskNames = [];
             this.errorMessage = 'You must select a name';
             this.idValue = '';
-            this.services = ['IA'];
+            this.services = 'IA';
             this.disabled = null;
             this.showAutocomplete = false;
             this.filteredOptions = [];
@@ -4073,34 +4111,33 @@
                 this.sub.unsubscribe();
             }
         };
-        FindTaskNameComponent.prototype.ngOnChanges = function () {
+        FindTaskNameComponent.prototype.ngOnInit = function () {
             var _this = this;
             this.findTaskNameControl = new forms.FormControl(this.selectedTaskName);
             this.findTaskNameGroup.addControl('findTaskNameControl', this.findTaskNameControl);
             this.sub = this.findTaskNameControl.valueChanges
-                .pipe(operators.tap(function () { return _this.showAutocomplete = false; }), operators.tap(function () { return _this.filteredOptions = []; }), operators.tap(function (term) { return _this.searchTerm = term; }), operators.debounceTime(300), operators.tap(function (searchTerm) {
-                if (!searchTerm) {
-                    _this.taskNameSelected.emit('');
-                }
-                return searchTerm;
-            }), 
-            // tap((searchTerm) => typeof searchTerm === 'string' ? this.taskNameSelected.emit('null') : void 0),
-            operators.filter(function (searchTerm) { return searchTerm && searchTerm.length >= _this.minSearchCharacters; }), operators.mergeMap(function () { return _this.getTaskName(); })).subscribe(function (taskNameModel) {
-                _this.filteredOptions = taskNameModel.map(function (task) { return task.taskName; });
+                .pipe(operators.tap(function () { return _this.showAutocomplete = false; }), operators.tap(function () { return _this.filteredOptions = []; }), operators.debounceTime(300), operators.tap(function (searchTerm) { return _this.searchTerm = searchTerm; }), operators.tap(function (searchTerm) { return typeof searchTerm === 'string' ? _this.taskNameSelected.emit('null') : void 0; }), operators.filter(function (searchTerm) { return searchTerm && searchTerm.length >= _this.minSearchCharacters; }), operators.mergeMap(function () { return _this.getTaskName(); })).subscribe(function (taskNameModel) {
+                _this.filteredOptions = taskNameModel ? taskNameModel : [];
                 if (_this.searchTerm) {
-                    _this.filteredOptions = _this.filteredOptions.filter(function (taskName) { return taskName.toLocaleLowerCase().includes(_this.searchTerm.toLocaleLowerCase()); }).map(function (taskName) { return taskName; });
+                    _this.filteredOptions = _this.filteredOptions.filter(function (taskType) { return taskType.task_type.task_type_name.toLocaleLowerCase().includes(_this.searchTerm.toLocaleLowerCase()); }).map(function (taskType) { return taskType; });
                 }
                 _this.cd.detectChanges();
             });
         };
         FindTaskNameComponent.prototype.getTaskName = function () {
-            return this.taskService.getTaskName();
+            return this.taskService.getTaskName(this.services);
+        };
+        FindTaskNameComponent.prototype.onSelectionChange = function (selectedTaskTypeName) {
+            if (selectedTaskTypeName) {
+                this.taskNameSelected.emit(selectedTaskTypeName);
+                this.findTaskNameControl.setValue(this.getTaskTypeName(selectedTaskTypeName), { emitEvent: false, onlySelf: true });
+            }
         };
-        FindTaskNameComponent.prototype.onSelectionChange = function (selectedTaskName) {
-            if (selectedTaskName) {
-                this.taskNameSelected.emit(selectedTaskName);
-                this.findTaskNameControl.setValue(selectedTaskName);
+        FindTaskNameComponent.prototype.getTaskTypeName = function (selectedTaskType) {
+            if (!selectedTaskType) {
+                return '';
             }
+            return selectedTaskType.task_type.task_type_name;
         };
         FindTaskNameComponent.prototype.onInput = function () {
             this.taskNameFieldChanged.emit();
@@ -4110,7 +4147,7 @@
     FindTaskNameComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'xuilib-find-task-name',
-                    template: "<h1 class=\"govuk-heading-l\" *ngIf=\"title && title.length\">\n  <span class=\"govuk-caption-l\">{{title}}</span>\n  {{boldTitle}}\n</h1>\n<div class=\"govuk-form-group\" [formGroup]=\"findTaskNameGroup\"\n     [ngClass]=\"{'form-group-error': findTaskNameGroup.get('findTaskNameControl')?.invalid && submitted}\">\n  <fieldset class=\"govuk-fieldset\" aria-describedby=\"sub-title-hint\">\n    <div id=\"sub-title-hint\" class=\"govuk-hint\" *ngIf=\"subTitle && subTitle.length\">\n      {{subTitle}}\n    </div>\n    <span id=\"validation-error\" class=\"govuk-error-message\" *ngIf=\"findTaskNameGroup && findTaskNameGroup.errors\">\n        <span class=\"govuk-visually-hidden\">Error:</span>{{findTaskNameGroup.errors.error ? findTaskNameGroup.errors.error : errorMessage}}\n    </span>\n    <input id=\"inputSelectTaskName{{idValue}}\" type=\"text\" aria-label=\"select a task name\"\n           formControlName=\"findTaskNameControl\"\n           [matAutocomplete]=\"auto\"\n           class=\"govuk-input govuk-!-width-one-third\"\n           [placeholder]=\"placeholderContent\"\n           [attr.disabled]=\"disabled\"\n           (input)=\"onInput()\">\n    <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\" (optionSelected)=\"onSelectionChange($event.option.value)\">\n      <mat-option *ngFor=\"let option of filteredOptions\"\n                  [value]=\"option\"\n                  [ngClass]=\"{'hide-autocomplete': !showAutocomplete, 'select-option': showUpdatedColor}\">\n                  {{ option }}\n      </mat-option>\n      <mat-option [ngClass]=\"{'select-option': showUpdatedColor}\" *ngIf=\"isNoResultsShown && !filteredOptions.length && showAutocomplete\">No results found</mat-option>\n    </mat-autocomplete>\n  </fieldset>\n</div>\n",
+                    template: "<h1 class=\"govuk-heading-l\" *ngIf=\"title && title.length\">\n  <span class=\"govuk-caption-l\">{{title}}</span>\n  {{boldTitle}}\n</h1>\n<div class=\"govuk-form-group\" [formGroup]=\"findTaskNameGroup\"\n     [ngClass]=\"{'form-group-error': findTaskNameGroup.get('findTaskNameControl')?.invalid && submitted}\">\n  <fieldset class=\"govuk-fieldset\" aria-describedby=\"sub-title-hint\">\n    <div id=\"sub-title-hint\" class=\"govuk-hint\" *ngIf=\"subTitle && subTitle.length\">\n      {{subTitle}}\n    </div>\n    <span id=\"validation-error\" class=\"govuk-error-message\" *ngIf=\"findTaskNameGroup && findTaskNameGroup.errors\">\n        <span class=\"govuk-visually-hidden\">Error:</span>{{findTaskNameGroup.errors.error ? findTaskNameGroup.errors.error : errorMessage}}\n    </span>\n    <input id=\"inputSelectTaskName{{idValue}}\" type=\"text\" aria-label=\"select a task name\"\n           formControlName=\"findTaskNameControl\"\n           [matAutocomplete]=\"auto\"\n           class=\"govuk-input govuk-!-width-one-third\"\n           [placeholder]=\"placeholderContent\"\n           [attr.disabled]=\"disabled\"\n           (input)=\"onInput()\">\n    <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\" (optionSelected)=\"onSelectionChange($event.option.value)\">\n      <mat-option *ngFor=\"let option of filteredOptions\"\n                  [value]=\"option\"\n                  [ngClass]=\"{'hide-autocomplete': !showAutocomplete, 'select-option': showUpdatedColor}\">\n                  {{ getTaskTypeName(option) }}\n      </mat-option>\n      <mat-option [ngClass]=\"{'select-option': showUpdatedColor}\" *ngIf=\"isNoResultsShown && !filteredOptions.length && showAutocomplete\">No results found</mat-option>\n    </mat-autocomplete>\n  </fieldset>\n</div>\n",
                     styles: [""]
                 },] }
     ];
@@ -4128,7 +4165,6 @@
         findTaskNameGroup: [{ type: i0.Input }],
         selectedTaskName: [{ type: i0.Input }],
         submitted: [{ type: i0.Input }],
-        userIncluded: [{ type: i0.Input }],
         assignedUser: [{ type: i0.Input }],
         placeholderContent: [{ type: i0.Input }],
         isNoResultsShown: [{ type: i0.Input }],