@hmcts/ccd-case-ui-toolkit 6.13.0-test1 → 6.13.9-rc2

package/fesm2015/hmcts-ccd-case-ui-toolkit.js

@@ -12,9 +12,10 @@ import * as i1$2 from '@angular/common/http';
 import { HttpErrorResponse, HttpHeaders, HttpParams } from '@angular/common/http';
 import { catchError, map, publish, refCount, debounceTime, delay, distinctUntilChanged, finalize, publishReplay, take, tap, first, switchMap, takeUntil, filter } from 'rxjs/operators';
 import { Type, Expose, plainToClassFromExist, plainToClass } from 'class-transformer';
-import * as _ from 'underscore';
 import * as moment from 'moment';
 import { __decorate, __metadata } from 'tslib';
+import * as _ from 'underscore';
+import { generate } from 'pegjs';
 import { isUndefined } from 'util';
 import { StateMachine } from '@edium/fsm';
 import * as i1$3 from '@angular/material/dialog';
@@ -3799,168 +3800,165 @@ FieldsUtils.ɵprov = i0.ɵɵdefineInjectable({ token: FieldsUtils, factory: Fiel
         type: Injectable
     }], null, null); })();
 
-class ShowCondition {
-    // Expects a show condition of the form: <fieldName>="string"
-    constructor(condition) {
-        this.condition = condition;
-        this.orConditions = null;
-        this.andConditions = null;
-        if (!!condition) {
-            if (condition.search(ShowCondition.OR_CONDITION_REGEXP) !== -1) {
-                this.orConditions = condition.split(ShowCondition.OR_CONDITION_REGEXP);
-            }
-            else {
-                this.andConditions = condition.split(ShowCondition.AND_CONDITION_REGEXP);
-            }
-        }
-    }
-    static addPathPrefixToCondition(showCondition, pathPrefix) {
-        if (!pathPrefix || pathPrefix === '') {
-            return showCondition;
-        }
-        if (showCondition.search(ShowCondition.OR_CONDITION_REGEXP) !== -1) {
-            let orConditions = showCondition.split(ShowCondition.OR_CONDITION_REGEXP);
-            orConditions = this.extractConditions(orConditions, pathPrefix);
-            return orConditions.join(' OR ');
-        }
-        else {
-            let andConditions = showCondition.split(ShowCondition.AND_CONDITION_REGEXP);
-            andConditions = this.extractConditions(andConditions, pathPrefix);
-            return andConditions.join(' AND ');
-        }
+const conditionSource = `{
+    function flat(arr, depth = 1) {
+      var flatten = function (arr, depth = 1) {
+        if (depth) return arr;
+
+      // Otherwise, concatenate into the parent array
+      return arr.reduce(function (acc, val) {
+        return acc.concat(Array.isArray(val) ? flatten(val, depth - 1) : val);
+      }, []);
+
+      };
+
+    return flatten(arr, depth - 1);
     }
-    // Cache instances so that we can cache results more effectively
-    static getInstance(condition) {
-        let instance = this.instanceCache.get(condition);
-        if (!instance) {
-            instance = new ShowCondition(condition);
-            this.instanceCache.set(condition, instance);
+  }
+
+  Start
+    = Formula
+
+  Formula
+    = EnclosedFormula
+    / OpenFormula
+
+  EnclosedFormula
+    = bracket formula:OpenFormula bracket join:(JoinComparator)*
+      { return flat([ [formula], join[0] ], 1) }
+
+  OpenFormula
+    = eq:OpenEqualityCheck joins:(JoinComparator)*
+      { return flat([ eq, flat(joins) ]) }
+
+  JoinComparator
+    = comp:Comparator eq:OpenEqualityCheck
+      { return [comp, eq]; }
+      / CompoundJoinComparator
+
+  CompoundJoinComparator
+    = comp:Comparator bracket f:OpenFormula bracket
+      { return [comp, f ] }
+
+  OpenEqualityCheck
+    = fr:FieldRef _? op:operator _? val:Value
+     { return { fieldReference: fr, comparator: op, value: val } }
+
+  Comparator
+   = _? c:'AND' _?
+   { return c; }
+   / _? c:'OR' _?
+   { return c; }
+
+  Word
+   = l:Letter+
+   { return l.join(""); }
+
+  Letter
+   = [a-zA-Z]
+
+  Value
+   = v:quotedValue / v:Word
+   { return v.join("") }
+   / v:number
+   { return parseInt(v.join("")) }
+
+  FieldRef
+   = FieldReference / MetadataFieldReference
+
+  MetadataFieldReference
+    = s1:openSquare fr:FieldReference s2:closeSquare
+    { return s1 + fr + s2 }
+
+  FieldReference
+    = characters:[A-Za-z0-9._-]+ { return characters.join(""); }
+
+  openSquare
+   = "["
+
+  closeSquare
+   = "]"
+
+  number
+   = [0-9]+
+
+  quotedValue
+   = '"'val:[A-Za-z0-9.,* _&()/-]*'"'
+   { return val.join(""); }
+
+  bracket
+   = (_? "("+ _? / _? ")"+ _? )
+
+  operator
+   = "=" / "!=" / "CONTAINS"
+
+  ws "Whitespace"
+   = [ \t]
+
+  _ "One or more whitespaces"
+   = ws+
+
+  nl "New line"
+   = "\\n"`;
+var peg = generate(conditionSource);
+
+class ConditionParser {
+    /**
+     * Parse the raw formula and output structured condition data
+     * that can be used in evaluating show/hide logic
+     * @param condition raw formula e.g. TextField = "Hello"
+     */
+    static parse(condition) {
+        if (!condition) {
+            return null;
         }
-        return instance;
+        ;
+        condition = condition.replace(/CONTAINS/g, ' CONTAINS');
+        return peg.parse(condition.trim(), {});
     }
     /**
-     * Determine whether a ShowCondition model is affected by fields that have
-     * a display_context of HIDDEN or READONLY, which means they aren't able to
-     * be changed by the user's actions.
-     *
-     * @param showCondition The ShowCondition model to evaluate.
-     * @param caseFields Inspected to see appropriate display_contexts.
+     * Evaluate the current fields against the conditions
+     * @param fields the current page fields and their value
+     * @param conditions The PegJS formula output
      */
-    static hiddenCannotChange(showCondition, caseFields) {
-        if (showCondition && caseFields) {
-            const conditions = showCondition.andConditions || showCondition.orConditions;
-            if (conditions && conditions.length > 0) {
-                let allUnchangeable = true;
-                for (const condition of conditions) {
-                    const [field] = ShowCondition.getField(condition);
-                    const path = field.split('.');
-                    let head = path.shift();
-                    let caseField = caseFields.find(cf => cf.id === head);
-                    while (path.length > 0) {
-                        head = path.shift();
-                        if (caseField) {
-                            // Jump out if this is HIDDEN or READONLY, regardless of whether or not it's
-                            // complex or a collection - nested fields will "inherit" the display_context.
-                            if (['HIDDEN', 'READONLY'].indexOf(caseField.display_context) > -1) {
-                                break;
-                            }
-                            // Consider what type of field this is.
-                            const ft = caseField.field_type;
-                            switch (ft.type) {
-                                case 'Collection':
-                                    if (ft.collection_field_type.type === 'Complex' && ft.collection_field_type.complex_fields) {
-                                        caseField = ft.collection_field_type.complex_fields.find(cf => cf.id === head);
-                                    }
-                                    break;
-                                case 'Complex':
-                                    if (ft.complex_fields) {
-                                        caseField = ft.complex_fields.find(cf => cf.id === head);
-                                    }
-                                    break;
-                            }
-                        }
-                    }
-                    if (caseField) {
-                        allUnchangeable = allUnchangeable && ['HIDDEN', 'READONLY'].indexOf(caseField.display_context) > -1;
-                    }
+    static evaluate(fields, conditions, path) {
+        if (!conditions || conditions.length === 0) {
+            return true;
+        }
+        ;
+        const validJoinComparators = ['AND', 'OR'];
+        const result = conditions.reduce((accumulator, condition, index) => {
+            const isJoinComparator = (comparator) => (typeof comparator === 'string' && validJoinComparators.indexOf(comparator) !== -1);
+            if (isJoinComparator(condition)) {
+                return accumulator;
+            }
+            ;
+            let currentConditionResult = true;
+            if (Array.isArray(condition)) {
+                currentConditionResult = this.evaluate(fields, condition);
+                if (isJoinComparator(conditions[index - 1])) {
+                    return this.evaluateJoin(accumulator, conditions[index - 1], currentConditionResult);
                 }
-                return allUnchangeable;
             }
-        }
-        return false;
-    }
-    static extractConditions(conditionsArray, pathPrefix) {
-        const extracted = conditionsArray.map(condition => {
-            if (condition.startsWith(pathPrefix)) {
-                return condition;
+            if (condition.comparator) {
+                const formula = condition.fieldReference + condition.comparator + condition.value;
+                currentConditionResult = this.matchEqualityCondition(fields, formula, path);
             }
-            return `${pathPrefix}.${condition}`;
-        });
-        return extracted;
-    }
-    static getField(condition) {
-        let separator = ShowCondition.CONTAINS;
-        if (condition.indexOf(ShowCondition.CONTAINS) < 0) {
-            separator = ShowCondition.CONDITION_EQUALS;
-            if (condition.indexOf(ShowCondition.CONDITION_NOT_EQUALS) > -1) {
-                separator = ShowCondition.CONDITION_NOT_EQUALS;
+            if (isJoinComparator(conditions[index - 1])) {
+                return this.evaluateJoin(accumulator, conditions[index - 1], currentConditionResult);
             }
-        }
-        return [condition.split(separator)[0], separator];
-    }
-    match(fields, path) {
-        if (!this.condition) {
-            return true;
-        }
-        return this.matchAndConditions(fields, this.updatePathName(path));
-    }
-    matchByContextFields(contextFields) {
-        return this.match(FieldsUtils.toValuesMap(contextFields));
-    }
-    /**
-     * Determine whether this is affected by fields that have a display_context
-     * of HIDDEN or READONLY, which means they aren't able to be changed by the
-     * user's actions.
-     *
-     * @param caseFields Inspected to see appropriate display_contexts.
-     */
-    hiddenCannotChange(caseFields) {
-        return ShowCondition.hiddenCannotChange(this, caseFields);
-    }
-    /**
-     * Path Name gets updated for complex sub fields
-     * @param path Path name.
-     */
-    updatePathName(path) {
-        if (path && path.split(/[_]+/g).length > 0) {
-            const [pathName, ...pathTail] = path.split(/[_]+/g);
-            const pathFinalIndex = pathTail.pop();
-            const pathTailString = pathTail.toString();
-            let mappedPathTail;
-            mappedPathTail = pathTail.map((value) => {
-                return Number(pathFinalIndex) === Number(value) ? pathName : value;
-            });
-            return pathTailString !== mappedPathTail.toString()
-                ? `${pathName}_${mappedPathTail.join('_')}_${pathFinalIndex}`
-                : path;
-        }
-        else {
-            return path;
-        }
+            return currentConditionResult;
+        }, true);
+        return result;
     }
-    matchAndConditions(fields, path) {
-        if (!!this.orConditions) {
-            return this.orConditions.some(orCondition => this.matchEqualityCondition(fields, orCondition, path));
-        }
-        else if (!!this.andConditions) {
-            return this.andConditions.every(andCondition => this.matchEqualityCondition(fields, andCondition, path));
-        }
-        else {
-            return false;
+    static evaluateJoin(leftResult, comparator, rightResult) {
+        switch (comparator) {
+            case 'OR': return leftResult || rightResult;
+            case 'AND': return leftResult && rightResult;
         }
     }
-    matchEqualityCondition(fields, condition, path) {
-        const [field, conditionSeparator] = ShowCondition.getField(condition);
+    static matchEqualityCondition(fields, condition, path) {
+        const [field, conditionSeparator] = this.getField(condition);
         const [head, ...tail] = field.split('.');
         const currentValue = this.findValueForComplexCondition(fields, head, tail, path);
         const expectedValue = this.unquoted(condition.split(conditionSeparator)[1]);
@@ -3971,7 +3969,29 @@ class ShowCondition {
             return this.checkValueEquals(expectedValue, currentValue, conditionSeparator);
         }
     }
-    checkValueEquals(expectedValue, currentValue, conditionSeparaor) {
+    static getValue(fields, head) {
+        if (this.isDynamicList(fields[head])) {
+            return fields[head].value.code;
+        }
+        else {
+            return fields[head];
+        }
+    }
+    static isDynamicList(dynamiclist) {
+        return !_.isEmpty(dynamiclist) &&
+            (_.has(dynamiclist, 'value') && _.has(dynamiclist, 'list_items'));
+    }
+    static getField(condition) {
+        let separator = ShowCondition.CONTAINS;
+        if (condition.indexOf(ShowCondition.CONTAINS) < 0) {
+            separator = ShowCondition.CONDITION_EQUALS;
+            if (condition.indexOf(ShowCondition.CONDITION_NOT_EQUALS) > -1) {
+                separator = ShowCondition.CONDITION_NOT_EQUALS;
+            }
+        }
+        return [condition.split(separator)[0], separator];
+    }
+    static checkValueEquals(expectedValue, currentValue, conditionSeparaor) {
         if (expectedValue.search('[,]') > -1) { // for  multi-select list
             return this.checkMultiSelectListEquals(expectedValue, currentValue, conditionSeparaor);
         }
@@ -3991,7 +4011,7 @@ class ShowCondition {
             }
         }
     }
-    checkValueNotEquals(expectedValue, currentValue) {
+    static checkValueNotEquals(expectedValue, currentValue) {
         const formatCurrentValue = currentValue ? currentValue.toString().trim() : '';
         if ('*' === expectedValue && formatCurrentValue !== '') {
             return false;
@@ -3999,7 +4019,7 @@ class ShowCondition {
         const formatExpectedValue = expectedValue ? expectedValue.toString().trim() : '';
         return formatCurrentValue != formatExpectedValue; // tslint:disable-line
     }
-    checkMultiSelectListEquals(expectedValue, currentValue, conditionSeparator) {
+    static checkMultiSelectListEquals(expectedValue, currentValue, conditionSeparator) {
         const expectedValues = expectedValue.split(',').sort().toString();
         const values = currentValue ? currentValue.sort().toString() : '';
         if (conditionSeparator === ShowCondition.CONDITION_NOT_EQUALS) {
@@ -4009,7 +4029,7 @@ class ShowCondition {
             return expectedValues === values;
         }
     }
-    checkValueContains(expectedValue, currentValue) {
+    static checkValueContains(expectedValue, currentValue) {
         if (expectedValue.search(',') > -1) {
             const expectedValues = expectedValue.split(',').sort();
             const values = currentValue ? currentValue.sort().toString() : '';
@@ -4020,7 +4040,11 @@ class ShowCondition {
             return values.search(expectedValue) >= 0;
         }
     }
-    findValueForComplexCondition(fields, head, tail, path) {
+    static unquoted(str) {
+        const res = str.replace(/^"|"$/g, '');
+        return res;
+    }
+    static findValueForComplexCondition(fields, head, tail, path) {
         if (!fields) {
             return undefined;
         }
@@ -4036,7 +4060,7 @@ class ShowCondition {
             }
         }
     }
-    findValueForComplexConditionForPathIfAny(fields, head, tail, path) {
+    static findValueForComplexConditionForPathIfAny(fields, head, tail, path) {
         if (path) {
             const [_, ...pathTail] = path.split(/[_]+/g);
             return this.findValueForComplexCondition(fields[head], tail[0], tail.slice(1), pathTail.join('_'));
@@ -4045,9 +4069,9 @@ class ShowCondition {
             return this.findValueForComplexCondition(fields[head], tail[0], tail.slice(1), path);
         }
     }
-    findValueForComplexConditionInArray(fields, head, tail, path) {
+    static findValueForComplexConditionInArray(fields, head, tail, path) {
         // use the path to resolve which array element we refer to
-        if (path && path.startsWith(head)) {
+        if (path.startsWith(head)) {
             const [_, ...pathTail] = path.split(/[_]+/g);
             if (pathTail.length > 0) {
                 try {
@@ -4056,42 +4080,221 @@ class ShowCondition {
                     return (fields[head][arrayIndex] !== undefined) ? this.findValueForComplexCondition(fields[head][arrayIndex]['value'], tail[0], tail.slice(1), dropNumberPath.join('_')) : null;
                 }
                 catch (e) {
-                    console.log('Error while parsing number', pathTail[0], e);
+                    console.error('Error while parsing number', pathTail[0], e);
                 }
             }
         }
         else {
-            console.log('Path in formArray should start with ', head, ', full path: ', path);
+            console.error('Path in formArray should start with ', head, ', full path: ', path);
         }
     }
-    getValue(fields, head) {
-        if (this.isDynamicList(fields[head])) {
-            return fields[head].value.code;
+    static removeStarChar(str) {
+        if (str && str.indexOf('*') > -1) {
+            return str.substring(0, str.indexOf('*'));
+        }
+        return str;
+    }
+    static okIfBothEmpty(right, value) {
+        return value === null && (right === '');
+    }
+}
+
+class ShowCondition {
+    // Expects a show condition of the form: <fieldName>="string"
+    constructor(condition) {
+        this.condition = condition;
+        this.conditions = [];
+        if (!!condition) {
+            this.conditions = ConditionParser.parse(condition);
+        }
+    }
+    static addPathPrefixToCondition(showCondition, pathPrefix) {
+        if (!pathPrefix || pathPrefix === '') {
+            return showCondition;
+        }
+        if (!showCondition) {
+            return '';
+        }
+        const formula = ConditionParser.parse(showCondition);
+        if (!formula) {
+            return showCondition;
+        }
+        this.processedList = [];
+        showCondition = showCondition.replace(/CONTAINS/g, ' CONTAINS');
+        const processedCondition = this.processAddPathPrefixToCondition(formula, pathPrefix, showCondition);
+        return processedCondition.replace(/ CONTAINS/g, 'CONTAINS');
+    }
+    static processAddPathPrefixToCondition(formula, pathPrefix, originalCondition) {
+        let finalCondition = originalCondition;
+        if (Array.isArray(formula)) {
+            formula.forEach(condition => {
+                if (typeof condition === 'string' && this.validJoinComparators.indexOf(condition) !== -1) {
+                    // do nothing
+                }
+                else {
+                    if (Array.isArray(condition)) {
+                        finalCondition = this.processAddPathPrefixToCondition(condition, pathPrefix, finalCondition);
+                    }
+                    else {
+                        finalCondition = this.extractConditions(condition, pathPrefix, finalCondition);
+                    }
+                }
+            });
         }
         else {
-            return fields[head];
+            finalCondition = this.extractConditions(formula, pathPrefix, finalCondition);
         }
+        return finalCondition;
     }
-    isDynamicList(dynamiclist) {
-        return !_.isEmpty(dynamiclist) &&
-            (_.has(dynamiclist, 'value') && _.has(dynamiclist, 'list_items'));
+    static extractConditions(condition, pathPrefix, originalCondition) {
+        if (condition.fieldReference.startsWith(pathPrefix)) {
+            return originalCondition;
+        }
+        else {
+            if (originalCondition.indexOf(condition.fieldReference) > -1) {
+                if (this.processedList && this.processedList.indexOf(condition.fieldReference) === -1) {
+                    this.processedList.push(condition.fieldReference);
+                    const regularExp = new RegExp('(\\b)' + condition.fieldReference + '(?=[^"]*(?:"[^"]*"[^"]*)*$)(\\b)', 'g');
+                    return originalCondition.replace(regularExp, pathPrefix + '.' + condition.fieldReference);
+                }
+                else {
+                    return originalCondition;
+                }
+            }
+        }
     }
-    unquoted(str) {
-        return str.replace(/(?:^")|(?:"$)/g, '');
+    // Cache instances so that we can cache results more effectively
+    static getInstance(condition) {
+        let instance = this.instanceCache.get(condition);
+        if (!instance) {
+            instance = new ShowCondition(condition);
+            this.instanceCache.set(condition, instance);
+        }
+        return instance;
     }
-    removeStarChar(str) {
-        return str.substring(0, str.length - 1);
+    static getField(condition) {
+        let separator = ShowCondition.CONTAINS;
+        if (condition.indexOf(ShowCondition.CONTAINS) < 0) {
+            separator = ShowCondition.CONDITION_EQUALS;
+            if (condition.indexOf(ShowCondition.CONDITION_NOT_EQUALS) > -1) {
+                separator = ShowCondition.CONDITION_NOT_EQUALS;
+            }
+        }
+        return [condition.split(separator)[0], separator];
     }
-    okIfBothEmpty(right, value) {
-        return value === null && (right === '');
+    static getConditions(formula) {
+        const conditionList = [];
+        if (!!formula) {
+            const newFormula = typeof formula === 'string' ? JSON.parse(formula) : formula;
+            if (Array.isArray(newFormula)) {
+                newFormula.forEach(condition => {
+                    if (!(typeof condition === 'string' && this.validJoinComparators.indexOf(condition) !== -1)) {
+                        if (Array.isArray(condition)) {
+                            conditionList.push(ShowCondition.getConditions(condition).toString());
+                        }
+                        else {
+                            conditionList.push(condition.fieldReference + condition.comparator + condition.value);
+                        }
+                    }
+                });
+            }
+            else {
+                conditionList.push(newFormula.fieldReference + newFormula.comparator + newFormula.value);
+            }
+        }
+        return conditionList.toString();
+    }
+    /**
+     * Determine whether a ShowCondition model is affected by fields that have
+     * a display_context of HIDDEN or READONLY, which means they aren't able to
+     * be changed by the user's actions.
+     *
+     * @param showCondition The ShowCondition model to evaluate.
+     * @param caseFields Inspected to see appropriate display_contexts.
+     */
+    static hiddenCannotChange(showCondition, caseFields) {
+        if (showCondition && showCondition.conditions.length && caseFields) {
+            const conditions = this.getConditions(showCondition.conditions).split(',');
+            if (conditions && conditions.length > 0) {
+                let allUnchangeable = true;
+                for (const condition of conditions) {
+                    const [field] = ShowCondition.getField(condition);
+                    const path = field.split('.');
+                    let head = path.shift();
+                    let caseField = caseFields.find(cf => cf.id === head);
+                    while (path.length > 0) {
+                        head = path.shift();
+                        if (caseField) {
+                            // Jump out if this is HIDDEN or READONLY, regardless of whether or not it's
+                            // complex or a collection - nested fields will "inherit" the display_context.
+                            if (['HIDDEN', 'READONLY'].indexOf(caseField.display_context) > -1) {
+                                break;
+                            }
+                            // Consider what type of field this is.
+                            const ft = caseField.field_type;
+                            switch (ft.type) {
+                                case 'Collection':
+                                    if (ft.collection_field_type.type === 'Complex' && ft.collection_field_type.complex_fields) {
+                                        caseField = ft.collection_field_type.complex_fields.find(cf => cf.id === head);
+                                    }
+                                    break;
+                                case 'Complex':
+                                    if (ft.complex_fields) {
+                                        caseField = ft.complex_fields.find(cf => cf.id === head);
+                                    }
+                                    break;
+                            }
+                        }
+                    }
+                    if (caseField) {
+                        allUnchangeable = allUnchangeable && ['HIDDEN', 'READONLY'].indexOf(caseField.display_context) > -1;
+                    }
+                }
+                return allUnchangeable;
+            }
+        }
+        return false;
+    }
+    match(fields, path) {
+        return ConditionParser.evaluate(fields, this.conditions, this.updatePathName(path));
+    }
+    updatePathName(path) {
+        if (path && path.split(/[_]+/g).length > 0) {
+            /* tslint:disable-next-line */
+            let [pathName, ...pathTail] = path.split(/[_]+/g);
+            const pathFinalIndex = pathTail.pop();
+            const pathTailString = pathTail.toString();
+            pathTail = pathTail.map((value) => {
+                return Number(pathFinalIndex) === Number(value) ? pathName : value;
+            });
+            return pathTailString !== pathTail.toString()
+                ? `${pathName}_${pathTail.join('_')}_${pathFinalIndex}`
+                : path;
+        }
+        else {
+            return path;
+        }
+    }
+    matchByContextFields(contextFields) {
+        return this.match(FieldsUtils.toValuesMap(contextFields));
+    }
+    /**
+     * Determine whether this is affected by fields that have a display_context
+     * of HIDDEN or READONLY, which means they aren't able to be changed by the
+     * user's actions.
+     *
+     * @param caseFields Inspected to see appropriate display_contexts.
+     */
+    hiddenCannotChange(caseFields) {
+        return ShowCondition.hiddenCannotChange(this, caseFields);
     }
 }
-ShowCondition.AND_CONDITION_REGEXP = new RegExp('\\sAND\\s(?![^"]*"(?:(?:[^"]*"){2})*[^"]*$)', 'g');
-ShowCondition.OR_CONDITION_REGEXP = new RegExp('\\sOR\\s(?![^"]*"(?:(?:[^"]*"){2})*[^"]*$)', 'g');
 ShowCondition.CONDITION_NOT_EQUALS = '!=';
 ShowCondition.CONDITION_EQUALS = '=';
 ShowCondition.CONTAINS = 'CONTAINS';
 ShowCondition.instanceCache = new Map();
+ShowCondition.validJoinComparators = ['AND', 'OR'];
+ShowCondition.processedList = [];
 
 class Constants {
 }
@@ -5886,13 +6089,14 @@ class CaseFlagRefdataService {
         return of(null);
     }
     /**
-     * Retrieves the HMCTS service details for a jurisdiction or service, including service code. (For example, the "SSCS"
-     * service has a corresponding service code of "BBA3".)
+     * Retrieves the HMCTS service details for a jurisdiction or service, including service codes. More than one
+     * service code may be present. For example, the Divorce jurisdiction/service has corresponding service codes of
+     * "ABA1" and "ABA2".
      *
      * @param serviceNames The service name(s) to look up, comma-separated if more than one
      * @returns An `Observable` of an array of service details
      */
-    getHmctsServiceDetails(serviceNames) {
+    getHmctsServiceDetailsByServiceName(serviceNames) {
         let url = this.appConfig.getLocationRefApiUrl();
         if (url) {
             url += '/orgServices';
@@ -5903,6 +6107,26 @@ class CaseFlagRefdataService {
         }
         return of(null);
     }
+    /**
+     * Retrieves the HMCTS service details for a case type, including service code. For example, the
+     * "FinancialRemedyContested" case type is associated with the Divorce jurisdiction/service and service code "ABA2".
+     *
+     * Note that a case type might not be associated with any service codes of a jurisdiction or service.
+     *
+     * @param caseTypeId The case type ID to look up
+     * @returns An `Observable` of an array of service details
+     */
+    getHmctsServiceDetailsByCaseType(caseTypeId) {
+        let url = this.appConfig.getLocationRefApiUrl();
+        if (url) {
+            url += '/orgServices';
+            if (caseTypeId) {
+                url += `?ccdCaseType=${caseTypeId}`;
+            }
+            return this.http.get(url, { observe: 'body' });
+        }
+        return of(null);
+    }
 }
 CaseFlagRefdataService.ɵfac = function CaseFlagRefdataService_Factory(t) { return new (t || CaseFlagRefdataService)(i0.ɵɵinject(HttpService), i0.ɵɵinject(AbstractAppConfig)); };
 CaseFlagRefdataService.ɵprov = i0.ɵɵdefineInjectable({ token: CaseFlagRefdataService, factory: CaseFlagRefdataService.ɵfac });
@@ -10784,7 +11008,7 @@ function WriteCaseFlagFieldComponent_div_1_ng_container_5_Template(rf, ctx) { if
 } if (rf & 2) {
     const ctx_r8 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(1);
-    i0.ɵɵproperty("formGroup", ctx_r8.caseFlagParentFormGroup)("jurisdiction", ctx_r8.jurisdiction);
+    i0.ɵɵproperty("formGroup", ctx_r8.caseFlagParentFormGroup)("jurisdiction", ctx_r8.jurisdiction)("caseTypeId", ctx_r8.caseTypeId)("hmctsServiceId", ctx_r8.hmctsServiceId);
 } }
 function WriteCaseFlagFieldComponent_div_1_ng_container_6_Template(rf, ctx) { if (rf & 1) {
     const _r17 = i0.ɵɵgetCurrentView();
@@ -10818,7 +11042,7 @@ function WriteCaseFlagFieldComponent_div_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd();
     i0.ɵɵtemplate(4, WriteCaseFlagFieldComponent_div_1_ng_container_4_Template, 2, 2, "ng-container", 11);
-    i0.ɵɵtemplate(5, WriteCaseFlagFieldComponent_div_1_ng_container_5_Template, 2, 2, "ng-container", 11);
+    i0.ɵɵtemplate(5, WriteCaseFlagFieldComponent_div_1_ng_container_5_Template, 2, 4, "ng-container", 11);
     i0.ɵɵtemplate(6, WriteCaseFlagFieldComponent_div_1_ng_container_6_Template, 2, 3, "ng-container", 11);
     i0.ɵɵtemplate(7, WriteCaseFlagFieldComponent_div_1_ng_container_7_Template, 2, 2, "ng-container", 11);
     i0.ɵɵelementEnd();
@@ -10917,29 +11141,40 @@ class WriteCaseFlagFieldComponent extends AbstractFieldWriteComponent {
             }
         }), true);
         this.createFlagCaption = CaseFlagText.CAPTION;
-        // Get the jurisdiction from the CaseView object in the snapshot data (required for retrieving the available flag
+        // Get the case type ID from the CaseView object in the snapshot data (required for retrieving the available flag
         // types for a case)
-        if (this.route.snapshot.data.case && this.route.snapshot.data.case.case_type &&
-            this.route.snapshot.data.case.case_type.jurisdiction) {
-            this.jurisdiction = this.route.snapshot.data.case.case_type.jurisdiction.id;
+        if (this.route.snapshot.data.case && this.route.snapshot.data.case.case_type) {
+            this.caseTypeId = this.route.snapshot.data.case.case_type.id;
+            // Get the jurisdiction (required for retrieving the available flag types if unable to determine using case type ID)
+            if (this.route.snapshot.data.case.case_type.jurisdiction) {
+                this.jurisdiction = this.route.snapshot.data.case.case_type.jurisdiction.id;
+            }
         }
         // Extract all flags-related data from the CaseEventTrigger object in the snapshot data
-        if (this.route.snapshot.data.eventTrigger && this.route.snapshot.data.eventTrigger.case_fields) {
-            this.flagsData = (this.route.snapshot.data.eventTrigger.case_fields)
-                .reduce((flags, caseField) => {
-                return FieldsUtils.extractFlagsDataFromCaseField(flags, caseField, caseField.id, caseField);
-            }, []);
-            // Set boolean indicating the display_context_parameter is "update"
-            this.isDisplayContextParameterUpdate =
-                this.setDisplayContextParameterUpdate((this.route.snapshot.data.eventTrigger.case_fields));
-            // Set starting field state
-            this.fieldState = this.isDisplayContextParameterUpdate ? CaseFlagFieldState.FLAG_MANAGE_CASE_FLAGS : CaseFlagFieldState.FLAG_LOCATION;
-            // Get case title, to be used by child components
-            this.caseEditDataService.caseTitle$.subscribe({
-                next: title => {
-                    this.caseTitle = title.length > 0 ? title : this.caseNameMissing;
-                }
-            });
+        if (this.route.snapshot.data.eventTrigger) {
+            // Get the HMCTSServiceId from supplementary data, if it exists (required for retrieving the available flag types in
+            // the first instance, only falling back on case type ID or jurisidiction if it's not present)
+            if (this.route.snapshot.data.eventTrigger.supplementary_data
+                && this.route.snapshot.data.eventTrigger.supplementary_data.HMCTSServiceId) {
+                this.hmctsServiceId = this.route.snapshot.data.eventTrigger.supplementary_data.HMCTSServiceId;
+            }
+            if (this.route.snapshot.data.eventTrigger.case_fields) {
+                this.flagsData = (this.route.snapshot.data.eventTrigger.case_fields)
+                    .reduce((flags, caseField) => {
+                    return FieldsUtils.extractFlagsDataFromCaseField(flags, caseField, caseField.id, caseField);
+                }, []);
+                // Set boolean indicating the display_context_parameter is "update"
+                this.isDisplayContextParameterUpdate =
+                    this.setDisplayContextParameterUpdate((this.route.snapshot.data.eventTrigger.case_fields));
+                // Set starting field state
+                this.fieldState = this.isDisplayContextParameterUpdate ? CaseFlagFieldState.FLAG_MANAGE_CASE_FLAGS : CaseFlagFieldState.FLAG_LOCATION;
+                // Get case title, to be used by child components
+                this.caseEditDataService.caseTitle$.subscribe({
+                    next: title => {
+                        this.caseTitle = title.length > 0 ? title : this.caseNameMissing;
+                    }
+                });
+            }
         }
     }
     setDisplayContextParameterUpdate(caseFields) {
@@ -11172,7 +11407,7 @@ class WriteCaseFlagFieldComponent extends AbstractFieldWriteComponent {
     }
 }
 WriteCaseFlagFieldComponent.ɵfac = function WriteCaseFlagFieldComponent_Factory(t) { return new (t || WriteCaseFlagFieldComponent)(i0.ɵɵdirectiveInject(i1$1.ActivatedRoute), i0.ɵɵdirectiveInject(CaseEditDataService)); };
-WriteCaseFlagFieldComponent.ɵcmp = i0.ɵɵdefineComponent({ type: WriteCaseFlagFieldComponent, selectors: [["ccd-write-case-flag-field"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 3, vars: 3, consts: [["class", "govuk-error-summary", "aria-labelledby", "error-summary-title", "role", "alert", "tabindex", "-1", "data-module", "govuk-error-summary", 4, "ngIf"], ["class", "form-group", 3, "formGroup", 4, "ngIf"], ["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-group", 3, "formGroup"], [1, "govuk-form-group", 3, "ngSwitch"], ["id", "create-flag-caption", 1, "govuk-caption-l", 3, "ngClass"], [4, "ngSwitchCase"], [3, "formGroup", "flagsData", "caseFlagStateEmitter"], [3, "formGroup", "jurisdiction", "caseFlagStateEmitter", "flagCommentsOptionalEmitter"], [3, "formGroup", "languages", "flagCode", "caseFlagStateEmitter"], [3, "formGroup", "optional", "caseFlagStateEmitter"], [3, "formGroup", "flagsData", "caseTitle", "caseFlagStateEmitter"], [3, "formGroup", "selectedFlag", "caseFlagStateEmitter"]], template: function WriteCaseFlagFieldComponent_Template(rf, ctx) { if (rf & 1) {
+WriteCaseFlagFieldComponent.ɵcmp = i0.ɵɵdefineComponent({ type: WriteCaseFlagFieldComponent, selectors: [["ccd-write-case-flag-field"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 3, vars: 3, consts: [["class", "govuk-error-summary", "aria-labelledby", "error-summary-title", "role", "alert", "tabindex", "-1", "data-module", "govuk-error-summary", 4, "ngIf"], ["class", "form-group", 3, "formGroup", 4, "ngIf"], ["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-group", 3, "formGroup"], [1, "govuk-form-group", 3, "ngSwitch"], ["id", "create-flag-caption", 1, "govuk-caption-l", 3, "ngClass"], [4, "ngSwitchCase"], [3, "formGroup", "flagsData", "caseFlagStateEmitter"], [3, "formGroup", "jurisdiction", "caseTypeId", "hmctsServiceId", "caseFlagStateEmitter", "flagCommentsOptionalEmitter"], [3, "formGroup", "languages", "flagCode", "caseFlagStateEmitter"], [3, "formGroup", "optional", "caseFlagStateEmitter"], [3, "formGroup", "flagsData", "caseTitle", "caseFlagStateEmitter"], [3, "formGroup", "selectedFlag", "caseFlagStateEmitter"]], template: function WriteCaseFlagFieldComponent_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵtemplate(0, WriteCaseFlagFieldComponent_div_0_Template, 4, 1, "div", 0);
         i0.ɵɵtemplate(1, WriteCaseFlagFieldComponent_div_1_Template, 8, 10, "div", 1);
         i0.ɵɵtemplate(2, WriteCaseFlagFieldComponent_div_2_Template, 4, 4, "div", 1);
@@ -14494,6 +14729,9 @@ class PaymentField extends AbstractFieldReadComponent {
     getRefundsUrl() {
         return this.appConfig.getRefundsUrl();
     }
+    getNotificationUrl() {
+        return this.appConfig.getNotificationUrl();
+    }
     getUserRoles() {
         const userDetails = JSON.parse(this.sessionStorage.getItem('userDetails') || null);
         if (!userDetails || !userDetails.hasOwnProperty('roles')) {
@@ -14516,10 +14754,10 @@ class CasePaymentHistoryViewerFieldComponent extends PaymentField {
     }
 }
 CasePaymentHistoryViewerFieldComponent.ɵfac = function CasePaymentHistoryViewerFieldComponent_Factory(t) { return new (t || CasePaymentHistoryViewerFieldComponent)(i0.ɵɵdirectiveInject(AbstractAppConfig), i0.ɵɵdirectiveInject(SessionStorageService)); };
-CasePaymentHistoryViewerFieldComponent.ɵcmp = i0.ɵɵdefineComponent({ type: CasePaymentHistoryViewerFieldComponent, selectors: [["ccd-case-payment-history-viewer-field"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 1, vars: 15, consts: [[3, "API_ROOT", "CCD_CASE_NUMBER", "BULKSCAN_API_ROOT", "SELECTED_OPTION", "ISBSENABLE", "LOGGEDINUSEREMAIL", "LOGGEDINUSERROLES", "REFUNDS_API_ROOT", "VIEW", "TAKEPAYMENT", "SERVICEREQUEST", "PAYMENT_GROUP_REF", "EXC_REFERENCE", "DCN_NUMBER", "ISPAYMENTSTATUSENABLED"]], template: function CasePaymentHistoryViewerFieldComponent_Template(rf, ctx) { if (rf & 1) {
+CasePaymentHistoryViewerFieldComponent.ɵcmp = i0.ɵɵdefineComponent({ type: CasePaymentHistoryViewerFieldComponent, selectors: [["ccd-case-payment-history-viewer-field"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 1, vars: 16, consts: [[3, "API_ROOT", "CCD_CASE_NUMBER", "BULKSCAN_API_ROOT", "SELECTED_OPTION", "ISBSENABLE", "LOGGEDINUSEREMAIL", "LOGGEDINUSERROLES", "REFUNDS_API_ROOT", "NOTIFICATION_API_ROOT", "VIEW", "TAKEPAYMENT", "SERVICEREQUEST", "PAYMENT_GROUP_REF", "EXC_REFERENCE", "DCN_NUMBER", "ISPAYMENTSTATUSENABLED"]], template: function CasePaymentHistoryViewerFieldComponent_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵelement(0, "ccpay-payment-lib", 0);
     } if (rf & 2) {
-        i0.ɵɵproperty("API_ROOT", ctx.getBaseURL())("CCD_CASE_NUMBER", ctx.caseReference)("BULKSCAN_API_ROOT", ctx.getPayBulkScanBaseURL())("SELECTED_OPTION", "CCDorException")("ISBSENABLE", "true")("LOGGEDINUSEREMAIL", ctx.getUserEmail())("LOGGEDINUSERROLES", ctx.getUserRoles())("REFUNDS_API_ROOT", ctx.getRefundsUrl())("VIEW", "case-transactions")("TAKEPAYMENT", false)("SERVICEREQUEST", false)("PAYMENT_GROUP_REF", null)("EXC_REFERENCE", ctx.caseReference)("DCN_NUMBER", null)("ISPAYMENTSTATUSENABLED", "Enable");
+        i0.ɵɵproperty("API_ROOT", ctx.getBaseURL())("CCD_CASE_NUMBER", ctx.caseReference)("BULKSCAN_API_ROOT", ctx.getPayBulkScanBaseURL())("SELECTED_OPTION", "CCDorException")("ISBSENABLE", "true")("LOGGEDINUSEREMAIL", ctx.getUserEmail())("LOGGEDINUSERROLES", ctx.getUserRoles())("REFUNDS_API_ROOT", ctx.getRefundsUrl())("NOTIFICATION_API_ROOT", ctx.getNotificationUrl())("VIEW", "case-transactions")("TAKEPAYMENT", false)("SERVICEREQUEST", false)("PAYMENT_GROUP_REF", null)("EXC_REFERENCE", ctx.caseReference)("DCN_NUMBER", null)("ISPAYMENTSTATUSENABLED", "Enable");
     } }, directives: [i3.PaymentLibComponent], encapsulation: 2 });
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CasePaymentHistoryViewerFieldComponent, [{
         type: Component,
@@ -14830,7 +15068,7 @@ function WaysToPayFieldComponent_ccpay_payment_lib_0_Template(rf, ctx) { if (rf
     i0.ɵɵelement(0, "ccpay-payment-lib", 1);
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("API_ROOT", ctx_r0.getBaseURL())("BULKSCAN_API_ROOT", ctx_r0.getPayBulkScanBaseURL())("REFUNDS_API_ROOT", ctx_r0.getRefundsUrl())("CCD_CASE_NUMBER", ctx_r0.caseReference)("VIEW", "case-transactions")("TAKEPAYMENT", false)("SERVICEREQUEST", true)("PAYMENT_GROUP_REF", null)("EXC_REFERENCE", ctx_r0.caseReference)("DCN_NUMBER", null)("SELECTED_OPTION", "CCDorException")("LOGGEDINUSERROLES", ctx_r0.getUserRoles())("CARDPAYMENTRETURNURL", ctx_r0.getCardPaymentReturnUrl())("ISPAYMENTSTATUSENABLED", "Enable");
+    i0.ɵɵproperty("API_ROOT", ctx_r0.getBaseURL())("BULKSCAN_API_ROOT", ctx_r0.getPayBulkScanBaseURL())("REFUNDS_API_ROOT", ctx_r0.getRefundsUrl())("NOTIFICATION_API_ROOT", ctx_r0.getNotificationUrl())("CCD_CASE_NUMBER", ctx_r0.caseReference)("VIEW", "case-transactions")("TAKEPAYMENT", false)("SERVICEREQUEST", true)("PAYMENT_GROUP_REF", null)("EXC_REFERENCE", ctx_r0.caseReference)("DCN_NUMBER", null)("SELECTED_OPTION", "CCDorException")("LOGGEDINUSERROLES", ctx_r0.getUserRoles())("CARDPAYMENTRETURNURL", ctx_r0.getCardPaymentReturnUrl())("ISPAYMENTSTATUSENABLED", "Enable");
 } }
 class WaysToPayFieldComponent extends PaymentField {
     constructor(appConfig, sessionStorage) {
@@ -14841,8 +15079,8 @@ class WaysToPayFieldComponent extends PaymentField {
     }
 }
 WaysToPayFieldComponent.ɵfac = function WaysToPayFieldComponent_Factory(t) { return new (t || WaysToPayFieldComponent)(i0.ɵɵdirectiveInject(AbstractAppConfig), i0.ɵɵdirectiveInject(SessionStorageService)); };
-WaysToPayFieldComponent.ɵcmp = i0.ɵɵdefineComponent({ type: WaysToPayFieldComponent, selectors: [["ccd-ways-to-pay-field"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 1, vars: 1, consts: [[3, "API_ROOT", "BULKSCAN_API_ROOT", "REFUNDS_API_ROOT", "CCD_CASE_NUMBER", "VIEW", "TAKEPAYMENT", "SERVICEREQUEST", "PAYMENT_GROUP_REF", "EXC_REFERENCE", "DCN_NUMBER", "SELECTED_OPTION", "LOGGEDINUSERROLES", "CARDPAYMENTRETURNURL", "ISPAYMENTSTATUSENABLED", 4, "ngIf"], [3, "API_ROOT", "BULKSCAN_API_ROOT", "REFUNDS_API_ROOT", "CCD_CASE_NUMBER", "VIEW", "TAKEPAYMENT", "SERVICEREQUEST", "PAYMENT_GROUP_REF", "EXC_REFERENCE", "DCN_NUMBER", "SELECTED_OPTION", "LOGGEDINUSERROLES", "CARDPAYMENTRETURNURL", "ISPAYMENTSTATUSENABLED"]], template: function WaysToPayFieldComponent_Template(rf, ctx) { if (rf & 1) {
-        i0.ɵɵtemplate(0, WaysToPayFieldComponent_ccpay_payment_lib_0_Template, 1, 14, "ccpay-payment-lib", 0);
+WaysToPayFieldComponent.ɵcmp = i0.ɵɵdefineComponent({ type: WaysToPayFieldComponent, selectors: [["ccd-ways-to-pay-field"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 1, vars: 1, consts: [[3, "API_ROOT", "BULKSCAN_API_ROOT", "REFUNDS_API_ROOT", "NOTIFICATION_API_ROOT", "CCD_CASE_NUMBER", "VIEW", "TAKEPAYMENT", "SERVICEREQUEST", "PAYMENT_GROUP_REF", "EXC_REFERENCE", "DCN_NUMBER", "SELECTED_OPTION", "LOGGEDINUSERROLES", "CARDPAYMENTRETURNURL", "ISPAYMENTSTATUSENABLED", 4, "ngIf"], [3, "API_ROOT", "BULKSCAN_API_ROOT", "REFUNDS_API_ROOT", "NOTIFICATION_API_ROOT", "CCD_CASE_NUMBER", "VIEW", "TAKEPAYMENT", "SERVICEREQUEST", "PAYMENT_GROUP_REF", "EXC_REFERENCE", "DCN_NUMBER", "SELECTED_OPTION", "LOGGEDINUSERROLES", "CARDPAYMENTRETURNURL", "ISPAYMENTSTATUSENABLED"]], template: function WaysToPayFieldComponent_Template(rf, ctx) { if (rf & 1) {
+        i0.ɵɵtemplate(0, WaysToPayFieldComponent_ccpay_payment_lib_0_Template, 1, 15, "ccpay-payment-lib", 0);
     } if (rf & 2) {
         i0.ɵɵproperty("ngIf", ctx.getUserRoles().length > 0);
     } }, directives: [i1.NgIf, i3.PaymentLibComponent], encapsulation: 2 });
@@ -15486,7 +15724,7 @@ CaseFileViewFolderSelectorComponent.ɵcmp = i0.ɵɵdefineComponent({ type: CaseF
         i0.ɵɵtextInterpolate1("Where do you want to move \"", ctx.data.document.document_filename, "\" file?");
         i0.ɵɵadvance(2);
         i0.ɵɵproperty("ngForOf", ctx.currentCategories);
-    } }, directives: [i1.NgForOf, i1.NgTemplateOutlet], styles: [":host{position:relative;display:block}.folders{margin-bottom:20px}.folder{display:none;border-top:1px solid #ccc;margin:0 0 -1px}.folder:last-child{border-bottom:1px solid #ccc}.folders>.folder,input:checked~.folder{display:block}.iconImg{position:relative;display:inline-block;height:28px}.folder>.folder{margin-left:20px}.folder label:before{top:3px}.folder label:after{top:13px}p{font-weight:700}button{margin-right:20px}.close{float:right;width:30px;height:30px;background:url(/assets/img/x.PNG) no-repeat 50%}.cancel,.close{cursor:pointer}.cdk-overlay-pane{overflow:auto}.cdk-overlay-pane::-webkit-scrollbar{width:7px}.cdk-overlay-pane::-webkit-scrollbar-thumb{border:4px solid transparent;background-clip:padding-box;border-radius:9999px;background-color:#aaa}.cdk-overlay-pane::-webkit-scrollbar-button{display:none}.cdk-overlay-pane::-webkit-scrollbar-track-piece{background:#eee}.cdk-overlay-pane::-webkit-scrollbar-thumb{background:#ccc}"], encapsulation: 2 });
+    } }, directives: [i1.NgForOf, i1.NgTemplateOutlet], styles: [":host{position:relative;display:block}.folders{margin-bottom:20px}.folder{display:none;border-top:1px solid #ccc;margin:0 0 -1px}.folder,.folder:last-child{border-bottom:1px solid #ccc}.folders>.folder,input:checked~.folder{display:block}.iconImg{position:relative;display:inline-block;height:28px}.folder>.folder{margin-left:20px}.folder label:before{top:3px}.folder label:after{top:13px}p{font-weight:700}button{margin-right:20px}.close{float:right;width:30px;height:30px;background:url(/assets/img/x.PNG) no-repeat 50%}.cancel,.close{cursor:pointer}.cdk-overlay-pane{overflow:auto}.cdk-overlay-pane::-webkit-scrollbar{width:7px}.cdk-overlay-pane::-webkit-scrollbar-thumb{border:4px solid transparent;background-clip:padding-box;border-radius:9999px;background-color:#aaa}.cdk-overlay-pane::-webkit-scrollbar-button{display:none}.cdk-overlay-pane::-webkit-scrollbar-track-piece{background:#eee}.cdk-overlay-pane::-webkit-scrollbar-thumb{background:#ccc}"], encapsulation: 2 });
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseFileViewFolderSelectorComponent, [{
         type: Component,
         args: [{
@@ -16370,23 +16608,30 @@ class SelectFlagTypeComponent {
             && this.formGroup['caseField'].id === this.caseLevelCaseFlagsFieldId
             ? RefdataCaseFlagType.CASE
             : RefdataCaseFlagType.PARTY;
-        // HMCTS service code for a given jurisdiction is required to retrieve the relevant list of flag types
-        this.flagRefdata$ = this.caseFlagRefdataService.getHmctsServiceDetails(this.jurisdiction)
-            .pipe(
-        // Use switchMap to return an inner Observable of the flag types data, having received the service details
-        // including service_code. This avoids having nested `subscribe`s, which is an anti-pattern!
-        switchMap(serviceDetails => {
-            return this.caseFlagRefdataService.getCaseFlagsRefdata(serviceDetails[0].service_code, flagType);
-        }))
-            .subscribe({
-            next: flagTypes => {
+        // If hmctsServiceId is present, use this to retrieve the relevant list of flag types
+        if (this.hmctsServiceId) {
+            this.flagRefdata$ = this.caseFlagRefdataService.getCaseFlagsRefdata(this.hmctsServiceId, flagType)
+                .subscribe({
                 // First (and only) object in the returned array should be the top-level "Party" flag type
-                this.flagTypes = flagTypes[0].childFlags;
-            },
-            error: error => {
-                this.onRefdataError(error);
-            }
-        });
+                next: flagTypes => this.flagTypes = flagTypes[0].childFlags,
+                error: error => this.onRefdataError(error)
+            });
+        }
+        else {
+            // Else, HMCTS service code is required to retrieve the relevant list of flag types; attempt to obtain it by case type ID first
+            this.flagRefdata$ = this.caseFlagRefdataService.getHmctsServiceDetailsByCaseType(this.caseTypeId)
+                .pipe(
+            // If an error occurs retrieving HMCTS service details by case type ID, try by service name instead
+            catchError(_ => this.caseFlagRefdataService.getHmctsServiceDetailsByServiceName(this.jurisdiction)), 
+            // Use switchMap to return an inner Observable of the flag types data, having received the service details
+            // including service_code. This avoids having nested `subscribe`s, which is an anti-pattern!
+            switchMap(serviceDetails => this.caseFlagRefdataService.getCaseFlagsRefdata(serviceDetails[0].service_code, flagType)))
+                .subscribe({
+                // First (and only) object in the returned array should be the top-level "Party" flag type
+                next: flagTypes => this.flagTypes = flagTypes[0].childFlags,
+                error: error => this.onRefdataError(error)
+            });
+        }
     }
     ngOnDestroy() {
         if (this.flagRefdata$) {
@@ -16457,7 +16702,7 @@ class SelectFlagTypeComponent {
     }
 }
 SelectFlagTypeComponent.ɵfac = function SelectFlagTypeComponent_Factory(t) { return new (t || SelectFlagTypeComponent)(i0.ɵɵdirectiveInject(CaseFlagRefdataService)); };
-SelectFlagTypeComponent.ɵcmp = i0.ɵɵdefineComponent({ type: SelectFlagTypeComponent, selectors: [["ccd-select-flag-type"]], inputs: { formGroup: "formGroup", jurisdiction: "jurisdiction" }, outputs: { caseFlagStateEmitter: "caseFlagStateEmitter", flagCommentsOptionalEmitter: "flagCommentsOptionalEmitter" }, decls: 11, vars: 9, consts: [[1, "form-group", 3, "formGroup"], [1, "govuk-form-group", 3, "ngClass"], ["aria-describedby", "flag-type-heading", 1, "govuk-fieldset"], [1, "govuk-fieldset__legend", "govuk-fieldset__legend--l"], ["id", "flag-type-heading", 1, "govuk-fieldset__heading"], ["id", "flag-type-not-selected-error-message", "class", "govuk-error-message", 4, "ngIf"], ["data-module", "govuk-radios", "id", "conditional-radios-list", 1, "govuk-radios", "govuk-radios--conditional"], ["class", "govuk-radios__item", 4, "ngFor", "ngForOf"], ["class", "govuk-radios__conditional", "id", "conditional-flagType", 4, "ngIf"], ["class", "govuk-button-group", 4, "ngIf"], ["id", "flag-type-not-selected-error-message", 1, "govuk-error-message"], [1, "govuk-visually-hidden"], [1, "govuk-radios__item"], ["type", "radio", 1, "govuk-radios__input", 3, "id", "name", "value", "formControlName", "change"], [1, "govuk-label", "govuk-radios__label", 3, "for"], ["id", "conditional-flagType", 1, "govuk-radios__conditional"], ["for", "other-flag-type-description", 1, "govuk-label"], ["id", "flag-type-error-message", "class", "govuk-error-message", 4, "ngIf"], ["id", "other-flag-type-description", "type", "text", 1, "govuk-input", "govuk-!-width-one-half", 3, "ngClass", "name", "formControlName"], ["id", "flag-type-error-message", 1, "govuk-error-message"], [1, "govuk-button-group"], ["type", "button", 1, "button", "button-primary", 3, "click"]], template: function SelectFlagTypeComponent_Template(rf, ctx) { if (rf & 1) {
+SelectFlagTypeComponent.ɵcmp = i0.ɵɵdefineComponent({ type: SelectFlagTypeComponent, selectors: [["ccd-select-flag-type"]], inputs: { formGroup: "formGroup", jurisdiction: "jurisdiction", caseTypeId: "caseTypeId", hmctsServiceId: "hmctsServiceId" }, outputs: { caseFlagStateEmitter: "caseFlagStateEmitter", flagCommentsOptionalEmitter: "flagCommentsOptionalEmitter" }, decls: 11, vars: 9, consts: [[1, "form-group", 3, "formGroup"], [1, "govuk-form-group", 3, "ngClass"], ["aria-describedby", "flag-type-heading", 1, "govuk-fieldset"], [1, "govuk-fieldset__legend", "govuk-fieldset__legend--l"], ["id", "flag-type-heading", 1, "govuk-fieldset__heading"], ["id", "flag-type-not-selected-error-message", "class", "govuk-error-message", 4, "ngIf"], ["data-module", "govuk-radios", "id", "conditional-radios-list", 1, "govuk-radios", "govuk-radios--conditional"], ["class", "govuk-radios__item", 4, "ngFor", "ngForOf"], ["class", "govuk-radios__conditional", "id", "conditional-flagType", 4, "ngIf"], ["class", "govuk-button-group", 4, "ngIf"], ["id", "flag-type-not-selected-error-message", 1, "govuk-error-message"], [1, "govuk-visually-hidden"], [1, "govuk-radios__item"], ["type", "radio", 1, "govuk-radios__input", 3, "id", "name", "value", "formControlName", "change"], [1, "govuk-label", "govuk-radios__label", 3, "for"], ["id", "conditional-flagType", 1, "govuk-radios__conditional"], ["for", "other-flag-type-description", 1, "govuk-label"], ["id", "flag-type-error-message", "class", "govuk-error-message", 4, "ngIf"], ["id", "other-flag-type-description", "type", "text", 1, "govuk-input", "govuk-!-width-one-half", 3, "ngClass", "name", "formControlName"], ["id", "flag-type-error-message", 1, "govuk-error-message"], [1, "govuk-button-group"], ["type", "button", 1, "button", "button-primary", 3, "click"]], template: function SelectFlagTypeComponent_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵelementStart(0, "div", 0);
         i0.ɵɵelementStart(1, "div", 1);
         i0.ɵɵelementStart(2, "fieldset", 2);
@@ -16501,6 +16746,10 @@ SelectFlagTypeComponent.ɵcmp = i0.ɵɵdefineComponent({ type: SelectFlagTypeCom
             type: Input
         }], jurisdiction: [{
             type: Input
+        }], caseTypeId: [{
+            type: Input
+        }], hmctsServiceId: [{
+            type: Input
         }], caseFlagStateEmitter: [{
             type: Output
         }], flagCommentsOptionalEmitter: [{
@@ -18512,7 +18761,10 @@ DatetimePickerComponent.ɵcmp = i0.ɵɵdefineComponent({ type: DatetimePickerCom
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.inputElement = _t.first);
     } }, inputs: { dateControl: "dateControl" }, features: [i0.ɵɵProvidersFeature([
             { provide: NGX_MAT_DATE_FORMATS, useValue: CUSTOM_MOMENT_FORMATS },
-            { provide: NgxMatDateAdapter, useClass: NgxMatMomentAdapter },
+            { provide: NgxMatDateAdapter,
+                useClass: NgxMatMomentAdapter,
+                deps: [MAT_DATE_LOCALE, NGX_MAT_MOMENT_DATE_ADAPTER_OPTIONS]
+            },
             { provide: NGX_MAT_MOMENT_DATE_ADAPTER_OPTIONS, useValue: { useUtc: true } }
         ]), i0.ɵɵInheritDefinitionFeature], decls: 14, vars: 26, consts: [[1, "govuk-form-group", "bottom-30", 3, "id", "ngClass"], ["class", "form-label", 4, "ngIf"], ["class", "form-hint", 4, "ngIf"], ["class", "error-message", 4, "ngIf"], [1, "datepicker-container"], ["ng-model-options", "{timezone:'utc'}", 1, "govuk-input", 3, "min", "max", "formControl", "ngxMatDatetimePicker", "focusin", "focusout", "dateChange"], ["input", ""], ["matSuffix", "", "id", "pickerOpener", 3, "for"], [3, "color", "touchUi", "hideTime", "startView", "stepHour", "stepSecond", "stepMinute", "showSeconds", "showSpinners", "disableMinute", "enableMeridian", "yearSelected", "monthSelected", "opened"], ["picker", ""], [1, "form-label"], [1, "form-hint"], [1, "error-message"]], template: function DatetimePickerComponent_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵelementStart(0, "div", 0);
@@ -18565,7 +18817,10 @@ DatetimePickerComponent.ɵcmp = i0.ɵɵdefineComponent({ type: DatetimePickerCom
                 encapsulation: ViewEncapsulation.None,
                 providers: [
                     { provide: NGX_MAT_DATE_FORMATS, useValue: CUSTOM_MOMENT_FORMATS },
-                    { provide: NgxMatDateAdapter, useClass: NgxMatMomentAdapter },
+                    { provide: NgxMatDateAdapter,
+                        useClass: NgxMatMomentAdapter,
+                        deps: [MAT_DATE_LOCALE, NGX_MAT_MOMENT_DATE_ADAPTER_OPTIONS]
+                    },
                     { provide: NGX_MAT_MOMENT_DATE_ADAPTER_OPTIONS, useValue: { useUtc: true } }
                 ]
             }]
@@ -23938,11 +24193,12 @@ class CaseFullAccessViewComponent {
                 this.activitySubscription = this.postViewActivity().subscribe();
             });
         }
+        this.checkRouteAndSetCaseViewTab();
         // Check for active Case Flags
         this.activeCaseFlags = this.hasActiveCaseFlags();
     }
     ngOnChanges(changes) {
-        if (!changes.prependedTabs.firstChange) {
+        if (changes && changes.prependedTabs && !changes.prependedTabs.firstChange) {
             this.init();
             this.crf.detectChanges();
             this.organiseTabPosition();
@@ -23967,6 +24223,21 @@ class CaseFullAccessViewComponent {
             subscription.unsubscribe();
         }
     }
+    checkRouteAndSetCaseViewTab() {
+        this.router.events
+            .pipe(filter((event) => event instanceof NavigationEnd))
+            .subscribe((event) => {
+            const url = event && event.url;
+            if (url) {
+                const tabUrl = url ? url.split('#') : null;
+                const tab = tabUrl && tabUrl.length > 1 ? tabUrl[tabUrl.length - 1].replaceAll('%20', ' ') : '';
+                const matTab = this.tabGroup._tabs.find((x) => x.textLabel.toLowerCase() === tab.toLowerCase());
+                if (matTab && matTab.position) {
+                    this.tabGroup.selectedIndex = matTab.position;
+                }
+            }
+        });
+    }
     postViewActivity() {
         return this.activityPollingService.postViewActivity(this.caseDetails.case_id);
     }
@@ -27423,11 +27694,11 @@ function SearchResultComponent_table_0_th_9_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(2);
     i0.ɵɵproperty("checked", ctx_r6.allOnPageSelected())("disabled", !ctx_r6.canAnyBeShared());
 } }
-function SearchResultComponent_table_0_th_10_div_6_Template(rf, ctx) { if (rf & 1) {
+function SearchResultComponent_table_0_th_10_div_4_Template(rf, ctx) { if (rf & 1) {
     const _r19 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 27);
     i0.ɵɵelementStart(1, "a", 28);
-    i0.ɵɵlistener("click", function SearchResultComponent_table_0_th_10_div_6_Template_a_click_1_listener() { i0.ɵɵrestoreView(_r19); const col_r15 = i0.ɵɵnextContext().$implicit; const ctx_r17 = i0.ɵɵnextContext(2); return ctx_r17.sort(col_r15); });
+    i0.ɵɵlistener("click", function SearchResultComponent_table_0_th_10_div_4_Template_a_click_1_listener() { i0.ɵɵrestoreView(_r19); const col_r15 = i0.ɵɵnextContext().$implicit; const ctx_r17 = i0.ɵɵnextContext(2); return ctx_r17.sort(col_r15); });
     i0.ɵɵelementEnd();
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -27439,16 +27710,12 @@ function SearchResultComponent_table_0_th_10_div_6_Template(rf, ctx) { if (rf &
 function SearchResultComponent_table_0_th_10_Template(rf, ctx) { if (rf & 1) {
     const _r22 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "th");
-    i0.ɵɵelementStart(1, "table", 24);
-    i0.ɵɵelementStart(2, "tr");
-    i0.ɵɵelementStart(3, "th");
-    i0.ɵɵelementStart(4, "div", 25);
-    i0.ɵɵlistener("click", function SearchResultComponent_table_0_th_10_Template_div_click_4_listener() { i0.ɵɵrestoreView(_r22); const col_r15 = ctx.$implicit; const ctx_r21 = i0.ɵɵnextContext(2); return ctx_r21.sort(col_r15); });
-    i0.ɵɵtext(5);
-    i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(6, SearchResultComponent_table_0_th_10_div_6_Template, 2, 1, "div", 26);
-    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(1, "div", 24);
+    i0.ɵɵelementStart(2, "div", 25);
+    i0.ɵɵlistener("click", function SearchResultComponent_table_0_th_10_Template_div_click_2_listener() { i0.ɵɵrestoreView(_r22); const col_r15 = ctx.$implicit; const ctx_r21 = i0.ɵɵnextContext(2); return ctx_r21.sort(col_r15); });
+    i0.ɵɵtext(3);
     i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(4, SearchResultComponent_table_0_th_10_div_4_Template, 2, 1, "div", 26);
     i0.ɵɵelementEnd();
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -27456,7 +27723,7 @@ function SearchResultComponent_table_0_th_10_Template(rf, ctx) { if (rf & 1) {
     const ctx_r7 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(1);
     i0.ɵɵattribute("aria-label", "Sort by " + col_r15.label + " " + ctx_r7.isSortAscending(col_r15) ? "ascending" : "descending");
-    i0.ɵɵadvance(4);
+    i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate(col_r15.label);
     i0.ɵɵadvance(1);
     i0.ɵɵproperty("ngIf", ctx_r7.comparator(col_r15));
@@ -27728,7 +27995,7 @@ function SearchResultComponent_table_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(7, "thead");
     i0.ɵɵelementStart(8, "tr", 7);
     i0.ɵɵtemplate(9, SearchResultComponent_table_0_th_9_Template, 4, 2, "th", 8);
-    i0.ɵɵtemplate(10, SearchResultComponent_table_0_th_10_Template, 7, 3, "th", 9);
+    i0.ɵɵtemplate(10, SearchResultComponent_table_0_th_10_Template, 5, 3, "th", 9);
     i0.ɵɵtemplate(11, SearchResultComponent_table_0_th_11_Template, 1, 0, "th", 10);
     i0.ɵɵelementEnd();
     i0.ɵɵelementEnd();