From 9d1a63abfdab8a833b9571fbc285989f63bd7ad6 Mon Sep 17 00:00:00 2001
From: Jan Slifka <jan.slifka@gmail.com>
Date: Mon, 4 Sep 2023 11:17:52 +0200
Subject: [PATCH] Add resolving labels to enum select editor

---
 .../ShaclForm/Editor/EnumSelectEditor.vue     | 44 +++++++++++++++----
 1 file changed, 35 insertions(+), 9 deletions(-)

diff --git a/src/components/ShaclForm/Editor/EnumSelectEditor.vue b/src/components/ShaclForm/Editor/EnumSelectEditor.vue
index 1d2c03f..ec05204 100644
--- a/src/components/ShaclForm/Editor/EnumSelectEditor.vue
+++ b/src/components/ShaclForm/Editor/EnumSelectEditor.vue
@@ -3,16 +3,17 @@
     class="input-field"
     :value="toInputValue(value)"
     @input="onInput"
+    :key="resolvedCounter"
   >
     <option :value="null">
       - select -
     </option>
     <option
-      v-for="option in createOptions()"
-      :key="option.key"
-      :value="option.key"
+      v-for="key in keys"
+      :key="key"
+      :value="key"
     >
-      {{ option.value }}
+      {{ values[key] }}
     </option>
   </select>
 </template>
@@ -21,6 +22,8 @@ import * as $rdf from 'rdflib'
 import _ from 'lodash'
 import { Component, Prop, Vue } from 'vue-property-decorator'
 import rdfUtils from '@/rdf/utils'
+import api from '@/api'
+import { SHACL } from '@/rdf/namespaces'
 
 @Component({})
 export default class EnumSelectEditor extends Vue {
@@ -30,11 +33,34 @@ export default class EnumSelectEditor extends Vue {
   @Prop({ required: true })
   readonly value: any
 
-  createOptions() {
-    return _.get(this.field, 'in', []).map((val) => ({
-      key: val,
-      value: rdfUtils.pathTerm(val),
-    }))
+  keys : any
+
+  values : any
+
+  resolvedCounter : number = 0
+
+  created(): void {
+    this.keys = []
+    this.values = {}
+
+    _.get(this.field, 'in', []).forEach((key) => {
+      this.keys.push(key)
+      this.values[key] = rdfUtils.pathTerm(key)
+
+      if (this.field.nodeKind === SHACL('IRI').value) {
+        this.resolveValue(key)
+      }
+    })
+  }
+
+  async resolveValue(key: string): Promise<void> {
+    try {
+      const label = await api.label.getLabel(key)
+      this.values[key] = label.data.label
+      this.resolvedCounter += 1
+    } catch {
+      // nothing could be fetched, keep default label
+    }
   }
 
   onInput(e) {