Fix localized field rules. (#987)

frontend/src/app/shared/components/notifo.component.scss

@@ -1,6 +1,8 @@
 @import 'mixins';
 @import 'vars';
 
+$nav-link-text: rgba(0, 0, 0, 55%);
+
 :host ::ng-deep {
     .notifo {
         .notifo-notifications-button {
@@ -9,7 +11,7 @@
             margin-top: .125rem;
 
             svg {
-                fill: $color-text;
+                fill: $nav-link-text;
             }
         }
 

frontend/src/app/shared/components/notifo.component.ts

@@ -55,7 +55,11 @@ export class NotifoComponent implements AfterViewInit, OnDestroy {
             if (!notifo) {
                 notifo = [];
 
-                const options: any = { apiUrl: this.notifoApiUrl, userToken: this.notifoApiKey };
+                const options: any = {
+                    apiUrl: this.notifoApiUrl,
+                    userKey: null,
+                    userToken: this.notifoApiKey,
+                };
 
                 if (this.notifoApiUrl.includes('localhost:5002')) {
                     options.styleUrl = 'https://localhost:3002/notifo-sdk.css';
@@ -70,9 +74,9 @@ export class NotifoComponent implements AfterViewInit, OnDestroy {
             const element = this.element?.nativeElement;
 
             if (!this.topic) {
-                notifo.push(['show-notifications', element, { position: 'bottom-right' }]);
+                notifo.push(['show-notifications', element, { position: 'bottom-right', style: 'notifo' }]);
             } else {
-                notifo.push(['show-topic', element, this.topic, { style: 'bell', position: 'bottom-right' }]);
+                notifo.push(['show-topic', element, this.topic, { position: 'bottom-right', style: 'bell' }]);
             }
 
             if (element) {

frontend/src/app/shared/components/schema-category.component.html

@@ -47,7 +47,7 @@
                         titlePosition="top-left">
                         <i cdkDragHandle class="icon-drag2 drag-handle"></i>
 
-                        <span class="item-published me-1" [class.unpublished]="!schema.isPublished" id="schema_{{schema.name}}"></span> {{schema.displayName}}
+                        <span class="item-published me-1" [class.unpublished]="!schema.isPublished" id="schema_{{schema.name}}"></span> {{schema.displayName}} <span class="singleton" *ngIf="schema.type === 'Singleton'">Singleton</span>
                     </a>
                 </li>
             </ng-container>

frontend/src/app/shared/components/schema-category.component.scss

@@ -107,4 +107,10 @@ $drag-margin: -8px;
             margin-top: 0;
         }
     }
+}
+
+.singleton {
+    font-weight: normal;
+    font-size: inherit;
+    opacity: .8;
 }

frontend/src/app/shared/state/contents.form-rules.ts

@@ -68,7 +68,7 @@ class ComponentRules implements ComponentRules {
 
         if (schema !== this.previouSchema) {
             if (schema) {
-                this.compiledRules = Types.fastMerge(this.parent.getRules(this.form).rules, this.getRelativeRules(this.form, schema));
+                this.compiledRules = Types.fastMerge(this.parentRules.getRules(this.form).rules, this.getRelativeRules(this.form, schema));
             } else {
                 this.compiledRules = EMPTY_RULES;
             }
@@ -80,39 +80,39 @@ class ComponentRules implements ComponentRules {
     constructor(
         private readonly form: RuleForm,
         private readonly parentPath: string,
-        private readonly parent: RulesProvider,
+        private readonly parentRules: RulesProvider,
         private readonly schema: () => SchemaDto | undefined,
     ) {
     }
 
     private getRelativeRules(form: RuleForm, schema: SchemaDto) {
-        const rules = this.parent.compileRules(schema);
+        const rules = this.parentRules.compileRules(schema);
 
         if (rules.length === 0) {
             return EMPTY_RULES;
         }
 
         const pathField = form.fieldPath.substring(this.parentPath.length + 1);
-        const pathSimplified = pathField.replace('.iv.', '.');
+        const pathSimple = getSimplePath(pathField);
 
-        return rules.filter(x => x.field === pathField || x.field === pathSimplified);
+        return rules.filter(x => x.field === pathField || x.field === pathSimple);
     }
 }
 
 export class ComponentRulesProvider implements RulesProvider {
     constructor(
         private readonly parentPath: string,
-        private readonly parent: RulesProvider,
+        private readonly parentRules: RulesProvider,
         private readonly schema: () => SchemaDto | undefined,
     ) {
     }
 
     public compileRules(schema: SchemaDto) {
-        return this.parent.compileRules(schema);
+        return this.parentRules.compileRules(schema);
     }
 
     public getRules(form: RuleForm) {
-        return new ComponentRules(form, this.parentPath, this.parent, this.schema);
+        return new ComponentRules(form, this.parentPath, this.parentRules, this.schema);
     }
 }
 
@@ -148,10 +148,20 @@ export class RootRulesProvider implements RulesProvider {
         }
 
         const pathField = form.fieldPath;
-        const pathSimplified = pathField.replace('.iv.', '.');
+        const pathSimple = getSimplePath(pathField);
 
-        const rules = allRules.filter(x => x.field === pathField || x.field === pathSimplified);
+        const rules = allRules.filter(x => x.field === pathField || x.field === pathSimple);
 
         return { rules };
     }
 }
+
+function getSimplePath(path: string) {
+    const parts = path.split('.');
+
+    if (parts.length >= 2) {
+        parts.splice(1, 1);
+    }
+
+    return parts.join('.');
+}

frontend/src/app/shared/state/contents.forms.spec.ts

@@ -612,6 +612,39 @@ describe('ContentForm', () => {
             expect(array.get(1)!.get('nested42')!.hidden).toBeFalsy();
         });
 
+        it('should hide nested localized fields based on condition', () => {
+            const contentForm = createForm([
+                createField({
+                    id: 4,
+                    properties: createProperties('Array'),
+                    partitioning: 'language',
+                    nested: [
+                        createNestedField({ id: 41, properties: createProperties('Number') }),
+                        createNestedField({ id: 42, properties: createProperties('Number') }),
+                    ],
+                }),
+            ], [{
+                field: 'field4.nested42', action: 'Hide', condition: 'itemData.nested41 > 100',
+            }]);
+
+            const array = contentForm.get(complexSchema.fields[3])!.get(languages[0]) as FieldArrayForm;
+
+            contentForm.load({
+                field4: {
+                    en: [{
+                        nested41: 120,
+                        nested42: 120,
+                    }, {
+                        nested41: 99,
+                        nested42: 99,
+                    }],
+                },
+            });
+
+            expect(array.get(0)!.get('nested42')!.hidden).toBeTruthy();
+            expect(array.get(1)!.get('nested42')!.hidden).toBeFalsy();
+        });
+
         it('should hide components fields based on condition', () => {
             const componentId = MathHelper.guid();
             const component = createSchema({