support editing item metadata through code

Signed-off-by: Jimmy Tanagra <[email protected]>

Author: jimtng

bundles/org.openhab.ui/web/src/components/item/item-mixin.js

@@ -84,7 +84,7 @@ export default {
           value: unit,
           config: {}
         }
-        return this.saveMetaData(item, 'unit', metadata)
+        return this.saveMetadata(item, 'unit', metadata)
       } else {
         return Promise.resolve()
       }
@@ -98,13 +98,16 @@ export default {
             pattern: stateDescriptionPattern
           }
         }
-        return this.saveMetaData(item, 'stateDescription', metadata)
+        return this.saveMetadata(item, 'stateDescription', metadata)
       } else {
         return Promise.resolve()
       }
     },
-    saveMetaData (item, value, metadata) {
-      return this.$oh.api.put('/rest/items/' + item.name + '/metadata/' + value, metadata)
+    saveMetadata (item, namespace, metadata) {
+      return this.$oh.api.put('/rest/items/' + item.name + '/metadata/' + namespace, metadata)
+    },
+    deleteMetadata (item, namespace) {
+      return this.$oh.api.delete('/rest/items/' + item.name + '/metadata/' + namespace)
     }
   }
 }

bundles/org.openhab.ui/web/src/pages/settings/items/item-edit.vue

@@ -95,6 +95,7 @@ import ItemForm from '@/components/item/item-form.vue'
 
 import DirtyMixin from '../dirty-mixin'
 import ItemMixin from '@/components/item/item-mixin'
+import { name } from 'jssip'
 
 export default {
   mixins: [DirtyMixin, ItemMixin],
@@ -285,7 +286,9 @@ export default {
           }).open()
         }
 
-        this.itemDirty = this.codeDirty = false
+        this.doSaveMetadata()
+
+        this.dirty = this.itemDirty = this.codeDirty = false
         if (this.createMode) {
           this.f7router.navigate('/settings/items/' + this.item.name)
         } else {
@@ -299,6 +302,49 @@ export default {
         }).open()
       })
     },
+    doSaveMetadata () {
+      console.log('Saving metadata...')
+      const newNamespaces = new Set(Object.keys(this.item.metadata || {}))
+
+      // remove deleted metadata
+      const deletionPromises = Object.entries(this.savedItem.metadata || {})
+        .filter(([namespace, savedMetadata]) => savedMetadata.editable && !newNamespaces.has(namespace))
+        .map(([namespace, _]) => this.deleteMetadata(this.item, namespace))
+
+      // create/update new/changed metadata
+      const updatePromises = Object.entries(this.item.metadata || {})
+        .filter(([namespace, metadata]) => {
+          const savedMetadata = this.savedItem.metadata?.[namespace] || {}
+          if (savedMetadata.editable === false) return false // don't touch non-editable metadata
+
+          // remove editable flag from comparison, because the generated code doesn't have it
+          delete savedMetadata.editable
+
+          metadata = metadata || {}
+          const newMetadata = { ...metadata }
+          // the editable flag may exist in the original loaded item (not from generated code)
+          delete newMetadata.editable
+
+          return !fastDeepEqual(newMetadata, savedMetadata)
+        })
+        .map(([namespace, metadata]) => {
+          return this.saveMetadata(this.item, namespace, metadata)
+        })
+
+      Promise.all([...deletionPromises, ...updatePromises]).then(() => {
+        f7.toast.create({
+          text: 'Metadata updated successfully',
+          destroyOnClose: true,
+          closeTimeout: 2000
+        }).open()
+      }).catch((err) => {
+        f7.toast.create({
+          text: 'Error while saving metadata: ' + err,
+          destroyOnClose: true,
+          closeTimeout: 2000
+        }).open()
+      })
+    },
     updateItem (updatedItem) {
       if (!this.editable) return false
       try {
@@ -312,7 +358,7 @@ export default {
         this.item.groupType = updatedItem.groupType
         this.item.function = updatedItem.function
         this.item.tags = updatedItem.tags
-        // this.item.metadata = updatedItem.metadata
+        this.item.metadata = updatedItem.metadata
         return true
       } catch (e) {
         f7.dialog.alert(e).open()

bundles/org.openhab.ui/web/src/pages/settings/items/metadata/item-metadata-edit.vue

@@ -95,9 +95,10 @@ import ItemMetadataMatter from '@/components/item/metadata/item-metadata-matter.
 import ItemMetadataGa from '@/components/item/metadata/item-metadata-ga.vue'
 import ItemMetadataLinktomore from '@/components/item/metadata/item-metadata-linktomore.vue'
 import DirtyMixin from '../../dirty-mixin'
+import ItemMixin from '@/components/item/item-mixin.js'
 
 export default {
-  mixins: [DirtyMixin],
+  mixins: [DirtyMixin, ItemMixin],
   props: {
     itemName: String,
     namespace: String,
@@ -210,7 +211,7 @@ export default {
 
       if (this.currentTab === 'code' && !this.fromYaml()) return
       if (!this.metadata.value) this.metadata.value = ' '
-      this.$oh.api.put(`/rest/items/${this.itemName}/metadata/${this.namespace}`, this.metadata).then((data) => {
+      this.saveMetadata(this.item, this.namespace, this.metadata).then((data) => {
         if (this.creationMode) {
           f7.toast.create({
             text: 'Metadata created',
@@ -241,7 +242,7 @@ export default {
         `Are you sure you want to remove all metadata for "${nslabel}"?`,
         'Remove metadata',
         () => {
-          this.$oh.api.delete(`/rest/items/${this.itemName}/metadata/${this.namespace}`).then(() => {
+          this.deleteMetadata(this.item, this.namespace).then(() => {
             f7.toast.create({
               text: 'Metadata deleted',
               destroyOnClose: true,