feat(value): improve list value (DEV-951) (#757)

Author: kilchenmann

src/app/workspace/resource/values/list-value/list-value.component.html

@@ -1,8 +1,17 @@
 <span *ngIf="mode !== 'read' && listRootNode !== undefined">
-    <button class="md-button" mat-stroked-button [matMenuTriggerFor]="mainMenu" type="button" placeholder="List value">
-        <span *ngIf="!selectedNode">Select list value</span>
-        <span *ngIf="selectedNode">{{selectedNode.label}}</span>
-    </button>
+
+    <!-- button to select a list node -->
+    <span [matTooltip]="(!selectedNode && !listRootNode.children.length) ? 'This list doesn\'t have any node values' : 'Select list value'" [matTooltipPosition]="'above'">
+        <button mat-stroked-button [matMenuTriggerFor]="mainMenu" type="button" placeholder="List value" [disabled]="!selectedNode && !listRootNode.children.length">
+
+            <!-- if no node is selected: display list label; if the list does not have any list nodes, the button should be disabled -->
+            <span *ngIf="!selectedNode">{{listRootNode.label}}</span>
+
+            <!-- if a node is selected: display node label -->
+            <span *ngIf="selectedNode">{{selectedNode.label}}</span>
+
+        </button>
+    </span>
 
     <mat-menu #mainMenu="matMenu" [overlapTrigger]="false">
         <span *ngFor="let child of listRootNode.children">
@@ -22,6 +31,7 @@
             </span>
         </span>
     </mat-menu>
+
     <mat-error *ngIf="valueFormControl.hasError('valueNotChanged')  && valueFormControl.dirty">
         <span class="custom-error-message">New value must be different than the current value.</span>
     </mat-error>

src/app/workspace/resource/values/list-value/list-value.component.spec.ts

@@ -160,7 +160,7 @@ describe('ListValueComponent', () => {
 
             expect(valuesSpy.v2.list.getList).toHaveBeenCalledTimes(1);
             expect(valuesSpy.v2.list.getList).toHaveBeenCalledWith('http://rdfh.ch/lists/0001/treeList');
-            expect(testHostComponent.inputValueComponent.listRootNode.children.length).toEqual(1);
+            expect(testHostComponent.inputValueComponent.listRootNode.children.length).toEqual(0);
 
             const openListButtonDe = valueComponentDe.query(By.css('button'));
 

src/app/workspace/resource/values/list-value/list-value.component.ts

@@ -68,14 +68,12 @@ export class ListValueComponent extends BaseValueDirective implements OnInit, On
         }
         if (this.valueFormControl !== undefined) {
             if (this.mode !== 'read') {
-                this.listRootNode = new ListNodeV2();
                 const rootNodeIris = this.propertyDef.guiAttributes;
                 for (const rootNodeIri of rootNodeIris) {
-                    // get rid of the "hlist"
                     const trimmedRootNodeIRI = rootNodeIri.substr(7, rootNodeIri.length - (1 + 7));
                     this._dspApiConnection.v2.list.getList(trimmedRootNodeIRI).subscribe(
-                        (response2: ListNodeV2) => {
-                            this.listRootNode.children.push(response2);
+                        (response: ListNodeV2) => {
+                            this.listRootNode = response;
                         }, (error: ApiResponseError) => {
                             this._errorHandler.showMessage(error);
                         });
@@ -126,11 +124,8 @@ export class ListValueComponent extends BaseValueDirective implements OnInit, On
         }
 
         const newListValue = new CreateListValue();
-
-
         newListValue.listNode = this.valueFormControl.value;
 
-
         if (this.commentFormControl.value !== null && this.commentFormControl.value !== '') {
             newListValue.valueHasComment = this.commentFormControl.value;
         }