SHIBUI-970 Implemented fix for errors in arrays

TIER · Nov 14, 2018 · 1d1d0c2 · 1d1d0c2
1 parent 9b51a67
commit 1d1d0c2
Show file tree

Hide file tree

Showing 3 changed files with 43 additions and 2 deletions.
diff --git a/backend/src/main/resources/i18n/messages_en.properties b/backend/src/main/resources/i18n/messages_en.properties
@@ -345,6 +345,7 @@ message.must-be-unique=Must be unique.
 message.name-must-be-unique=Name must be unique.
 message.uri-valid-format=URI must be valid format.
 message.id-unique=ID must be unique.
+message.array-items-must-be-unique=Items in list must be unique.
 
 message.conflict=Conflict
 message.data-version-contention=Data Version Contention

diff --git a/ui/src/app/schema-form/widget/array/array.component.html b/ui/src/app/schema-form/widget/array/array.component.html
@@ -12,6 +12,12 @@
         <span class="text-right" *ngIf="schema.description">
             <info-icon [description]="schema.description | translate"></info-icon>
         </span>
+        <small class="form-text text-danger px-2" *ngIf="hasErrors">
+            <ng-container *ngFor="let error of errors$ | async; let first=first;">
+                <ng-container *ngIf="!first">, </ng-container>
+                <translate-i18n [key]="messages[error.code]">{{ error.message }}</translate-i18n>
+            </ng-container>
+        </small>
     </div>
     <ul class="mt-2"
         [ngClass]="{'bg-light border rounded p-3 list-group': getListType(formProperty) === 'object'}"

diff --git a/ui/src/app/schema-form/widget/array/array.component.ts b/ui/src/app/schema-form/widget/array/array.component.ts
@@ -1,12 +1,46 @@
-import { Component } from '@angular/core';
+import { Component, AfterViewInit, OnDestroy } from '@angular/core';
 
 import { ArrayWidget } from 'ngx-schema-form';
+import { map } from 'rxjs/operators';
+import { Observable, Subscription } from 'rxjs';
+
+export interface FormError {
+    code: string;
+    description: string;
+    message: string;
+    params: any[];
+    path: string;
+    schemaId: any;
+}
 
 @Component({
     selector: 'array-component',
     templateUrl: `./array.component.html`
 })
-export class CustomArrayComponent extends ArrayWidget {
+export class CustomArrayComponent extends ArrayWidget implements AfterViewInit, OnDestroy {
+    errors$: Observable<FormError[]>;
+    hasErrors: boolean;
+    hasErrorSub: Subscription;
+
+    messages = {
+        ARRAY_UNIQUE: 'message.array-items-must-be-unique'
+    };
+
+    ngAfterViewInit(): void {
+        this.errors$ = this.formProperty.errorsChanges.pipe(
+            map(errors => errors ? errors.reduce((coll, err) => {
+                coll[err.code] = err;
+                return coll;
+            }, {}) : {}),
+            map(collection => Object.values(collection))
+        );
+
+        this.hasErrorSub = this.errors$.subscribe(e => this.hasErrors = !!e.length);
+    }
+
+    ngOnDestroy(): void {
+        this.hasErrorSub.unsubscribe();
+    }
     getListType(property: any): string {
         return property.properties.length ? property.properties[0].type : null;
     }