From b2de991c86e2035eb75ecebb84c96de405e1a3fc Mon Sep 17 00:00:00 2001
From: Mark Herwege <mark.herwege@telenet.be>
Date: Fri, 1 Mar 2024 11:06:35 +0100
Subject: [PATCH 01/24] unit-hint on item creation

Signed-off-by: Mark Herwege <mark.herwege@telenet.be>
---
 .../org.openhab.ui/web/src/components/item/item-form.vue | 8 +++++---
 .../web/src/pages/settings/things/link/link-add.vue      | 9 +++++++++
 2 files changed, 14 insertions(+), 3 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/components/item/item-form.vue b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
index a1fc5d6d0a..e10beb3000 100644
--- a/bundles/org.openhab.ui/web/src/components/item/item-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
@@ -98,7 +98,7 @@ import uomMixin from '@/components/item/uom-mixin'
 
 export default {
   mixins: [ItemMixin, uomMixin],
-  props: ['item', 'items', 'createMode', 'hideCategory', 'hideType', 'hideSemantics', 'forceSemantics'],
+  props: ['item', 'items', 'createMode', 'hideCategory', 'hideType', 'hideSemantics', 'forceSemantics', 'unitHint'],
   components: {
     SemanticsPicker,
     ItemPicker,
@@ -144,8 +144,10 @@ export default {
       }
       const dimension = this.dimensions.find((d) => d.name === newDimension)
       this.$set(this.item, 'type', 'Number:' + dimension.name)
-      this.$set(this.item, 'unit', dimension.systemUnit)
-      this.$set(this.item, 'stateDescriptionPattern', `%.0f ${dimension.systemUnit}`)
+      if (!this.item.unit) {
+        this.$set(this.item, 'unit', dimension.systemUnit)
+      }
+      this.$set(this.item, 'stateDescriptionPattern', '%.0f %unit%')
     },
     initializeAutocomplete (inputElement) {
       this.categoryAutocomplete = this.$f7.autocomplete.create({
diff --git a/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue b/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue
index 664ba9f1e7..8df86a2314 100644
--- a/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue
+++ b/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue
@@ -153,6 +153,7 @@ export default {
         channelUID: null,
         configuration: {}
       },
+      measurementSystem: 'SI',
       selectedItemName: null,
       selectedThingId: '',
       selectedThing: {},
@@ -172,6 +173,9 @@ export default {
       this.$oh.api.get('/rest/items').then((items) => {
         this.items = items
       })
+      this.$oh.api.get('/').then((root) => {
+        this.measurementSystem = root.measurementSystem
+      })
     }
   },
   computed: {
@@ -181,6 +185,10 @@ export default {
     compatibleProfileTypes () {
       let currentItemType = this.currentItem && this.currentItem.type ? this.currentItem.type : ''
       return this.profileTypes.filter(p => !p.supportedItemTypes.length || p.supportedItemTypes.includes(currentItemType.split(':', 1)[0]))
+    },
+    unit () {
+      let units = (this.channelType ? this.channelType.unitHint : '').split(',')
+      return (this.measurementSystem === 'US' && units.length > 1) ? units[1].trim() : units[0].trim
     }
   },
   methods: {
@@ -197,6 +205,7 @@ export default {
         category: (this.channelType) ? this.channelType.category : '',
         groupNames: [],
         type: this.channel.itemType || 'Switch',
+        unit: this.unit,
         tags: (defaultTags.find((t) => this.$store.getters.semanticClasses.Points.indexOf(t) >= 0)) ? defaultTags : [...defaultTags, 'Point']
       })
     },

From 226e3055feec481456986e4cabf2cd8e3c45989d Mon Sep 17 00:00:00 2001
From: Mark Herwege <mark.herwege@telenet.be>
Date: Fri, 1 Mar 2024 11:06:35 +0100
Subject: [PATCH 02/24] from thing to model

Signed-off-by: Mark Herwege <mark.herwege@telenet.be>
---
 .../web/src/components/item/uom-mixin.js          | 10 ++++++++++
 .../web/src/components/thing/channel-list.vue     |  5 +++++
 .../src/pages/settings/things/link/link-add.vue   | 15 +++++----------
 3 files changed, 20 insertions(+), 10 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js b/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
index b7a6d515cf..13801e2559 100644
--- a/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
+++ b/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
@@ -1,10 +1,14 @@
 export default {
   data () {
     return {
+      measurementSystem: 'SI',
       dimensions: []
     }
   },
   created () {
+    this.$oh.api.get('/').then((root) => {
+      this.measurementSystem = root.measurementSystem
+    }),
     this.$oh.api.get('/rest/systeminfo/uom').then((data) => {
       data.uomInfo.dimensions.forEach((d) => {
         this.dimensions.push({
@@ -14,5 +18,11 @@ export default {
         })
       })
     })
+  },
+  methods: {
+    getUnitHint (channelType) {
+      let units = ((channelType && channelType.unitHint) ? channelType.unitHint : '').split(',')
+      return (this.measurementSystem === 'US' && units.length > 1) ? units[1].trim() : units[0].trim()
+    }
   }
 }
diff --git a/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue b/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue
index 05d0d42613..93b051c70c 100644
--- a/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue
+++ b/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue
@@ -93,7 +93,10 @@ import ChannelGroup from './channel-group.vue'
 import ChannelLink from './channel-link.vue'
 import ItemForm from '@/components/item/item-form.vue'
 
+import uomMixin from '@/components/item/uom-mixin'
+
 export default {
+  mixins: [uomMixin],
   props: ['thingType', 'thing', 'channelTypes', 'items', 'pickerMode', 'multipleLinksMode', 'itemTypeFilter', 'newItemsPrefix', 'newItems', 'context'],
   components: {
     ChannelGroup,
@@ -189,6 +192,7 @@ export default {
         }
         newItemName += this.$oh.utils.normalizeLabel(suffix)
         const defaultTags = (channel.defaultTags.length > 0) ? channel.defaultTags : channelType.tags
+        const unit = this.getUnitHint(channelType);
         const newItem = {
           channel: channel,
           channelType: channelType,
@@ -196,6 +200,7 @@ export default {
           label: channel.label || channelType.label,
           category: (channelType) ? channelType.category : '',
           type: channel.itemType,
+          unit: unit,
           tags: (defaultTags.find((t) => this.$store.getters.semanticClasses.Points.indexOf(t) >= 0)) ? defaultTags : [...defaultTags, 'Point']
         }
         this.newItems.push(newItem)
diff --git a/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue b/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue
index 8df86a2314..3c887d71e6 100644
--- a/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue
+++ b/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue
@@ -132,8 +132,10 @@ import Item from '@/components/item/item.vue'
 import * as Types from '@/assets/item-types.js'
 import ItemMixin from '@/components/item/item-mixin'
 
+import uomMixin from '@/components/item/uom-mixin'
+
 export default {
-  mixins: [ItemMixin],
+  mixins: [ItemMixin, uomMixin],
   components: {
     ConfigSheet,
     ItemPicker,
@@ -153,7 +155,6 @@ export default {
         channelUID: null,
         configuration: {}
       },
-      measurementSystem: 'SI',
       selectedItemName: null,
       selectedThingId: '',
       selectedThing: {},
@@ -173,9 +174,6 @@ export default {
       this.$oh.api.get('/rest/items').then((items) => {
         this.items = items
       })
-      this.$oh.api.get('/').then((root) => {
-        this.measurementSystem = root.measurementSystem
-      })
     }
   },
   computed: {
@@ -186,10 +184,6 @@ export default {
       let currentItemType = this.currentItem && this.currentItem.type ? this.currentItem.type : ''
       return this.profileTypes.filter(p => !p.supportedItemTypes.length || p.supportedItemTypes.includes(currentItemType.split(':', 1)[0]))
     },
-    unit () {
-      let units = (this.channelType ? this.channelType.unitHint : '').split(',')
-      return (this.measurementSystem === 'US' && units.length > 1) ? units[1].trim() : units[0].trim
-    }
   },
   methods: {
     onPageAfterIn (event) {
@@ -199,13 +193,14 @@ export default {
       newItemName += '_'
       newItemName += this.$oh.utils.normalizeLabel(this.channel.label || this.channelType.label)
       const defaultTags = (this.channel.defaultTags.length > 0) ? this.channel.defaultTags : this.channelType.tags
+      const unit = this.getUnitHint(this.channelType)
       this.$set(this, 'newItem', {
         name: newItemName,
         label: this.channel.label || this.channelType.label,
         category: (this.channelType) ? this.channelType.category : '',
         groupNames: [],
         type: this.channel.itemType || 'Switch',
-        unit: this.unit,
+        unit: unit,
         tags: (defaultTags.find((t) => this.$store.getters.semanticClasses.Points.indexOf(t) >= 0)) ? defaultTags : [...defaultTags, 'Point']
       })
     },

From 1431b68bed9c1a224834c0167d6979f8128f64e8 Mon Sep 17 00:00:00 2001
From: Mark Herwege <mark.herwege@telenet.be>
Date: Fri, 1 Mar 2024 11:06:36 +0100
Subject: [PATCH 03/24] fixes

Signed-off-by: Mark Herwege <mark.herwege@telenet.be>
---
 bundles/org.openhab.ui/web/src/components/item/item-mixin.js    | 2 +-
 bundles/org.openhab.ui/web/src/components/item/uom-mixin.js     | 2 +-
 .../org.openhab.ui/web/src/components/thing/channel-list.vue    | 2 +-
 .../web/src/pages/settings/things/link/link-add.vue             | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/components/item/item-mixin.js b/bundles/org.openhab.ui/web/src/components/item/item-mixin.js
index 12283832ef..3e860c153f 100644
--- a/bundles/org.openhab.ui/web/src/components/item/item-mixin.js
+++ b/bundles/org.openhab.ui/web/src/components/item/item-mixin.js
@@ -73,7 +73,7 @@ export default {
       }).then(() => {
         // Save state description if Item is an UoM Item and if state description changed from the default value
         if (this.createMode && (item.type.startsWith('Number:') || item.groupType?.startsWith('Number:')) && stateDescriptionPattern) {
-          if (stateDescriptionPattern !== `%.0f ${unit}`) {
+          if (stateDescriptionPattern !== '%.0f %unit%') {
             const metadata = {
               value: ' ',
               config: {
diff --git a/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js b/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
index 13801e2559..c761a4a2dc 100644
--- a/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
+++ b/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
@@ -8,7 +8,7 @@ export default {
   created () {
     this.$oh.api.get('/').then((root) => {
       this.measurementSystem = root.measurementSystem
-    }),
+    })
     this.$oh.api.get('/rest/systeminfo/uom').then((data) => {
       data.uomInfo.dimensions.forEach((d) => {
         this.dimensions.push({
diff --git a/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue b/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue
index 93b051c70c..6ac08ec238 100644
--- a/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue
+++ b/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue
@@ -192,7 +192,7 @@ export default {
         }
         newItemName += this.$oh.utils.normalizeLabel(suffix)
         const defaultTags = (channel.defaultTags.length > 0) ? channel.defaultTags : channelType.tags
-        const unit = this.getUnitHint(channelType);
+        const unit = this.getUnitHint(channelType)
         const newItem = {
           channel: channel,
           channelType: channelType,
diff --git a/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue b/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue
index 3c887d71e6..6208d09195 100644
--- a/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue
+++ b/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue
@@ -183,7 +183,7 @@ export default {
     compatibleProfileTypes () {
       let currentItemType = this.currentItem && this.currentItem.type ? this.currentItem.type : ''
       return this.profileTypes.filter(p => !p.supportedItemTypes.length || p.supportedItemTypes.includes(currentItemType.split(':', 1)[0]))
-    },
+    }
   },
   methods: {
     onPageAfterIn (event) {

From a9ab3547bc23b08b7fe0359a17e1fa6fc55e1401 Mon Sep 17 00:00:00 2001
From: Mark Herwege <mark.herwege@telenet.be>
Date: Fri, 1 Mar 2024 11:06:36 +0100
Subject: [PATCH 04/24] groups

Signed-off-by: Mark Herwege <mark.herwege@telenet.be>
---
 .../web/src/components/item/group-form.vue    | 38 ++++++++++++++++++-
 1 file changed, 37 insertions(+), 1 deletion(-)

diff --git a/bundles/org.openhab.ui/web/src/components/item/group-form.vue b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
index 1d14d4be22..131568c4c2 100644
--- a/bundles/org.openhab.ui/web/src/components/item/group-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
@@ -146,7 +146,43 @@ export default {
         this.item.functionKey += '_' + this.item.function.params.join('_')
       }
     } else {
-      this.$set(this.item, 'functionKey', '')
+      this.$set(this.item, 'functionKey', 'None')
+    }
+  },
+  methods: {
+    setGroupType (type) {
+      this.$set(this.item, 'groupType', '')
+      this.$set(this.item, 'functionKey', 'None')
+      this.$nextTick(() => {
+        if (type !== 'None') this.$set(this.item, 'groupType', type)
+      })
+    },
+    setDimension (index) {
+      if (index === 'Number') {
+        this.setGroupType('Number')
+        return
+      }
+      const dimension = this.dimensions[index]
+      this.setGroupType('Number:' + dimension.name)
+      if (!this.item.unit) {
+        this.$set(this.item, 'unit', dimension.systemUnit)
+      }
+      this.$set(this.item, 'stateDescriptionPattern', '%.0f %unit%')
+    },
+    setFunction (key) {
+      if (!key) {
+        delete this.item.function
+        return
+      }
+      this.$set(this.item, 'functionKey', key)
+      const splitted = key.split('_')
+      let func = {
+        name: splitted[0]
+      }
+      if (splitted.length > 1) {
+        func.params = [splitted[1], splitted[2]]
+      }
+      this.$set(this.item, 'function', func)
     }
   }
 }

From 4ca80025c77dff5809a81b2421ad2cf04bad5b28 Mon Sep 17 00:00:00 2001
From: Mark Herwege <mark.herwege@telenet.be>
Date: Fri, 1 Mar 2024 11:06:36 +0100
Subject: [PATCH 05/24] curated unit list

Signed-off-by: Mark Herwege <mark.herwege@telenet.be>
---
 .../org.openhab.ui/web/src/assets/units.js    |  9 ++++
 .../web/src/components/item/group-form.vue    | 36 ++++++++++++--
 .../web/src/components/item/item-form.vue     | 48 +++++++++++++++----
 .../web/src/components/item/uom-mixin.js      | 46 ++++++++++++++++--
 .../web/src/components/thing/channel-list.vue | 11 +++--
 .../pages/settings/things/link/link-add.vue   |  9 ++--
 6 files changed, 132 insertions(+), 27 deletions(-)
 create mode 100644 bundles/org.openhab.ui/web/src/assets/units.js

diff --git a/bundles/org.openhab.ui/web/src/assets/units.js b/bundles/org.openhab.ui/web/src/assets/units.js
new file mode 100644
index 0000000000..c5ece33399
--- /dev/null
+++ b/bundles/org.openhab.ui/web/src/assets/units.js
@@ -0,0 +1,9 @@
+export const Units = [{
+    dimension: 'Dimensionless',
+    units: ['one', '%', 'dB', 'ppm'],
+    default: '%'
+} , {
+    dimension: 'Length',
+    unitsSI: ['mm', 'cm', 'dm', 'm', 'km'],
+    unitsUS: ['in', 'ft', 'mi']
+}]
\ No newline at end of file
diff --git a/bundles/org.openhab.ui/web/src/components/item/group-form.vue b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
index 131568c4c2..6e51910c44 100644
--- a/bundles/org.openhab.ui/web/src/components/item/group-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
@@ -21,16 +21,17 @@
     <template v-if="createMode && groupType && groupDimension">
       <f7-list-input label="Unit"
                      type="text"
-                     info="Used internally, for persistence and external systems. It is independent from the state visualization in the UI, which is defined through the state description."
+                     :info="(createMode) ? 'Used internally, for persistence and external systems. It is independent from the state visualization in the UI, which is defined through the state description.' : ''"
                      :value="item.unit"
-                     @input="item.unit = $event.target.value" clear-button />
+                     @input="item.unit = $event.target.value" :clear-button="editable" />
       <f7-list-input label="State Description Pattern"
                      type="text"
-                     info="Pattern or transformation applied to the state for display purposes. Only saved if you change the pre-filled default value."
+                     :info="(createMode) ? 'Pattern or transformation applied to the state for display purposes. Only saved if you change the pre-filled default value.' : ''"
                      :value="item.stateDescriptionPattern"
-                     @input="item.stateDescriptionPattern = $event.target.value" clear-button />
+                     @input="item.stateDescriptionPattern = $event.target.value" :clear-button:="editable" />
     </template>
     <!-- Aggregation Functions -->
+
     <f7-list-item v-if="aggregationFunctions" :disabled="!editable" title="Aggregation Function" class="align-popup-list-item" smart-select :smart-select-params="{openIn: 'popup', closeOnSelect: true}">
       <select name="select-function" @change="groupFunctionKey = $event.target.value">
         <option v-for="type in aggregationFunctions" :key="type.name" :value="type.name" :selected="type.name === groupFunctionKey">
@@ -165,10 +166,35 @@ export default {
       const dimension = this.dimensions[index]
       this.setGroupType('Number:' + dimension.name)
       if (!this.item.unit) {
-        this.$set(this.item, 'unit', dimension.systemUnit)
+        this.$set(this.item, 'unit', this.getUnitHint(dimension.name))
+      }
+      const unitControl = this.$refs.unit
+      if (unitControl && unitControl.$el) {
+        const inputElement = this.$$(unitControl.$el).find('input')
+        this.initializeAutocompleteUnit(inputElement)
       }
       this.$set(this.item, 'stateDescriptionPattern', '%.0f %unit%')
     },
+    initializeAutocompleteUnit (inputElement, dimension) {
+      if (this.unitAutocomplete) {
+        this.$f7.autocomplete.destroy(this.unitAutocomplete)
+      }
+      // item.unit can be set to unitHint from channel type, make sure it is at beginning of list
+      let units = this.getUnitList(dimension)
+      const index = units.indexOf(this.item.unit)
+      if (index >= 0) {
+        units.splice(index, 1)
+      }
+      units = [this.item.unit].concat(units)
+      this.unitAutocomplete = this.$f7.autocomplete.create({
+        inputEl: inputElement,
+        openIn: 'dropdown',
+        source (query, render) {
+          // Always render full list
+          render(units)
+        }
+      })
+    },
     setFunction (key) {
       if (!key) {
         delete this.item.function
diff --git a/bundles/org.openhab.ui/web/src/components/item/item-form.vue b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
index e10beb3000..5f4724b8bf 100644
--- a/bundles/org.openhab.ui/web/src/components/item/item-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
@@ -29,18 +29,18 @@
         </f7-list-item>
         <!-- (Internal) Unit & State Description -->
         <!-- Use v-show instead of v-if, because otherwise the autocomplete for category would take over the unit -->
-        <f7-list-input v-show="itemDimension && createMode"
+        <f7-list-input v-show="itemDimension"
                        label="Unit"
                        type="text"
-                       info="Used internally, for persistence and external systems. It is independent from the state visualization in the UI, which is defined through the state description."
+                       :info="(createMode) ? 'Used internally, for persistence and external systems. It is independent from the state visualization in the UI, which is defined through the state description.' : ''"
                        :disabled="!editable"
                        :value="item.unit"
                        @input="item.unit = $event.target.value"
                        :clear-button="editable" />
-        <f7-list-input v-show="itemDimension && createMode"
+        <f7-list-input v-show="itemDimension"
                        label="State Description Pattern"
                        type="text"
-                       info="Pattern or transformation applied to the state for display purposes. Only saved if you change the pre-filled default value."
+                       :info="(createMode) ? 'Pattern or transformation applied to the state for display purposes. Only saved if you change the pre-filled default value.' : ''"
                        :disabled="!editable"
                        :value="item.stateDescriptionPattern"
                        @input="item.stateDescriptionPattern = $event.target.value"
@@ -108,6 +108,7 @@ export default {
   data () {
     return {
       types,
+      unitAutocomplete: null,
       categoryInputId: '',
       categoryAutocomplete: null,
       nameErrorMessage: ''
@@ -144,12 +145,35 @@ export default {
       }
       const dimension = this.dimensions.find((d) => d.name === newDimension)
       this.$set(this.item, 'type', 'Number:' + dimension.name)
-      if (!this.item.unit) {
-        this.$set(this.item, 'unit', dimension.systemUnit)
+      this.$set(this.item, 'unit', this.unitHint ? this.unitHint : this.getUnitHint(dimension.name))
+      const unitControl = this.$refs.unit
+      if (unitControl && unitControl.$el) {
+        const inputElement = this.$$(unitControl.$el).find('input')
+        this.initializeAutocompleteUnit(inputElement, dimension)
       }
       this.$set(this.item, 'stateDescriptionPattern', '%.0f %unit%')
     },
-    initializeAutocomplete (inputElement) {
+    initializeAutocompleteUnit (inputElement, dimension) {
+      if (this.unitAutocomplete) {
+        this.$f7.autocomplete.destroy(this.unitAutocomplete)
+      }
+      // item.unit can be set to unitHint from channel type, make sure it is at beginning of list
+      let units = this.getUnitList(dimension.name)
+      const index = units.indexOf(this.item.unit)
+      if (index >= 0) {
+        units.splice(index, 1)
+      }
+      units = [this.item.unit].concat(units)
+      this.unitAutocomplete = this.$f7.autocomplete.create({
+        inputEl: inputElement,
+        openIn: 'dropdown',
+        source (query, render) {
+          // Always render full list
+          render(units)
+        }
+      })
+    },
+    initializeAutocompleteCategory (inputElement) {
       this.categoryAutocomplete = this.$f7.autocomplete.create({
         inputEl: inputElement,
         openIn: 'dropdown',
@@ -177,11 +201,15 @@ export default {
   mounted () {
     if (!this.item) return
     const categoryControl = this.$refs.category
-    if (!categoryControl || !categoryControl.$el) return
-    const inputElement = this.$$(categoryControl.$el).find('input')
-    this.initializeAutocomplete(inputElement)
+    if (categoryControl && categoryControl.$el) {
+      const inputElement = this.$$(categoryControl.$el).find('input')
+      this.initializeAutocompleteCategory(inputElement)
+    }
   },
   beforeDestroy () {
+    if (this.unitAutocomplete) {
+      this.$f7.autocomplete.destroy(this.unitAutocomplete)
+    }
     if (this.categoryAutocomplete) {
       this.$f7.autocomplete.destroy(this.categoryAutocomplete)
     }
diff --git a/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js b/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
index c761a4a2dc..6674a9dc8e 100644
--- a/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
+++ b/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
@@ -1,3 +1,5 @@
+import * as Units from '@/assets/units.js'
+
 export default {
   data () {
     return {
@@ -6,8 +8,8 @@ export default {
     }
   },
   created () {
-    this.$oh.api.get('/').then((root) => {
-      this.measurementSystem = root.measurementSystem
+    this.$oh.api.get('/rest/').then((data) => {
+      this.measurementSystem = data.measurementSystem
     })
     this.$oh.api.get('/rest/systeminfo/uom').then((data) => {
       data.uomInfo.dimensions.forEach((d) => {
@@ -20,9 +22,43 @@ export default {
     })
   },
   methods: {
-    getUnitHint (channelType) {
-      let units = ((channelType && channelType.unitHint) ? channelType.unitHint : '').split(',')
-      return (this.measurementSystem === 'US' && units.length > 1) ? units[1].trim() : units[0].trim()
+    getUnitHint (dimension, channelType) {
+      const units = ((channelType && channelType.unitHint) ? channelType.unitHint : '').split(',')
+      let unit = (this.measurementSystem === 'US' && units.length > 1) ? units[1].trim() : units[0].trim() 
+      if (!unit) {
+        const unitCurated = Units.Units.find(u => u.dimension === dimension)
+        if (unitCurated) {
+          if (this.measurementSystem === 'SI' && unitCurated.defaultSI) {
+            unit = unitCurated.defaultSI
+          } else if (this.measurementSystem === 'US' && unitCurated.defaultUS) {
+            unit = unitCurated.defaultUS
+          } else if (unitCurated.default) {
+            unit = unitCurated.default
+          }            
+        }
+      }
+      if (!unit) {
+        unit = this.dimensions.find(d => d.name === dimension).systemUnit
+      }
+      return unit
+    },
+    getUnitList (dimension) {
+      let unitList = []
+      const unitCurated = Units.Units.find(u => u.dimension === dimension)
+      if (unitCurated) {
+        if (this.measurementSystem === 'SI' && unitCurated.unitsSI) {
+          unitList = unitList.concat(unitCurated.unitsSI)
+        } else if (this.measurementSystem === 'US' && unitCurated.unitsUS) {
+          unitList = unitList.concat(unitCurated.unitsUS)
+        } else {
+          unitList = unitList.concat(unitCurated.units)
+        }
+      }
+      const systemUnit = this.dimensions.find(d => d.name === dimension).systemUnit
+      if (!unitList.includes(systemUnit)) {
+        unitList = [systemUnit].concat(unitList)
+      }
+      return unitList
     }
   }
 }
diff --git a/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue b/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue
index 6ac08ec238..6a1c789f8b 100644
--- a/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue
+++ b/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue
@@ -47,8 +47,8 @@
                               :thing="thing" :channelId="channelId" :channelType="channelType" :channel="channel" :extensible="extensible" :context="context"
                               @channel-updated="(e) => $emit('channels-updated', e)" />
               </template>
-              <template #default="{ channel }" v-else-if="multipleLinksMode">
-                <item-form v-if="isChecked(channel)" :item="newItem(channel)" :items="items" :createMode="true" :channel="channel" :checked="isChecked(channel)" />
+              <template #default="{ channelType, channel }" v-else-if="multipleLinksMode">
+                <item-form v-if="isChecked(channel)" :item="newItem(channel)" :items="items" :createMode="true" :channel="channel" :checked="isChecked(channel)" :unitHint="unit(channel, channelType)" />
               </template>
               <!-- <channel-link #default="{ channelId }" /> -->
             </channel-group>
@@ -192,7 +192,6 @@ export default {
         }
         newItemName += this.$oh.utils.normalizeLabel(suffix)
         const defaultTags = (channel.defaultTags.length > 0) ? channel.defaultTags : channelType.tags
-        const unit = this.getUnitHint(channelType)
         const newItem = {
           channel: channel,
           channelType: channelType,
@@ -200,12 +199,16 @@ export default {
           label: channel.label || channelType.label,
           category: (channelType) ? channelType.category : '',
           type: channel.itemType,
-          unit: unit,
+          unit: this.unit(channel, channelType),
           tags: (defaultTags.find((t) => this.$store.getters.semanticClasses.Points.indexOf(t) >= 0)) ? defaultTags : [...defaultTags, 'Point']
         }
         this.newItems.push(newItem)
       }
     },
+    unit (channel, channelType) {
+      const dimension = channel.itemType.startsWith('Number:') ? this.dimensions.find(d => d.name === channel.itemType.split(':')[1]) : ''
+      return dimension ? this.getUnitHint(dimension.name, channelType) : ''
+    },
     toggleAllChecks (checked) {
       this.thing.channels.forEach((c) => {
         const channelType = this.channelTypesMap.get(c.channelTypeUID)
diff --git a/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue b/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue
index 6208d09195..5cc37cfd17 100644
--- a/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue
+++ b/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue
@@ -43,7 +43,7 @@
 
         <!-- Create new item -->
         <f7-col v-else>
-          <item-form :item="newItem" :items="items" :createMode="true" />
+          <item-form :item="newItem" :items="items" :createMode="true" :unitHint="unit()" />
         </f7-col>
       </template>
 
@@ -193,17 +193,20 @@ export default {
       newItemName += '_'
       newItemName += this.$oh.utils.normalizeLabel(this.channel.label || this.channelType.label)
       const defaultTags = (this.channel.defaultTags.length > 0) ? this.channel.defaultTags : this.channelType.tags
-      const unit = this.getUnitHint(this.channelType)
       this.$set(this, 'newItem', {
         name: newItemName,
         label: this.channel.label || this.channelType.label,
         category: (this.channelType) ? this.channelType.category : '',
         groupNames: [],
         type: this.channel.itemType || 'Switch',
-        unit: unit,
+        unit: this.unit(),
         tags: (defaultTags.find((t) => this.$store.getters.semanticClasses.Points.indexOf(t) >= 0)) ? defaultTags : [...defaultTags, 'Point']
       })
     },
+    unit () {
+      const dimension = this.channel.itemType.startsWith('Number:') ? this.dimensions.find(d => d.name === this.channel.itemType.split(':')[1]) : ''
+      return dimension ? this.getUnitHint(dimension.name, this.channelType) : ''
+    },
     loadProfileTypes (channel) {
       this.ready = false
       this.selectedChannel = channel

From 11c5fe9ef15b4ca236aee16daae3f1e446bb184d Mon Sep 17 00:00:00 2001
From: Mark Herwege <mark.herwege@telenet.be>
Date: Fri, 1 Mar 2024 11:06:37 +0100
Subject: [PATCH 06/24] extend units list

Signed-off-by: Mark Herwege <mark.herwege@telenet.be>
---
 .../org.openhab.ui/web/src/assets/units.js    | 74 +++++++++++++++++--
 .../web/src/components/item/uom-mixin.js      |  4 +-
 2 files changed, 68 insertions(+), 10 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/assets/units.js b/bundles/org.openhab.ui/web/src/assets/units.js
index c5ece33399..66b63fd370 100644
--- a/bundles/org.openhab.ui/web/src/assets/units.js
+++ b/bundles/org.openhab.ui/web/src/assets/units.js
@@ -1,9 +1,67 @@
 export const Units = [{
-    dimension: 'Dimensionless',
-    units: ['one', '%', 'dB', 'ppm'],
-    default: '%'
-} , {
-    dimension: 'Length',
-    unitsSI: ['mm', 'cm', 'dm', 'm', 'km'],
-    unitsUS: ['in', 'ft', 'mi']
-}]
\ No newline at end of file
+  dimension: 'Angle',
+  units: ['°', 'rad']
+}, {
+  dimension: 'Area',
+  unitsSI: ['m²', 'km²', 'ha'],
+  unitsUS: ['ft²', 'mi²']
+}, {
+  dimension: 'DataAmount',
+  units: ['bit', 'B', 'KB', 'KiB', 'MB', 'MiB', 'GB', 'GiB', 'TB', 'TiB']
+}, {
+  dimension: 'DataTransferRate',
+  units: ['bit/s', 'Kbit/s', 'Mbit/s', 'GBit/s']
+}, {
+  dimension: 'Density',
+  units: ['g/l', 'g/m³', 'kg/m³']
+}, {
+  dimension: 'Dimensionless',
+  units: ['one', '%', 'dB', 'ppm'],
+  default: '%'
+}, {
+  dimension: 'ElectricCharge',
+  units: ['Ah', 'C']
+}, {
+  dimension: 'Energy',
+  units: ['kWh', 'Wh', 'VAh', 'varh', 'J', 'kJ', 'cal', 'kcal']
+}, {
+  dimension: 'Force',
+  units: ['N', 'kN']
+}, {
+  dimension: 'Frequency',
+  units: ['Hz', 'kHz', 'MHz', 'GHz', 'rpm']
+}, {
+  dimension: 'Intensity',
+  units: ['W/m²', 'µW/cm²']
+}, {
+  dimension: 'Length',
+  unitsSI: ['mm', 'cm', 'dm', 'm', 'km'],
+  unitsUS: ['in', 'ft', 'mi']
+}, {
+  dimension: 'Mass',
+  unitsSI: ['mg', 'g', 'kg', 't']
+}, {
+  dimension: 'Power',
+  units: ['W', 'kW', 'VA', 'kVA', 'var', 'kvar', 'dBm']
+}, {
+  dimension: 'Pressure',
+  unitsSI: ['Pa', 'hPa', 'bar', 'mbar', 'mmHg'],
+  unitsUS: ['inHg', 'psi']
+}, {
+  dimension: 'Speed',
+  unitsSI: ['km/h', 'm/s'],
+  unitsUS: ['mph', 'in/h']
+}, {
+  dimension: 'Temperature',
+  unitsSI: ['°C', 'K'],
+  unitsUS: ['°F', 'K']
+}, {
+  dimension: 'Time',
+  units: ['s', 'min', 'h', 'd', 'wk', 'mo', 'y']
+}, {
+  dimension: 'Volume',
+  unitsSI: ['ml', 'cl', 'l', 'm³']
+}, {
+  dimension: 'VolumetricFlowRate',
+  unitsSI: ['l/min', 'm³/s', 'm³/min', 'm³/h', 'm³/d']
+}]
diff --git a/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js b/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
index 6674a9dc8e..770f2ca36a 100644
--- a/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
+++ b/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
@@ -24,7 +24,7 @@ export default {
   methods: {
     getUnitHint (dimension, channelType) {
       const units = ((channelType && channelType.unitHint) ? channelType.unitHint : '').split(',')
-      let unit = (this.measurementSystem === 'US' && units.length > 1) ? units[1].trim() : units[0].trim() 
+      let unit = (this.measurementSystem === 'US' && units.length > 1) ? units[1].trim() : units[0].trim()
       if (!unit) {
         const unitCurated = Units.Units.find(u => u.dimension === dimension)
         if (unitCurated) {
@@ -34,7 +34,7 @@ export default {
             unit = unitCurated.defaultUS
           } else if (unitCurated.default) {
             unit = unitCurated.default
-          }            
+          }
         }
       }
       if (!unit) {

From 43bf1b4ca8cece47bf9a0557449229eaa1d64129 Mon Sep 17 00:00:00 2001
From: Mark Herwege <mark.herwege@telenet.be>
Date: Fri, 1 Mar 2024 11:06:37 +0100
Subject: [PATCH 07/24] show units all measurement systems

Signed-off-by: Mark Herwege <mark.herwege@telenet.be>
---
 .../web/src/components/item/group-form.vue    |  7 +-----
 .../web/src/components/item/item-form.vue     |  2 +-
 .../web/src/components/item/uom-mixin.js      | 23 +++++++++++++++----
 3 files changed, 20 insertions(+), 12 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/components/item/group-form.vue b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
index 6e51910c44..f9f3ddf457 100644
--- a/bundles/org.openhab.ui/web/src/components/item/group-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
@@ -180,12 +180,7 @@ export default {
         this.$f7.autocomplete.destroy(this.unitAutocomplete)
       }
       // item.unit can be set to unitHint from channel type, make sure it is at beginning of list
-      let units = this.getUnitList(dimension)
-      const index = units.indexOf(this.item.unit)
-      if (index >= 0) {
-        units.splice(index, 1)
-      }
-      units = [this.item.unit].concat(units)
+      let units = [...new Set([this.item.unit].concat(this.getUnitList(dimension.name)))]
       this.unitAutocomplete = this.$f7.autocomplete.create({
         inputEl: inputElement,
         openIn: 'dropdown',
diff --git a/bundles/org.openhab.ui/web/src/components/item/item-form.vue b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
index 5f4724b8bf..bb47b20b53 100644
--- a/bundles/org.openhab.ui/web/src/components/item/item-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
@@ -158,7 +158,7 @@ export default {
         this.$f7.autocomplete.destroy(this.unitAutocomplete)
       }
       // item.unit can be set to unitHint from channel type, make sure it is at beginning of list
-      let units = this.getUnitList(dimension.name)
+      let units = [...new Set([this.item.unit].concat(this.getUnitList(dimension.name)))]
       const index = units.indexOf(this.item.unit)
       if (index >= 0) {
         units.splice(index, 1)
diff --git a/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js b/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
index 770f2ca36a..4d76243b9e 100644
--- a/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
+++ b/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
@@ -46,18 +46,31 @@ export default {
       let unitList = []
       const unitCurated = Units.Units.find(u => u.dimension === dimension)
       if (unitCurated) {
-        if (this.measurementSystem === 'SI' && unitCurated.unitsSI) {
-          unitList = unitList.concat(unitCurated.unitsSI)
-        } else if (this.measurementSystem === 'US' && unitCurated.unitsUS) {
-          unitList = unitList.concat(unitCurated.unitsUS)
-        } else {
+        if (unitCurated.units()) {
           unitList = unitList.concat(unitCurated.units)
         }
+        if (this.measurementSystem === 'SI') {
+          if (unitCurated.unitsSI) {
+            unitList = unitList.concat(unitCurated.unitsSI)
+          }
+          if (unitCurated.unitsUS) {
+            unitList = unitList.concat(unitCurated.unitsUS)
+          }
+        } else if (this.measurementSystem === 'US') {
+          if (unitCurated.unitsUS) {
+            unitList = unitList.concat(unitCurated.unitsUS)
+          }
+          if (unitCurated.unitsSI) {
+            unitList = unitList.concat(unitCurated.unitsSI)
+          }
+        }
       }
       const systemUnit = this.dimensions.find(d => d.name === dimension).systemUnit
       if (!unitList.includes(systemUnit)) {
         unitList = [systemUnit].concat(unitList)
       }
+      // remove duplicates
+      unitList = [...new Set(unitList)]
       return unitList
     }
   }

From cdf09a4f23f3cf3da6252cd344be712f9a4271d9 Mon Sep 17 00:00:00 2001
From: Mark Herwege <mark.herwege@telenet.be>
Date: Fri, 1 Mar 2024 11:06:37 +0100
Subject: [PATCH 08/24] extended info text unit selection

Signed-off-by: Mark Herwege <mark.herwege@telenet.be>
---
 bundles/org.openhab.ui/web/src/components/item/group-form.vue | 2 +-
 bundles/org.openhab.ui/web/src/components/item/item-form.vue  | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/components/item/group-form.vue b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
index f9f3ddf457..687a838363 100644
--- a/bundles/org.openhab.ui/web/src/components/item/group-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
@@ -21,7 +21,7 @@
     <template v-if="createMode && groupType && groupDimension">
       <f7-list-input label="Unit"
                      type="text"
-                     :info="(createMode) ? 'Used internally, for persistence and external systems. It is independent from the state visualization in the UI, which is defined through the state description.' : ''"
+                     :info="(createMode) ? 'Type any valid unit or select from one of the proposed (non-exhaustive list of) units. Used internally, for persistence and external systems. It is independent from the state visualization in the UI, which is defined through the state description.' : ''"
                      :value="item.unit"
                      @input="item.unit = $event.target.value" :clear-button="editable" />
       <f7-list-input label="State Description Pattern"
diff --git a/bundles/org.openhab.ui/web/src/components/item/item-form.vue b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
index bb47b20b53..a878cb3e4a 100644
--- a/bundles/org.openhab.ui/web/src/components/item/item-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
@@ -32,7 +32,7 @@
         <f7-list-input v-show="itemDimension"
                        label="Unit"
                        type="text"
-                       :info="(createMode) ? 'Used internally, for persistence and external systems. It is independent from the state visualization in the UI, which is defined through the state description.' : ''"
+                       :info="(createMode) ? 'Type any valid unit or select from one of the proposed (non-exhaustive list of) units. Used internally, for persistence and external systems. It is independent from the state visualization in the UI, which is defined through the state description.' : ''"
                        :disabled="!editable"
                        :value="item.unit"
                        @input="item.unit = $event.target.value"

From 4b400bd8c47274d3831c661037bfb83d46b0c5a3 Mon Sep 17 00:00:00 2001
From: Mark Herwege <mark.herwege@telenet.be>
Date: Fri, 1 Mar 2024 11:06:38 +0100
Subject: [PATCH 09/24] full auto complete

Signed-off-by: Mark Herwege <mark.herwege@telenet.be>
---
 .../org.openhab.ui/web/src/assets/units.js    | 135 +++++++++++++++---
 .../web/src/components/item/group-form.vue    |  11 +-
 .../web/src/components/item/item-form.vue     |  16 +--
 .../web/src/components/item/uom-mixin.js      |  28 ++++
 4 files changed, 160 insertions(+), 30 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/assets/units.js b/bundles/org.openhab.ui/web/src/assets/units.js
index 66b63fd370..956098f04d 100644
--- a/bundles/org.openhab.ui/web/src/assets/units.js
+++ b/bundles/org.openhab.ui/web/src/assets/units.js
@@ -1,67 +1,164 @@
+// Units defines the possible units for UI unit selection. Each unit is defined by one or more fields:
+//   dimension: required field, unit dimension
+//   units: units used in a curated shortlist of units, not specific to SI or Imperial measurement system
+//   unitsSI: units used in a curated shortlist of units, specific to the SI measurement system
+//   unitsUS: units used in a curated shortlist of units, specific to the Imperial measurement system
+//   default: default unit, to be set to override core default unit, not specific to SI or Imperial measurement system
+//   defaultSI: default unit in SI measurement system, to be set to override OH core default SI unit
+//   defaultUS: default unit in Imperial measurement system, to be set to override OH core default Imperial unit
+//   baseUnits: all supported base units that don't allow metric or binary prefixes
+//   baseUnitsMetric: metric base units, the full list of units will include all of these with all metric prefixes
+//   baseUnitsBinary: binary base units, the full list of units will include all of these with all binary prefixes
+// If nothing is defined for an allowed dimension, the UI will fall back on the OH core default unit in the configured
+// measurement system.
+// For dimensions defined, any of the fields can be ommitted. Logical defaults will be used.
+// Units from curated units lists will always be added to the full unit list constructed from baseUnits and prefixes. So it
+// is not necessary to explicitely add what is already in the curated units for the full units list. However, no prefixes
+// will be applied to these. If you want prefixes to be applied, you should add them in the respective baseUnits Array as well.
+
 export const Units = [{
+  dimension: 'Acceleration',
+  baseUnits: ['gₙ'],
+  baseUnitsSI: ['m/s²']
+}, {
+  dimension: 'AmountOfSubstance',
+  baseUnits: ['°dH'],
+  baseUnitsSI: ['mol']
+}, {
   dimension: 'Angle',
-  units: ['°', 'rad']
+  units: ['°', '\'', '"', 'rad']
 }, {
   dimension: 'Area',
   unitsSI: ['m²', 'km²', 'ha'],
-  unitsUS: ['ft²', 'mi²']
+  unitsUS: ['ft²', 'mi²'],
+  baseUnits: ['ca', 'a', 'in²', 'ac'],
+  baseUnitsMetric: ['m²']
 }, {
   dimension: 'DataAmount',
-  units: ['bit', 'B', 'KB', 'KiB', 'MB', 'MiB', 'GB', 'GiB', 'TB', 'TiB']
+  units: ['bit', 'B', 'kB', 'kiB', 'MB', 'MiB', 'GB', 'GiB', 'TB', 'TiB'],
+  baseUnitsMetric: ['bit', 'B', 'o'],
+  baseUnitsBinary: ['bit', 'B', 'o']
 }, {
   dimension: 'DataTransferRate',
-  units: ['bit/s', 'Kbit/s', 'Mbit/s', 'GBit/s']
+  units: ['bit/s', 'kbit/s', 'Mbit/s', 'GBit/s'],
+  baseUnitsMetric: ['bit/s'],
+  baseUnitsBinary: ['bit/s']
 }, {
   dimension: 'Density',
-  units: ['g/l', 'g/m³', 'kg/m³']
+  units: ['g/l', 'g/m³', 'kg/m³'],
+  baseUnits: ['lb/in³'],
+  baseUnitsMetric: ['g/m³', 'g/mm³', 'g/cm³', 'g/dm³', 'g/ml', 'g/cl', 'g/dl', 'g/l']
 }, {
   dimension: 'Dimensionless',
-  units: ['one', '%', 'dB', 'ppm'],
+  units: ['one', '%', 'dB', 'ppm', 'ppb'],
   default: '%'
+}, {
+  dimension: 'ElectricCapcitance',
+  baseUnitsMetric: ['F']
 }, {
   dimension: 'ElectricCharge',
-  units: ['Ah', 'C']
+  units: ['Ah', 'C'],
+  baseUnitsMetric: ['C']
+}, {
+  dimension: 'ElectricConductance',
+  baseUnitsMetric: ['S']
+}, {
+  dimension: 'ElectricConductivity',
+  baseUnitsMetric: ['S/m']
+}, {
+  dimension: 'ElectricCurrent',
+  baseUnitsMetric: ['A']
+}, {
+  dimension: 'ElectricInductance',
+  baseUnitsMetric: ['H']
+}, {
+  dimension: 'ElectricPotential',
+  baseUnitsMetric: ['V']
+}, {
+  dimension: 'ElectricResistance',
+  baseUnitsMetric: ['Ω']
 }, {
   dimension: 'Energy',
-  units: ['kWh', 'Wh', 'VAh', 'varh', 'J', 'kJ', 'cal', 'kcal']
+  units: ['kWh', 'Wh', 'VAh', 'varh', 'J', 'kJ', 'cal', 'kcal'],
+  baseUnitsMetric: ['Ws', 'Wh', 'VAs', 'VAh', 'vars', 'varh', 'J', 'cal']
 }, {
   dimension: 'Force',
-  units: ['N', 'kN']
+  units: ['N', 'kN'],
+  baseUnitsMetric: ['N']
 }, {
   dimension: 'Frequency',
-  units: ['Hz', 'kHz', 'MHz', 'GHz', 'rpm']
+  units: ['Hz', 'kHz', 'MHz', 'GHz', 'rpm'],
+  baseUnitsMetric: ['Hz']
 }, {
   dimension: 'Intensity',
-  units: ['W/m²', 'µW/cm²']
+  units: ['W/m²', 'µW/cm²'],
+  baseUnitsMetric: ['W/mm²', 'W/cm²', 'W/dm²', 'W/m²']
 }, {
   dimension: 'Length',
   unitsSI: ['mm', 'cm', 'dm', 'm', 'km'],
-  unitsUS: ['in', 'ft', 'mi']
+  unitsUS: ['in', 'ft', 'mi'],
+  baseUnits: ['yd', 'ch', 'fur', 'lea']
+}, {
+  dimension: 'LuminousFlux',
+  baseUnitsMetric: ['lm']
+}, {
+  dimension: 'LuminousIntensity',
+  baseUnitsMetric: ['cd']
+}, {
+  dimension: 'MagneticFlux',
+  baseUnitsMetric: ['T']
 }, {
   dimension: 'Mass',
-  unitsSI: ['mg', 'g', 'kg', 't']
+  unitsSI: ['mg', 'g', 'kg', 't'],
+  baseUnits: ['lb', 'oz', 'st'],
+  baseUnitsMetric: ['g', 't']
 }, {
   dimension: 'Power',
-  units: ['W', 'kW', 'VA', 'kVA', 'var', 'kvar', 'dBm']
+  units: ['W', 'kW', 'VA', 'kVA', 'var', 'kvar', 'dBm'],
+  baseUnits: ['hp', 'kgf', 'lbf'],
+  baseUnitsMetric: ['W', 'VA', 'var']
 }, {
   dimension: 'Pressure',
   unitsSI: ['Pa', 'hPa', 'bar', 'mbar', 'mmHg'],
-  unitsUS: ['inHg', 'psi']
+  unitsUS: ['inHg', 'psi'],
+  baseUnits: ['atm'],
+  baseUnitsMetric: ['Pa', 'bar']
+}, {
+  dimension: 'RadiationAbsorbedDose',
+  baseUnitsMetric: ['Gy']
+}, {
+  dimension: 'RadiationEffectiveDose',
+  baseUnitsMetric: ['Sv']
+}, {
+  dimension: 'Radioactivity',
+  unitsSI: ['Bq', 'Ci'],
+  baseUnitsMetric: ['Ci']
 }, {
   dimension: 'Speed',
   unitsSI: ['km/h', 'm/s'],
-  unitsUS: ['mph', 'in/h']
+  unitsUS: ['mph', 'in/h'],
+  baseUnits: ['kn'],
+  baseUnitsMetric: ['m/s', 'm/h']
 }, {
   dimension: 'Temperature',
   unitsSI: ['°C', 'K'],
-  unitsUS: ['°F', 'K']
+  unitsUS: ['°F', 'K'],
+  baseUnits: ['mired']
 }, {
   dimension: 'Time',
   units: ['s', 'min', 'h', 'd', 'wk', 'mo', 'y']
 }, {
   dimension: 'Volume',
-  unitsSI: ['ml', 'cl', 'l', 'm³']
+  unitsSI: ['ml', 'cl', 'l', 'm³'],
+  unitsUS: ['gal'],
+  baseUnits: ['in³', 'ft³'],
+  baseUnitsMetric: ['l', 'm³']
 }, {
   dimension: 'VolumetricFlowRate',
-  unitsSI: ['l/min', 'm³/s', 'm³/min', 'm³/h', 'm³/d']
+  unitsSI: ['l/s', 'l/min', 'm³/s', 'm³/min', 'm³/h', 'm³/d'],
+  unitsUS: ['gal/min'],
+  baseUnitsMetric: ['m³/s', 'm³/min', 'm³/h', 'm³/d']
 }]
+
+export const prefixesMetric = ['y', 'z', 'a', 'f', 'p', 'n', 'µ', 'm', 'c', 'd', 'da', 'h', 'k', 'M', 'G', 'T', 'P', 'E', 'Z', 'Y']
+export const prefixesBinary = ['ki', 'Mi', 'Gi', 'Ti', 'Pi', 'Ei', 'Zi', 'Yi']
diff --git a/bundles/org.openhab.ui/web/src/components/item/group-form.vue b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
index 687a838363..b9fa30200f 100644
--- a/bundles/org.openhab.ui/web/src/components/item/group-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
@@ -180,13 +180,18 @@ export default {
         this.$f7.autocomplete.destroy(this.unitAutocomplete)
       }
       // item.unit can be set to unitHint from channel type, make sure it is at beginning of list
-      let units = [...new Set([this.item.unit].concat(this.getUnitList(dimension.name)))]
+      let curatedUnits = [...new Set([this.item.unit].concat(this.getUnitList(dimension.name)))]
+      let allUnits = this.getFullUnitList(dimension.name)
       this.unitAutocomplete = this.$f7.autocomplete.create({
         inputEl: inputElement,
         openIn: 'dropdown',
         source (query, render) {
-          // Always render full list
-          render(units)
+          if (!query || !query.length) {
+          // Render curated list by default
+            render(curatedUnits)
+          } else {
+            render(allUnits.filter(u => u.toLowerCase().indexOf(query.toLowerCase()) >= 0))
+          }
         }
       })
     },
diff --git a/bundles/org.openhab.ui/web/src/components/item/item-form.vue b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
index a878cb3e4a..a0540ebeb6 100644
--- a/bundles/org.openhab.ui/web/src/components/item/item-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
@@ -158,18 +158,18 @@ export default {
         this.$f7.autocomplete.destroy(this.unitAutocomplete)
       }
       // item.unit can be set to unitHint from channel type, make sure it is at beginning of list
-      let units = [...new Set([this.item.unit].concat(this.getUnitList(dimension.name)))]
-      const index = units.indexOf(this.item.unit)
-      if (index >= 0) {
-        units.splice(index, 1)
-      }
-      units = [this.item.unit].concat(units)
+      let curatedUnits = [...new Set([this.item.unit].concat(this.getUnitList(dimension.name)))]
+      let allUnits = this.getFullUnitList(dimension.name)
       this.unitAutocomplete = this.$f7.autocomplete.create({
         inputEl: inputElement,
         openIn: 'dropdown',
         source (query, render) {
-          // Always render full list
-          render(units)
+          if (!query || !query.length) {
+          // Render curated list by default
+            render(curatedUnits)
+          } else {
+            render(allUnits.filter(u => u.toLowerCase().indexOf(query.toLowerCase()) >= 0))
+          }
         }
       })
     },
diff --git a/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js b/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
index 4d76243b9e..588d9b9b5c 100644
--- a/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
+++ b/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
@@ -72,6 +72,34 @@ export default {
       // remove duplicates
       unitList = [...new Set(unitList)]
       return unitList
+    },
+    getFullUnitList (dimension) {
+      let unitList = []
+      const unit = Units.Units.find(u => u.dimension === dimension)
+      let units = unit.baseUnits
+      if (units) {
+        unitList = unitList.concat(units)
+      }
+      let metricUnits = unit.baseUnitsMetric?.map(
+        u => Units.prefixesMetric.map(
+          p => unitList.concat(p.concat(u))
+        ).concat())
+      if (metricUnits) {
+        unitList = unitList.concat(metricUnits)
+      }
+      let binaryUnits = unit.baseUnitsBinary?.map(
+        u => Units.prefixesBinary.map(
+          p => unitList.concat(p.concat(u))
+        ).concat())
+      if (binaryUnits) {
+        unitList = unitList.concat(binaryUnits)
+      }
+      // Make sure all curated units are also included, even if missing info in units.js
+      // This avoids having to double define them if they are already all in the curated list
+      unitList = unitList.concat(this.getUnitList(dimension))
+      unitList = [...new Set(unitList)]
+      unitList.sort()
+      return unitList
     }
   }
 }

From a793621afa739cdc609d7675e64a291d190c8e0d Mon Sep 17 00:00:00 2001
From: Mark Herwege <mark.herwege@telenet.be>
Date: Fri, 1 Mar 2024 11:06:38 +0100
Subject: [PATCH 10/24] fixes

Signed-off-by: Mark Herwege <mark.herwege@telenet.be>
---
 .../org.openhab.ui/web/src/assets/units.js    |  2 +-
 .../web/src/components/item/group-form.vue    | 17 +++++--
 .../web/src/components/item/item-form.vue     | 10 +++-
 .../web/src/components/item/uom-mixin.js      | 49 +++++++++----------
 4 files changed, 46 insertions(+), 32 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/assets/units.js b/bundles/org.openhab.ui/web/src/assets/units.js
index 956098f04d..39a0be842e 100644
--- a/bundles/org.openhab.ui/web/src/assets/units.js
+++ b/bundles/org.openhab.ui/web/src/assets/units.js
@@ -79,7 +79,7 @@ export const Units = [{
   baseUnitsMetric: ['Ω']
 }, {
   dimension: 'Energy',
-  units: ['kWh', 'Wh', 'VAh', 'varh', 'J', 'kJ', 'cal', 'kcal'],
+  units: ['kWh', 'Wh', 'kVAh', 'kvarh', 'J', 'kJ', 'cal', 'kcal'],
   baseUnitsMetric: ['Ws', 'Wh', 'VAs', 'VAh', 'vars', 'varh', 'J', 'cal']
 }, {
   dimension: 'Force',
diff --git a/bundles/org.openhab.ui/web/src/components/item/group-form.vue b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
index b9fa30200f..fb5637db58 100644
--- a/bundles/org.openhab.ui/web/src/components/item/group-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
@@ -61,7 +61,9 @@ export default {
   props: ['item', 'createMode'],
   data () {
     return {
-      types
+      types,
+      unitAutocomplete: null,
+      unitInitialized: !this.createMode
     }
   },
   computed: {
@@ -185,12 +187,16 @@ export default {
       this.unitAutocomplete = this.$f7.autocomplete.create({
         inputEl: inputElement,
         openIn: 'dropdown',
+        typeahead: true,
         source (query, render) {
-          if (!query || !query.length) {
+          if (!query || !query.length || !this.unitInitialized) {
           // Render curated list by default
             render(curatedUnits)
+            this.unitInitialized = true
           } else {
-            render(allUnits.filter(u => u.toLowerCase().indexOf(query.toLowerCase()) >= 0))
+            // Always show currated units on top (don't filter them)
+            let units = [...new Set(curatedUnits.concat(allUnits.filter(u => u.indexOf(query) >= 0)))]
+            render(units)
           }
         }
       })
@@ -210,6 +216,11 @@ export default {
       }
       this.$set(this.item, 'function', func)
     }
+  },
+  beforeDestroy () {
+    if (this.unitAutocomplete) {
+      this.$f7.autocomplete.destroy(this.unitAutocomplete)
+    }
   }
 }
 </script>
diff --git a/bundles/org.openhab.ui/web/src/components/item/item-form.vue b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
index a0540ebeb6..723e4d2a54 100644
--- a/bundles/org.openhab.ui/web/src/components/item/item-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
@@ -109,6 +109,7 @@ export default {
     return {
       types,
       unitAutocomplete: null,
+      unitInitialized: !this.createMode,
       categoryInputId: '',
       categoryAutocomplete: null,
       nameErrorMessage: ''
@@ -163,12 +164,17 @@ export default {
       this.unitAutocomplete = this.$f7.autocomplete.create({
         inputEl: inputElement,
         openIn: 'dropdown',
+        typeahead: true,
+        dropdownPlaceHolderText: this.getUnitHint(dimension.name),
         source (query, render) {
-          if (!query || !query.length) {
+          if (!query || !query.length || !this.unitInitialized) {
           // Render curated list by default
             render(curatedUnits)
+            this.unitInitialized = true
           } else {
-            render(allUnits.filter(u => u.toLowerCase().indexOf(query.toLowerCase()) >= 0))
+            // Always show currated units on top (don't filter them)
+            let units = [...new Set(curatedUnits.concat(allUnits.filter(u => u.indexOf(query) >= 0)))]
+            render(units)
           }
         }
       })
diff --git a/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js b/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
index 588d9b9b5c..f6979a1c94 100644
--- a/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
+++ b/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
@@ -45,24 +45,22 @@ export default {
     getUnitList (dimension) {
       let unitList = []
       const unitCurated = Units.Units.find(u => u.dimension === dimension)
-      if (unitCurated) {
-        if (unitCurated.units()) {
-          unitList = unitList.concat(unitCurated.units)
+      if (unitCurated?.units) {
+        unitList = unitList.concat(unitCurated.units)
+      }
+      if (this.measurementSystem === 'SI') {
+        if (unitCurated?.unitsSI) {
+          unitList = unitList.concat(unitCurated.unitsSI)
         }
-        if (this.measurementSystem === 'SI') {
-          if (unitCurated.unitsSI) {
-            unitList = unitList.concat(unitCurated.unitsSI)
-          }
-          if (unitCurated.unitsUS) {
-            unitList = unitList.concat(unitCurated.unitsUS)
-          }
-        } else if (this.measurementSystem === 'US') {
-          if (unitCurated.unitsUS) {
-            unitList = unitList.concat(unitCurated.unitsUS)
-          }
-          if (unitCurated.unitsSI) {
-            unitList = unitList.concat(unitCurated.unitsSI)
-          }
+        if (unitCurated?.unitsUS) {
+          unitList = unitList.concat(unitCurated.unitsUS)
+        }
+      } else if (this.measurementSystem === 'US') {
+        if (unitCurated?.unitsUS) {
+          unitList = unitList.concat(unitCurated.unitsUS)
+        }
+        if (unitCurated?.unitsSI) {
+          unitList = unitList.concat(unitCurated.unitsSI)
         }
       }
       const systemUnit = this.dimensions.find(d => d.name === dimension).systemUnit
@@ -76,29 +74,28 @@ export default {
     getFullUnitList (dimension) {
       let unitList = []
       const unit = Units.Units.find(u => u.dimension === dimension)
-      let units = unit.baseUnits
+      let units = unit?.baseUnits
       if (units) {
         unitList = unitList.concat(units)
       }
-      let metricUnits = unit.baseUnitsMetric?.map(
+      let metricUnits = unit?.baseUnitsMetric?.flatMap(
         u => Units.prefixesMetric.map(
-          p => unitList.concat(p.concat(u))
-        ).concat())
+          p => p.concat(u)
+        ))
       if (metricUnits) {
         unitList = unitList.concat(metricUnits)
       }
-      let binaryUnits = unit.baseUnitsBinary?.map(
+      let binaryUnits = unit?.baseUnitsBinary?.flatMap(
         u => Units.prefixesBinary.map(
-          p => unitList.concat(p.concat(u))
-        ).concat())
+          p => p.concat(u)
+        ))
       if (binaryUnits) {
         unitList = unitList.concat(binaryUnits)
       }
-      // Make sure all curated units are also included, even if missing info in units.js
+      // Make sure all curated units are also included at top, even if missing info in units.js
       // This avoids having to double define them if they are already all in the curated list
       unitList = unitList.concat(this.getUnitList(dimension))
       unitList = [...new Set(unitList)]
-      unitList.sort()
       return unitList
     }
   }

From df20fe7dafe4399745b1791802f2f1562388abb0 Mon Sep 17 00:00:00 2001
From: Mark Herwege <mark.herwege@telenet.be>
Date: Fri, 1 Mar 2024 11:06:38 +0100
Subject: [PATCH 11/24] refine unit autocomplete

Signed-off-by: Mark Herwege <mark.herwege@telenet.be>
---
 .../web/src/components/item/group-form.vue         | 14 ++++++++------
 .../web/src/components/item/item-form.vue          | 12 +++++++-----
 2 files changed, 15 insertions(+), 11 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/components/item/group-form.vue b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
index fb5637db58..ad9ec6c0b1 100644
--- a/bundles/org.openhab.ui/web/src/components/item/group-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
@@ -62,8 +62,7 @@ export default {
   data () {
     return {
       types,
-      unitAutocomplete: null,
-      unitInitialized: !this.createMode
+      unitAutocomplete: null
     }
   },
   computed: {
@@ -189,13 +188,16 @@ export default {
         openIn: 'dropdown',
         typeahead: true,
         source (query, render) {
-          if (!query || !query.length || !this.unitInitialized) {
+          if (!query || !query.length) {
           // Render curated list by default
             render(curatedUnits)
-            this.unitInitialized = true
           } else {
-            // Always show currated units on top (don't filter them)
-            let units = [...new Set(curatedUnits.concat(allUnits.filter(u => u.indexOf(query) >= 0)))]
+            // First filter on curated list
+            let units = curatedUnits.filter(u => u.indexOf(query) >= 0)
+            if (!units.length) {
+              // If no match filter on full list
+              units = allUnits.filter(u => u.indexOf(query) >= 0)
+            }
             render(units)
           }
         }
diff --git a/bundles/org.openhab.ui/web/src/components/item/item-form.vue b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
index 723e4d2a54..7208791d46 100644
--- a/bundles/org.openhab.ui/web/src/components/item/item-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
@@ -109,7 +109,6 @@ export default {
     return {
       types,
       unitAutocomplete: null,
-      unitInitialized: !this.createMode,
       categoryInputId: '',
       categoryAutocomplete: null,
       nameErrorMessage: ''
@@ -167,13 +166,16 @@ export default {
         typeahead: true,
         dropdownPlaceHolderText: this.getUnitHint(dimension.name),
         source (query, render) {
-          if (!query || !query.length || !this.unitInitialized) {
+          if (!query || !query.length) {
           // Render curated list by default
             render(curatedUnits)
-            this.unitInitialized = true
           } else {
-            // Always show currated units on top (don't filter them)
-            let units = [...new Set(curatedUnits.concat(allUnits.filter(u => u.indexOf(query) >= 0)))]
+            // First filter on curated list
+            let units = curatedUnits.filter(u => u.indexOf(query) >= 0)
+            if (!units.length) {
+              // If no match filter on full list
+              units = allUnits.filter(u => u.indexOf(query) >= 0)
+            }
             render(units)
           }
         }

From b3f1cc2ec2cb53df6801bd10060b8c0507d59995 Mon Sep 17 00:00:00 2001
From: Mark Herwege <mark.herwege@telenet.be>
Date: Fri, 1 Mar 2024 11:06:39 +0100
Subject: [PATCH 12/24] rebase correction

Signed-off-by: Mark Herwege <mark.herwege@telenet.be>
---
 bundles/org.openhab.ui/web/src/components/item/group-form.vue | 3 ++-
 bundles/org.openhab.ui/web/src/components/item/item-form.vue  | 1 +
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/bundles/org.openhab.ui/web/src/components/item/group-form.vue b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
index ad9ec6c0b1..12e1a057ae 100644
--- a/bundles/org.openhab.ui/web/src/components/item/group-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
@@ -19,7 +19,8 @@
     </f7-list-item>
     <!-- (Internal) Unit & State Description -->
     <template v-if="createMode && groupType && groupDimension">
-      <f7-list-input label="Unit"
+      <f7-list-input ref="unit"
+                     label="Unit"
                      type="text"
                      :info="(createMode) ? 'Type any valid unit or select from one of the proposed (non-exhaustive list of) units. Used internally, for persistence and external systems. It is independent from the state visualization in the UI, which is defined through the state description.' : ''"
                      :value="item.unit"
diff --git a/bundles/org.openhab.ui/web/src/components/item/item-form.vue b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
index 7208791d46..a96208cac2 100644
--- a/bundles/org.openhab.ui/web/src/components/item/item-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
@@ -30,6 +30,7 @@
         <!-- (Internal) Unit & State Description -->
         <!-- Use v-show instead of v-if, because otherwise the autocomplete for category would take over the unit -->
         <f7-list-input v-show="itemDimension"
+                       ref="unit"
                        label="Unit"
                        type="text"
                        :info="(createMode) ? 'Type any valid unit or select from one of the proposed (non-exhaustive list of) units. Used internally, for persistence and external systems. It is independent from the state visualization in the UI, which is defined through the state description.' : ''"

From 8b3a44381503366da432dd0280b754506d412eff Mon Sep 17 00:00:00 2001
From: Mark Herwege <mark.herwege@telenet.be>
Date: Fri, 1 Mar 2024 11:06:39 +0100
Subject: [PATCH 13/24] improvements after rebase

Signed-off-by: Mark Herwege <mark.herwege@telenet.be>
---
 .../web/src/components/item/group-form.vue    | 158 ++++++++++--------
 .../web/src/components/item/item-form.vue     | 149 +++++++++++++----
 .../web/src/components/item/item-mixin.js     |   2 +-
 .../web/src/components/item/uom-mixin.js      |  55 ++++--
 .../web/src/components/thing/channel-list.vue |   6 +-
 .../src/pages/settings/items/item-edit.vue    |  21 ++-
 .../pages/settings/things/link/link-add.vue   |   6 +-
 7 files changed, 270 insertions(+), 127 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/components/item/group-form.vue b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
index 12e1a057ae..c9f3d5371c 100644
--- a/bundles/org.openhab.ui/web/src/components/item/group-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
@@ -3,7 +3,7 @@
     <!-- Type -->
     <f7-list-item v-if="item.type === 'Group'" :disabled="!editable" title="Members Base Type" class="align-popup-list-item" smart-select :smart-select-params="{searchbar: true, openIn: 'popup', closeOnSelect: true}">
       <select name="select-basetype" @change="groupType = $event.target.value">
-        <option v-for="type in types.GroupTypes" :key="type" :value="type" :selected="item.groupType ? type === item.groupType.split(':')[0] : false">
+        <option v-for="type in types.GroupTypes" :key="type" :value="type" :selected="item.groupType ? type === item.groupType : false">
           {{ type }}
         </option>
       </select>
@@ -18,21 +18,21 @@
       </select>
     </f7-list-item>
     <!-- (Internal) Unit & State Description -->
-    <template v-if="createMode && groupType && groupDimension">
-      <f7-list-input ref="unit"
-                     label="Unit"
-                     type="text"
-                     :info="(createMode) ? 'Type any valid unit or select from one of the proposed (non-exhaustive list of) units. Used internally, for persistence and external systems. It is independent from the state visualization in the UI, which is defined through the state description.' : ''"
-                     :value="item.unit"
-                     @input="item.unit = $event.target.value" :clear-button="editable" />
-      <f7-list-input label="State Description Pattern"
-                     type="text"
-                     :info="(createMode) ? 'Pattern or transformation applied to the state for display purposes. Only saved if you change the pre-filled default value.' : ''"
-                     :value="item.stateDescriptionPattern"
-                     @input="item.stateDescriptionPattern = $event.target.value" :clear-button:="editable" />
-    </template>
+    <f7-list-input v-show="groupType && groupDimension && unitsReady"
+                   ref="groupUnit"
+                   label="Unit"
+                   type="text"
+                   :info="(createMode) ? 'Type any valid unit for the dimension or select from one of the proposed units. Used internally, for persistence and external systems. \
+                                          It is independent from the state visualization in the UI, which is defined through the state description pattern.' : ''"
+                   :value="groupDimension ? unit : ''"
+                   @change="groupUnit = $event.target.value" :clear-button="editable" />
+    <f7-list-input v-show="groupType && groupDimension"
+                   label="State Description Pattern"
+                   type="text"
+                   :info="(createMode) ? 'Pattern or transformation applied to the state for display purposes. Only saved if you change the pre-filled default value.' : ''"
+                   :value="getStateDescription()"
+                   @input="item.stateDescriptionPattern = $event.target.value" :clear-button:="editable" />
     <!-- Aggregation Functions -->
-
     <f7-list-item v-if="aggregationFunctions" :disabled="!editable" title="Aggregation Function" class="align-popup-list-item" smart-select :smart-select-params="{openIn: 'popup', closeOnSelect: true}">
       <select name="select-function" @change="groupFunctionKey = $event.target.value">
         <option v-for="type in aggregationFunctions" :key="type.name" :value="type.name" :selected="type.name === groupFunctionKey">
@@ -63,7 +63,9 @@ export default {
   data () {
     return {
       types,
-      unitAutocomplete: null
+      groupUnitAutocomplete: null,
+      oldGroupDimension: '',
+      oldGroupUnit: ''
     }
   },
   computed: {
@@ -77,6 +79,9 @@ export default {
       set (newType) {
         const previousAggregationFunctions = this.aggregationFunctions
         this.$set(this.item, 'groupType', '')
+        if (!this.createMode) {
+          this.$set(this, 'oldGroupDimension', '')
+        }
         this.$nextTick(() => {
           if (newType !== 'None') {
             this.$set(this.item, 'groupType', newType)
@@ -89,18 +94,33 @@ export default {
     },
     groupDimension: {
       get () {
-        const parts = this.item.groupType.split(':')
-        return parts.length > 1 ? parts[1] : ''
+        const parts = this.item.groupType?.split(':')
+        return parts && parts.length > 1 ? parts[1] : ''
       },
       set (newDimension) {
+        if (!this.createMode) {
+          this.$set(this, 'oldGroupDimension', this.groupDimension)
+        }
         if (!newDimension) {
           this.groupType = 'Number'
           return
         }
         const dimension = this.dimensions.find((d) => d.name === newDimension)
         this.$set(this.item, 'groupType', 'Number:' + dimension.name)
-        this.$set(this.item, 'unit', dimension.systemUnit)
-        this.$set(this.item, 'stateDescriptionPattern', `%.0f ${dimension.systemUnit}`)
+        this.groupUnit = this.getUnitHint(dimension.name)
+        this.$set(this.item, 'stateDescriptionPattern', this.getStateDescription())
+        this.$nextTick(() => this.initializeAutocompleteGroupUnit(this.groupDimension))
+      }
+    },
+    groupUnit: {
+      get () {
+        return this.unit
+      },
+      set (newUnit) {
+        if (!this.createMode) {
+          this.$set(this, 'oldGroupUnit', this.unit)
+        }
+        this.$set(this.item, 'unit', newUnit)
       }
     },
     groupFunctionKey: {
@@ -153,76 +173,74 @@ export default {
     }
   },
   methods: {
-    setGroupType (type) {
-      this.$set(this.item, 'groupType', '')
-      this.$set(this.item, 'functionKey', 'None')
-      this.$nextTick(() => {
-        if (type !== 'None') this.$set(this.item, 'groupType', type)
-      })
-    },
-    setDimension (index) {
-      if (index === 'Number') {
-        this.setGroupType('Number')
-        return
-      }
-      const dimension = this.dimensions[index]
-      this.setGroupType('Number:' + dimension.name)
-      if (!this.item.unit) {
-        this.$set(this.item, 'unit', this.getUnitHint(dimension.name))
+    dimensionChanged () {
+      if (!this.oldGroupDimension) {
+        return false
       }
-      const unitControl = this.$refs.unit
-      if (unitControl && unitControl.$el) {
-        const inputElement = this.$$(unitControl.$el).find('input')
-        this.initializeAutocompleteUnit(inputElement)
+      return this.oldGroupDimension !== this.dimension
+    },
+    unitChanged () {
+      return this.oldGroupUnit && this.item.unit && this.oldGroupUnit !== this.item.unit
+    },
+    revertDimensionChange () {
+      if (!this.oldGroupDimension) {
+        this.groupType = 'Number'
+        this.$set(this.item, 'unit', '')
+      } else {
+        this.groupType = 'Number:' + this.oldGroupDimension
+        this.$set(this.item, 'unit', this.oldGroupUnit)
       }
-      this.$set(this.item, 'stateDescriptionPattern', '%.0f %unit%')
+      this.initializeAutocompleteGroupUnit(this.groupDimension)
     },
-    initializeAutocompleteUnit (inputElement, dimension) {
-      if (this.unitAutocomplete) {
-        this.$f7.autocomplete.destroy(this.unitAutocomplete)
+    getStateDescription () {
+      return this.item.stateDescriptionPattern ? this.item.stateDescriptionPattern : '%.0f %unit%'
+    },
+    initializeAutocompleteGroupUnit (dimension) {
+      const unitControl = this.$refs.groupUnit
+      if (!(unitControl && unitControl.$el)) {
+        return
       }
-      // item.unit can be set to unitHint from channel type, make sure it is at beginning of list
-      let curatedUnits = [...new Set([this.item.unit].concat(this.getUnitList(dimension.name)))]
-      let allUnits = this.getFullUnitList(dimension.name)
-      this.unitAutocomplete = this.$f7.autocomplete.create({
+      const inputElement = this.$$(unitControl.$el).find('input')
+      if (this.groupUnitAutocomplete) {
+        this.$f7.autocomplete.destroy(this.groupUnitAutocomplete)
+        this.$set(this, 'groupUnitAutocomplete', '')
+      }
+      if (!dimension) return
+
+      let curatedUnits = this.getUnitList(dimension)
+      let allUnits = this.getFullUnitList(dimension)
+      this.groupUnitAutocomplete = this.$f7.autocomplete.create({
         inputEl: inputElement,
         openIn: 'dropdown',
-        typeahead: true,
+        dropdownPlaceHolderText: this.getUnitHint(dimension),
         source (query, render) {
           if (!query || !query.length) {
           // Render curated list by default
             render(curatedUnits)
           } else {
-            // First filter on curated list
             let units = curatedUnits.filter(u => u.indexOf(query) >= 0)
-            if (!units.length) {
+            if (units.length) {
+              // Show full curated list if in curated list
+              render(curatedUnits)
+            } else {
               // If no match filter on full list
-              units = allUnits.filter(u => u.indexOf(query) >= 0)
+              render(allUnits.filter(u => u.indexOf(query) >= 0))
             }
-            render(units)
           }
         }
       })
-    },
-    setFunction (key) {
-      if (!key) {
-        delete this.item.function
-        return
-      }
-      this.$set(this.item, 'functionKey', key)
-      const splitted = key.split('_')
-      let func = {
-        name: splitted[0]
-      }
-      if (splitted.length > 1) {
-        func.params = [splitted[1], splitted[2]]
-      }
-      this.$set(this.item, 'function', func)
+    }
+  },
+  mounted () {
+    if (!this.createMode && this.groupDimension) {
+      this.$set(this, 'oldGroupDimension', this.groupDimension)
+      this.$set(this, 'oldGroupUnit', this.groupUnit)
     }
   },
   beforeDestroy () {
-    if (this.unitAutocomplete) {
-      this.$f7.autocomplete.destroy(this.unitAutocomplete)
+    if (this.groupUnitAutocomplete) {
+      this.$f7.autocomplete.destroy(this.groupUnitAutocomplete)
+      this.$set(this, 'groupUnitAutocomplete', '')
     }
   }
 }
diff --git a/bundles/org.openhab.ui/web/src/components/item/item-form.vue b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
index a96208cac2..3bc6801d36 100644
--- a/bundles/org.openhab.ui/web/src/components/item/item-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
@@ -12,7 +12,7 @@
       <f7-list-group v-if="itemType && !hideType">
         <!-- Type -->
         <f7-list-item v-if="itemType && !hideType" title="Type" class="aligned-smart-select" :disabled="!editable" :key="'type-' + itemType" smart-select :smart-select-params="{searchbar: true, openIn: 'popup', closeOnSelect: true}">
-          <select name="select-type" @change="item.type = $event.target.value">
+          <select name="select-type" @change="itemType = $event.target.value">
             <option v-for="t in types.ItemTypes" :key="t" :value="t" :selected="t === itemType">
               {{ t }}
             </option>
@@ -29,26 +29,27 @@
         </f7-list-item>
         <!-- (Internal) Unit & State Description -->
         <!-- Use v-show instead of v-if, because otherwise the autocomplete for category would take over the unit -->
-        <f7-list-input v-show="itemDimension"
+        <f7-list-input v-show="itemDimension && unitsReady"
                        ref="unit"
                        label="Unit"
                        type="text"
-                       :info="(createMode) ? 'Type any valid unit or select from one of the proposed (non-exhaustive list of) units. Used internally, for persistence and external systems. It is independent from the state visualization in the UI, which is defined through the state description.' : ''"
+                       :info="(createMode) ? 'Type any valid unit for the dimension or select from one of the proposed units. Used internally, for persistence and external systems. \
+                                              It is independent from the state visualization in the UI, which is defined through the state description pattern.' : ''"
                        :disabled="!editable"
-                       :value="item.unit"
-                       @input="item.unit = $event.target.value"
+                       :value="itemDimension ? unit : ''"
+                       @change="itemUnit = $event.target.value"
                        :clear-button="editable" />
         <f7-list-input v-show="itemDimension"
                        label="State Description Pattern"
                        type="text"
                        :info="(createMode) ? 'Pattern or transformation applied to the state for display purposes. Only saved if you change the pre-filled default value.' : ''"
                        :disabled="!editable"
-                       :value="item.stateDescriptionPattern"
+                       :value="getStateDescription()"
                        @input="item.stateDescriptionPattern = $event.target.value"
                        :clear-button="editable" />
 
         <!-- Group Item Form -->
-        <group-form v-if="itemType === 'Group'" :item="item" :createMode="createMode" />
+        <group-form ref="groupForm" v-if="itemType === 'Group'" :item="item" :createMode="createMode" />
       </f7-list-group>
       <f7-list-group v-if="!hideCategory">
         <f7-list-input ref="category" label="Category" autocomplete="off" type="text" placeholder="temperature, firstfloor..." :value="item.category"
@@ -112,7 +113,9 @@ export default {
       unitAutocomplete: null,
       categoryInputId: '',
       categoryAutocomplete: null,
-      nameErrorMessage: ''
+      nameErrorMessage: '',
+      oldItemDimension: '',
+      oldItemUnit: ''
     }
   },
   computed: {
@@ -122,67 +125,129 @@ export default {
     numberOfGroups () {
       return this.item.groupNames?.length.toString() || '0'
     },
-    itemType () {
-      return this.item.type.split(':')[0]
+    itemType: {
+      get () {
+        return this.item.type.split(':')[0]
+      },
+      set (newType) {
+        if (!this.createMode) {
+          this.$set(this, 'oldItemDimension', this.itemDimension)
+        }
+        this.$set(this.item, 'type', newType)
+      }
+    },
+    itemDimension: {
+      get () {
+        const parts = this.item.type.split(':')
+        return parts.length > 1 ? parts[1] : ''
+      },
+      set (newDimension) {
+        if (!this.createMode) {
+          this.$set(this, 'oldItemDimension', this.itemDimension)
+        }
+        if (!newDimension) {
+          this.$set(this.item, 'type', 'Number')
+          return
+        }
+        const dimension = this.dimensions.find((d) => d.name === newDimension)
+        this.$set(this.item, 'type', 'Number:' + dimension.name)
+        this.itemUnit = (this.unitHint ? this.unitHint : this.getUnitHint(dimension.name))
+        this.$set(this.item, 'stateDescription', this.getStateDescription())
+        this.$nextTick(() => this.initializeAutocompleteUnit(this.itemDimension))
+      }
     },
-    itemDimension () {
-      const parts = this.item.type.split(':')
-      return parts.length > 1 ? parts[1] : ''
+    itemUnit: {
+      get () {
+        return this.unit
+      },
+      set (newUnit) {
+        if (!this.createMode) {
+          this.$set(this, 'oldItemUnit', this.unit)
+        }
+        this.$set(this.item, 'unit', newUnit)
+      }
     }
   },
+  /*
   watch: {
     // Required for pre-filling unit and state description pattern fields in "Add Items from Thing" functionality
-    dimensions () {
+    unitsReady () {
       if (this.createMode && this.item.type && this.item.type.startsWith('Number:')) {
-        this.setDimension(this.item.type.split(':')[1])
+        this.itemDimension = this.item.type.split(':')[1]
       }
     }
   },
+  */
   methods: {
-    setDimension (newDimension) {
-      if (!newDimension) {
-        this.$set(this.item, 'type', 'Number')
+    dimensionChanged () {
+      if (this.$refs.groupForm && this.$refs.groupForm.dimensionChanged()) return true
+      if (!this.oldItemDimension) return false
+      return this.oldItemDimension !== this.dimension
+    },
+    unitChanged () {
+      if (this.$refs.groupForm && this.$refs.groupForm.unitChanged()) return true
+      return this.oldItemUnit && this.item.unit && this.oldItemUnit !== this.item.unit
+    },
+    revertDimensionChange () {
+      if (this.itemType === 'Group') {
+        this.$refs.groupForm.revertDimensionChange()
         return
       }
-      const dimension = this.dimensions.find((d) => d.name === newDimension)
-      this.$set(this.item, 'type', 'Number:' + dimension.name)
-      this.$set(this.item, 'unit', this.unitHint ? this.unitHint : this.getUnitHint(dimension.name))
-      const unitControl = this.$refs.unit
-      if (unitControl && unitControl.$el) {
-        const inputElement = this.$$(unitControl.$el).find('input')
-        this.initializeAutocompleteUnit(inputElement, dimension)
+      if (!this.oldItemDimension) {
+        this.$set(this.item, 'type', 'Number')
+        this.$set(this.item, 'unit', '')
+      } else {
+        this.$set(this.item, 'type', 'Number:' + this.oldItemDimension)
+        this.$set(this.item, 'unit', this.oldItemUnit)
       }
-      this.$set(this.item, 'stateDescriptionPattern', '%.0f %unit%')
+      this.initializeAutocompleteUnit(this.itemDimension)
+    },
+    getStateDescription () {
+      return this.item.stateDescriptionPattern ? this.item.stateDescriptionPattern : '%.0f %unit%'
     },
-    initializeAutocompleteUnit (inputElement, dimension) {
+    initializeAutocompleteUnit (dimension) {
+      const unitControl = this.$refs.unit
+      if (!(unitControl && unitControl.$el)) {
+        return
+      }
+      const inputElement = this.$$(unitControl.$el).find('input')
       if (this.unitAutocomplete) {
         this.$f7.autocomplete.destroy(this.unitAutocomplete)
+        this.$set(this, 'unitAutocomplete', '')
       }
+      if (!dimension) return
+
       // item.unit can be set to unitHint from channel type, make sure it is at beginning of list
-      let curatedUnits = [...new Set([this.item.unit].concat(this.getUnitList(dimension.name)))]
-      let allUnits = this.getFullUnitList(dimension.name)
+      let curatedUnits = this.getUnitList(dimension)
+      if (this.item.unit) {
+        curatedUnits = [...new Set([this.item.unit].concat(curatedUnits))]
+      }
+      let allUnits = this.getFullUnitList(dimension)
       this.unitAutocomplete = this.$f7.autocomplete.create({
         inputEl: inputElement,
         openIn: 'dropdown',
-        typeahead: true,
-        dropdownPlaceHolderText: this.getUnitHint(dimension.name),
+        dropdownPlaceHolderText: this.getUnitHint(dimension),
         source (query, render) {
           if (!query || !query.length) {
           // Render curated list by default
             render(curatedUnits)
           } else {
-            // First filter on curated list
             let units = curatedUnits.filter(u => u.indexOf(query) >= 0)
-            if (!units.length) {
+            if (units.length) {
+              // Show full curated list if in curated list
+              render(curatedUnits)
+            } else {
               // If no match filter on full list
-              units = allUnits.filter(u => u.indexOf(query) >= 0)
+              render(allUnits.filter(u => u.indexOf(query) >= 0))
             }
-            render(units)
           }
         }
       })
     },
-    initializeAutocompleteCategory (inputElement) {
+    initializeAutocompleteCategory () {
+      const categoryControl = this.$refs.category
+      if (!categoryControl || !categoryControl.$el) return
+      const inputElement = this.$$(categoryControl.$el).find('input')
       this.categoryAutocomplete = this.$f7.autocomplete.create({
         inputEl: inputElement,
         openIn: 'dropdown',
@@ -209,6 +274,16 @@ export default {
   },
   mounted () {
     if (!this.item) return
+    if (!this.item.category) this.$set(this.item, 'category', '')
+    if (!this.item.groupNames) this.$set(this.item, 'groupNames', [])
+    if (this.createMode) {
+      if (!this.items) this.items = []
+      this.$set(this, 'nameErrorMessage', this.validateItemName(this.item.name))
+    }
+    if (!this.createMode && this.itemDimension) {
+      this.$set(this, 'oldItemDimension', this.itemDimension)
+      this.$set(this, 'oldItemUnit', this.itemUnit)
+    }
     const categoryControl = this.$refs.category
     if (categoryControl && categoryControl.$el) {
       const inputElement = this.$$(categoryControl.$el).find('input')
@@ -218,9 +293,11 @@ export default {
   beforeDestroy () {
     if (this.unitAutocomplete) {
       this.$f7.autocomplete.destroy(this.unitAutocomplete)
+      this.$set(this, 'unitAutocomplete', '')
     }
     if (this.categoryAutocomplete) {
       this.$f7.autocomplete.destroy(this.categoryAutocomplete)
+      this.$set(this, 'categoryAutocomplete', '')
     }
   }
 }
diff --git a/bundles/org.openhab.ui/web/src/components/item/item-mixin.js b/bundles/org.openhab.ui/web/src/components/item/item-mixin.js
index 3e860c153f..f77f3a3c31 100644
--- a/bundles/org.openhab.ui/web/src/components/item/item-mixin.js
+++ b/bundles/org.openhab.ui/web/src/components/item/item-mixin.js
@@ -62,7 +62,7 @@ export default {
       // TODO: Add support for saving metadata
       return this.$oh.api.put('/rest/items/' + item.name, item).then(() => {
         // Save unit metadata if Item is an UoM Item
-        if (this.createMode && (item.type.startsWith('Number:') || item.groupType?.startsWith('Number:')) && unit) {
+        if ((item.type.startsWith('Number:') || item.groupType?.startsWith('Number:')) && unit) {
           const metadata = {
             value: unit,
             config: {}
diff --git a/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js b/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
index f6979a1c94..8740f38c13 100644
--- a/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
+++ b/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
@@ -3,8 +3,9 @@ import * as Units from '@/assets/units.js'
 export default {
   data () {
     return {
-      measurementSystem: 'SI',
-      dimensions: []
+      measurementSystem: '',
+      dimensions: [],
+      dimensionsReady: false
     }
   },
   created () {
@@ -19,28 +20,56 @@ export default {
           systemUnit: d.systemUnit
         })
       })
-    })
+    }).then(this.dimensionsReady = true)
+  },
+  computed: {
+    unitsReady () {
+      const ready = this.measurementSystem && this.dimensionsReady
+      if (!ready) return false
+      if (this.item.type === 'Group') {
+        this.initializeAutocompleteGroupUnit(this.groupDimension)
+      } else {
+        this.initializeAutocompleteUnit(this.itemDimension)
+      }
+      return true
+    },
+    unit () {
+      if (!this.unitsReady) return ''
+      return this.item.unit ? this.item.unit : (this.createMode ? this.getUnitHint(this.dimension) : this.configuredUnit)
+    },
+    configuredUnit () {
+      if (this.item.unitSymbol) return this.item.unitSymbol
+      if (!this.unitsReady) return ''
+      return this.item.type === 'Group' ? this.systemUnit(this.groupDimension) : this.systemUnit(this.itemDimension)
+    },
+    dimension () {
+      const parts = this.item.type === 'Group' ? this.item.groupType?.split(':') : this.item.type?.split(':')
+      return parts && parts.length > 1 ? parts[1] : ''
+    }
   },
   methods: {
+    systemUnit (dimension) {
+      return this.dimensions.find(d => d.name === dimension)?.systemUnit
+    },
     getUnitHint (dimension, channelType) {
       const units = ((channelType && channelType.unitHint) ? channelType.unitHint : '').split(',')
-      let unit = (this.measurementSystem === 'US' && units.length > 1) ? units[1].trim() : units[0].trim()
-      if (!unit) {
+      let unitHint = (this.measurementSystem === 'US' && units.length > 1) ? units[1].trim() : units[0].trim()
+      if (!unitHint) {
         const unitCurated = Units.Units.find(u => u.dimension === dimension)
         if (unitCurated) {
           if (this.measurementSystem === 'SI' && unitCurated.defaultSI) {
-            unit = unitCurated.defaultSI
+            unitHint = unitCurated.defaultSI
           } else if (this.measurementSystem === 'US' && unitCurated.defaultUS) {
-            unit = unitCurated.defaultUS
+            unitHint = unitCurated.defaultUS
           } else if (unitCurated.default) {
-            unit = unitCurated.default
+            unitHint = unitCurated.default
           }
         }
       }
-      if (!unit) {
-        unit = this.dimensions.find(d => d.name === dimension).systemUnit
+      if (!unitHint) {
+        unitHint = this.systemUnit(dimension)
       }
-      return unit
+      return unitHint
     },
     getUnitList (dimension) {
       let unitList = []
@@ -63,8 +92,8 @@ export default {
           unitList = unitList.concat(unitCurated.unitsSI)
         }
       }
-      const systemUnit = this.dimensions.find(d => d.name === dimension).systemUnit
-      if (!unitList.includes(systemUnit)) {
+      const systemUnit = this.systemUnit(dimension)
+      if (systemUnit && !unitList.includes(systemUnit)) {
         unitList = [systemUnit].concat(unitList)
       }
       // remove duplicates
diff --git a/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue b/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue
index 6a1c789f8b..7adfd53095 100644
--- a/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue
+++ b/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue
@@ -48,7 +48,7 @@
                               @channel-updated="(e) => $emit('channels-updated', e)" />
               </template>
               <template #default="{ channelType, channel }" v-else-if="multipleLinksMode">
-                <item-form v-if="isChecked(channel)" :item="newItem(channel)" :items="items" :createMode="true" :channel="channel" :checked="isChecked(channel)" :unitHint="unit(channel, channelType)" />
+                <item-form v-if="isChecked(channel)" :item="newItem(channel)" :items="items" :createMode="true" :channel="channel" :checked="isChecked(channel)" :unitHint="getUnitHint(channel, channelType)" />
               </template>
               <!-- <channel-link #default="{ channelId }" /> -->
             </channel-group>
@@ -199,13 +199,13 @@ export default {
           label: channel.label || channelType.label,
           category: (channelType) ? channelType.category : '',
           type: channel.itemType,
-          unit: this.unit(channel, channelType),
+          unit: this.channelUnit(channel, channelType),
           tags: (defaultTags.find((t) => this.$store.getters.semanticClasses.Points.indexOf(t) >= 0)) ? defaultTags : [...defaultTags, 'Point']
         }
         this.newItems.push(newItem)
       }
     },
-    unit (channel, channelType) {
+    channelUnit (channel, channelType) {
       const dimension = channel.itemType.startsWith('Number:') ? this.dimensions.find(d => d.name === channel.itemType.split(':')[1]) : ''
       return dimension ? this.getUnitHint(dimension.name, channelType) : ''
     },
diff --git a/bundles/org.openhab.ui/web/src/pages/settings/items/item-edit.vue b/bundles/org.openhab.ui/web/src/pages/settings/items/item-edit.vue
index 1467f84cac..bdd67b2f5d 100644
--- a/bundles/org.openhab.ui/web/src/pages/settings/items/item-edit.vue
+++ b/bundles/org.openhab.ui/web/src/pages/settings/items/item-edit.vue
@@ -27,7 +27,7 @@
             </div>
           </f7-col>
           <f7-col>
-            <item-form :item="item" :items="items" :createMode="createMode" />
+            <item-form ref="itemForm" :item="item" :items="items" :createMode="createMode" />
           </f7-col>
 
           <div class="flex-shrink-0 if-aurora display-flex justify-content-center">
@@ -179,6 +179,25 @@ export default {
       if (this.validateItemName(this.item.name) !== '') return this.$f7.dialog.alert('Please give the Item a valid name: ' + this.validateItemName(this.item.name)).open()
       if (!this.item.type || !this.types.ItemTypes.includes(this.item.type.split(':')[0])) return this.$f7.dialog.alert('Please give Item a valid type').open()
 
+      const dimensionChange = this.$refs.itemForm.dimensionChanged()
+      const unitChange = this.$refs.itemForm.unitChanged()
+      if (dimensionChange || unitChange) {
+        const title = 'WARNING: ' + (dimensionChange ? 'Dimension' : 'Unit') + ' Changed'
+        const text = dimensionChange ? 'Existing links to channels with dimension may no longer be valid!' : 'Changing the internal unit can corrupt your persisted data!'
+        return this.$f7.dialog.create({
+          title: title,
+          text: text,
+          buttons: [
+            { text: 'Cancel', color: 'gray', close: true, onClick: () => this.$refs.itemForm.revertDimensionChange() },
+            { text: 'Save Anyway', color: 'red', close: true, onClick: () => this.saveConfirmed() }
+          ],
+          destroyOnClose: true
+        }).open()
+      } else {
+        this.saveConfirmed()
+      }
+    },
+    saveConfirmed () {
       this.saveItem(this.item).then(() => {
         if (this.createMode) {
           this.$f7.toast.create({
diff --git a/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue b/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue
index 5cc37cfd17..3537f013d6 100644
--- a/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue
+++ b/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue
@@ -43,7 +43,7 @@
 
         <!-- Create new item -->
         <f7-col v-else>
-          <item-form :item="newItem" :items="items" :createMode="true" :unitHint="unit()" />
+          <item-form ref="itemForm" :item="newItem" :items="items" :createMode="true" :unitHint="linkUnit()" />
         </f7-col>
       </template>
 
@@ -199,11 +199,11 @@ export default {
         category: (this.channelType) ? this.channelType.category : '',
         groupNames: [],
         type: this.channel.itemType || 'Switch',
-        unit: this.unit(),
+        unit: this.linkUnit(),
         tags: (defaultTags.find((t) => this.$store.getters.semanticClasses.Points.indexOf(t) >= 0)) ? defaultTags : [...defaultTags, 'Point']
       })
     },
-    unit () {
+    linkUnit () {
       const dimension = this.channel.itemType.startsWith('Number:') ? this.dimensions.find(d => d.name === this.channel.itemType.split(':')[1]) : ''
       return dimension ? this.getUnitHint(dimension.name, this.channelType) : ''
     },

From a0e3db57b77238272d56377b9d95e0da0420e513 Mon Sep 17 00:00:00 2001
From: Mark Herwege <mark.herwege@telenet.be>
Date: Fri, 1 Mar 2024 11:06:39 +0100
Subject: [PATCH 14/24] fixes

Signed-off-by: Mark Herwege <mark.herwege@telenet.be>
---
 .../web/src/components/item/group-form.vue           |  4 ++--
 .../web/src/components/item/item-form.vue            | 12 +-----------
 2 files changed, 3 insertions(+), 13 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/components/item/group-form.vue b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
index c9f3d5371c..221e8da083 100644
--- a/bundles/org.openhab.ui/web/src/components/item/group-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="group-form no-padding">
     <!-- Type -->
-    <f7-list-item v-if="item.type === 'Group'" :disabled="!editable" title="Members Base Type" class="align-popup-list-item" smart-select :smart-select-params="{searchbar: true, openIn: 'popup', closeOnSelect: true}">
+    <f7-list-item v-if="item.type === 'Group'" :disabled="!editable" title="Members Base Type" class="aligned-smart-select" smart-select :smart-select-params="{searchbar: true, openIn: 'popup', closeOnSelect: true}">
       <select name="select-basetype" @change="groupType = $event.target.value">
         <option v-for="type in types.GroupTypes" :key="type" :value="type" :selected="item.groupType ? type === item.groupType : false">
           {{ type }}
@@ -9,7 +9,7 @@
       </select>
     </f7-list-item>
     <!-- Dimension -->
-    <f7-list-item v-if="dimensions.length && item.groupType && item.groupType.startsWith('Number')" :disabled="!editable" title="Dimension" class="align-popup-list-item" smart-select :smart-select-params="{searchbar: true, openIn: 'popup', closeOnSelect: true}">
+    <f7-list-item v-if="dimensions.length && item.groupType && item.groupType.startsWith('Number')" :disabled="!editable" title="Dimension" class="aligned-smart-select" smart-select :smart-select-params="{searchbar: true, openIn: 'popup', closeOnSelect: true}">
       <select name="select-dimension" @change="groupDimension = $event.target.value">
         <option key="" value="Number" :selected="item.type === 'Number'" />
         <option v-for="d in dimensions" :key="d.name" :value="d.name" :selected="'Number:' + d.name === item.groupType">
diff --git a/bundles/org.openhab.ui/web/src/components/item/item-form.vue b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
index 3bc6801d36..1970ac8558 100644
--- a/bundles/org.openhab.ui/web/src/components/item/item-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
@@ -20,7 +20,7 @@
         </f7-list-item>
         <!-- Dimensions -->
         <f7-list-item v-if="dimensions.length && !hideType && itemType === 'Number'" title="Dimension" class="aligned-smart-select" :disabled="!editable" :key="'dimension-' + itemDimension" smart-select :smart-select-params="{searchbar: true, openIn: 'popup', closeOnSelect: true}">
-          <select name="select-dimension" @change="setDimension($event.target.value)">
+          <select name="select-dimension" @change="itemDimension = $event.target.value">
             <option key="" value="Number" :selected="itemDimension === ''" />
             <option v-for="d in dimensions" :key="d.name" :value="d.name" :selected="d.name === itemDimension">
               {{ d.label }}
@@ -168,16 +168,6 @@ export default {
       }
     }
   },
-  /*
-  watch: {
-    // Required for pre-filling unit and state description pattern fields in "Add Items from Thing" functionality
-    unitsReady () {
-      if (this.createMode && this.item.type && this.item.type.startsWith('Number:')) {
-        this.itemDimension = this.item.type.split(':')[1]
-      }
-    }
-  },
-  */
   methods: {
     dimensionChanged () {
       if (this.$refs.groupForm && this.$refs.groupForm.dimensionChanged()) return true

From 9f64734e0131a95938532b8a1d33995505d02d21 Mon Sep 17 00:00:00 2001
From: Mark Herwege <mark.herwege@telenet.be>
Date: Fri, 1 Mar 2024 11:06:39 +0100
Subject: [PATCH 15/24] fix rebase issues

Signed-off-by: Mark Herwege <mark.herwege@telenet.be>
---
 .../web/src/components/item/group-form.vue    | 36 +++++------
 .../web/src/components/item/item-form.vue     | 62 ++++++++-----------
 2 files changed, 40 insertions(+), 58 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/components/item/group-form.vue b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
index 221e8da083..f731ef569a 100644
--- a/bundles/org.openhab.ui/web/src/components/item/group-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
@@ -24,7 +24,7 @@
                    type="text"
                    :info="(createMode) ? 'Type any valid unit for the dimension or select from one of the proposed units. Used internally, for persistence and external systems. \
                                           It is independent from the state visualization in the UI, which is defined through the state description pattern.' : ''"
-                   :value="groupDimension ? unit : ''"
+                   :value="groupDimension ? groupUnit : ''"
                    @change="groupUnit = $event.target.value" :clear-button="editable" />
     <f7-list-input v-show="groupType && groupDimension"
                    label="State Description Pattern"
@@ -80,7 +80,7 @@ export default {
         const previousAggregationFunctions = this.aggregationFunctions
         this.$set(this.item, 'groupType', '')
         if (!this.createMode) {
-          this.$set(this, 'oldGroupDimension', '')
+          this.oldGroupDimension = ''
         }
         this.$nextTick(() => {
           if (newType !== 'None') {
@@ -99,7 +99,7 @@ export default {
       },
       set (newDimension) {
         if (!this.createMode) {
-          this.$set(this, 'oldGroupDimension', this.groupDimension)
+          this.oldGroupDimension = this.groupDimension
         }
         if (!newDimension) {
           this.groupType = 'Number'
@@ -109,7 +109,6 @@ export default {
         this.$set(this.item, 'groupType', 'Number:' + dimension.name)
         this.groupUnit = this.getUnitHint(dimension.name)
         this.$set(this.item, 'stateDescriptionPattern', this.getStateDescription())
-        this.$nextTick(() => this.initializeAutocompleteGroupUnit(this.groupDimension))
       }
     },
     groupUnit: {
@@ -118,7 +117,7 @@ export default {
       },
       set (newUnit) {
         if (!this.createMode) {
-          this.$set(this, 'oldGroupUnit', this.unit)
+          this.oldGroupUnit = this.unit
         }
         this.$set(this.item, 'unit', newUnit)
       }
@@ -190,30 +189,22 @@ export default {
         this.groupType = 'Number:' + this.oldGroupDimension
         this.$set(this.item, 'unit', this.oldGroupUnit)
       }
-      this.initializeAutocompleteGroupUnit(this.groupDimension)
     },
     getStateDescription () {
       return this.item.stateDescriptionPattern ? this.item.stateDescriptionPattern : '%.0f %unit%'
     },
-    initializeAutocompleteGroupUnit (dimension) {
+    initializeAutocompleteGroupUnit () {
+      const self = this
       const unitControl = this.$refs.groupUnit
-      if (!(unitControl && unitControl.$el)) {
-        return
-      }
+      if (!unitControl || !unitControl.$el) return
       const inputElement = this.$$(unitControl.$el).find('input')
-      if (this.groupUnitAutocomplete) {
-        this.$f7.autocomplete.destroy(this.groupUnitAutocomplete)
-        this.$set(this, 'groupUnitAutocomplete', '')
-      }
-      if (!dimension) return
-
-      let curatedUnits = this.getUnitList(dimension)
-      let allUnits = this.getFullUnitList(dimension)
       this.groupUnitAutocomplete = this.$f7.autocomplete.create({
         inputEl: inputElement,
         openIn: 'dropdown',
-        dropdownPlaceHolderText: this.getUnitHint(dimension),
+        dropdownPlaceholderText: self.getUnitHint(this.dimension),
         source (query, render) {
+          let curatedUnits = self.groupDimension ? self.getUnitList(self.groupDimension) : []
+          let allUnits = self.groupDimension ? self.getFullUnitList(self.groupDimension) : []
           if (!query || !query.length) {
           // Render curated list by default
             render(curatedUnits)
@@ -233,14 +224,15 @@ export default {
   },
   mounted () {
     if (!this.createMode && this.groupDimension) {
-      this.$set(this, 'oldGroupDimension', this.groupDimension)
-      this.$set(this, 'oldGroupUnit', this.groupUnit)
+      this.oldGroupDimension = this.groupDimension
+      this.oldGroupUnit = this.groupUnit
+      this.initializeAutocompleteGroupUnit()
     }
   },
   beforeDestroy () {
     if (this.groupUnitAutocomplete) {
       this.$f7.autocomplete.destroy(this.groupUnitAutocomplete)
-      this.$set(this, 'groupUnitAutocomplete', '')
+      this.groupUnitAutocomplete = null
     }
   }
 }
diff --git a/bundles/org.openhab.ui/web/src/components/item/item-form.vue b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
index 1970ac8558..1841977d78 100644
--- a/bundles/org.openhab.ui/web/src/components/item/item-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
@@ -28,7 +28,7 @@
           </select>
         </f7-list-item>
         <!-- (Internal) Unit & State Description -->
-        <!-- Use v-show instead of v-if, because otherwise the autocomplete for category would take over the unit -->
+        <!-- Use v-show instead of v-if, because otherwise the autocomplete for unit cannot be initialized -->
         <f7-list-input v-show="itemDimension && unitsReady"
                        ref="unit"
                        label="Unit"
@@ -36,7 +36,7 @@
                        :info="(createMode) ? 'Type any valid unit for the dimension or select from one of the proposed units. Used internally, for persistence and external systems. \
                                               It is independent from the state visualization in the UI, which is defined through the state description pattern.' : ''"
                        :disabled="!editable"
-                       :value="itemDimension ? unit : ''"
+                       :value="itemDimension ? itemUnit : ''"
                        @change="itemUnit = $event.target.value"
                        :clear-button="editable" />
         <f7-list-input v-show="itemDimension"
@@ -111,7 +111,6 @@ export default {
     return {
       types,
       unitAutocomplete: null,
-      categoryInputId: '',
       categoryAutocomplete: null,
       nameErrorMessage: '',
       oldItemDimension: '',
@@ -131,7 +130,7 @@ export default {
       },
       set (newType) {
         if (!this.createMode) {
-          this.$set(this, 'oldItemDimension', this.itemDimension)
+          this.oldItemDimension = this.itemDimension
         }
         this.$set(this.item, 'type', newType)
       }
@@ -143,7 +142,7 @@ export default {
       },
       set (newDimension) {
         if (!this.createMode) {
-          this.$set(this, 'oldItemDimension', this.itemDimension)
+          this.oldItemDimension = this.itemDimension
         }
         if (!newDimension) {
           this.$set(this.item, 'type', 'Number')
@@ -153,7 +152,6 @@ export default {
         this.$set(this.item, 'type', 'Number:' + dimension.name)
         this.itemUnit = (this.unitHint ? this.unitHint : this.getUnitHint(dimension.name))
         this.$set(this.item, 'stateDescription', this.getStateDescription())
-        this.$nextTick(() => this.initializeAutocompleteUnit(this.itemDimension))
       }
     },
     itemUnit: {
@@ -162,7 +160,7 @@ export default {
       },
       set (newUnit) {
         if (!this.createMode) {
-          this.$set(this, 'oldItemUnit', this.unit)
+          this.oldItemUnit = this.unit
         }
         this.$set(this.item, 'unit', newUnit)
       }
@@ -190,34 +188,29 @@ export default {
         this.$set(this.item, 'type', 'Number:' + this.oldItemDimension)
         this.$set(this.item, 'unit', this.oldItemUnit)
       }
-      this.initializeAutocompleteUnit(this.itemDimension)
     },
     getStateDescription () {
       return this.item.stateDescriptionPattern ? this.item.stateDescriptionPattern : '%.0f %unit%'
     },
-    initializeAutocompleteUnit (dimension) {
+    initializeAutocompleteUnit () {
+      const self = this
       const unitControl = this.$refs.unit
-      if (!(unitControl && unitControl.$el)) {
-        return
-      }
+      if (!unitControl || !unitControl.$el) return
       const inputElement = this.$$(unitControl.$el).find('input')
-      if (this.unitAutocomplete) {
-        this.$f7.autocomplete.destroy(this.unitAutocomplete)
-        this.$set(this, 'unitAutocomplete', '')
-      }
-      if (!dimension) return
-
-      // item.unit can be set to unitHint from channel type, make sure it is at beginning of list
-      let curatedUnits = this.getUnitList(dimension)
-      if (this.item.unit) {
-        curatedUnits = [...new Set([this.item.unit].concat(curatedUnits))]
-      }
-      let allUnits = this.getFullUnitList(dimension)
       this.unitAutocomplete = this.$f7.autocomplete.create({
         inputEl: inputElement,
         openIn: 'dropdown',
-        dropdownPlaceHolderText: this.getUnitHint(dimension),
+        dropdownPlaceholderText: self.itemDimension ? self.getUnitHint(self.itemDimension) : '',
         source (query, render) {
+          if (!self.itemDimension) {
+            render([])
+          }
+          // item.unit can be set to unitHint from channel type, make sure it is at beginning of list
+          let curatedUnits = self.itemDimension ? self.getUnitList(self.itemDimension) : []
+          if (self.item.unit) {
+            curatedUnits = [...new Set([self.item.unit].concat(curatedUnits))]
+          }
+          let allUnits = self.itemDimension ? self.getFullUnitList(self.itemDimension) : []
           if (!query || !query.length) {
           // Render curated list by default
             render(curatedUnits)
@@ -252,7 +245,7 @@ export default {
     },
     onNameInput (event) {
       this.item.name = event.target.value
-      this.$set(this, 'nameErrorMessage', this.validateItemName(this.item.name))
+      this.thisnameErrorMessage = this.validateItemName(this.item.name)
     },
     deleteGroup (event) {
       const group = event.target.previousSibling.innerText
@@ -268,26 +261,23 @@ export default {
     if (!this.item.groupNames) this.$set(this.item, 'groupNames', [])
     if (this.createMode) {
       if (!this.items) this.items = []
-      this.$set(this, 'nameErrorMessage', this.validateItemName(this.item.name))
+      this.nameErrorMessage = this.validateItemName(this.item.name)
     }
     if (!this.createMode && this.itemDimension) {
-      this.$set(this, 'oldItemDimension', this.itemDimension)
-      this.$set(this, 'oldItemUnit', this.itemUnit)
-    }
-    const categoryControl = this.$refs.category
-    if (categoryControl && categoryControl.$el) {
-      const inputElement = this.$$(categoryControl.$el).find('input')
-      this.initializeAutocompleteCategory(inputElement)
+      this.oldItemDimension = this.itemDimension
+      this.oldItemUnit = this.itemUnit
     }
+    this.initializeAutocompleteCategory()
+    this.initializeAutocompleteUnit()
   },
   beforeDestroy () {
     if (this.unitAutocomplete) {
       this.$f7.autocomplete.destroy(this.unitAutocomplete)
-      this.$set(this, 'unitAutocomplete', '')
+      this.unitAutocomplete = null
     }
     if (this.categoryAutocomplete) {
       this.$f7.autocomplete.destroy(this.categoryAutocomplete)
-      this.$set(this, 'categoryAutocomplete', '')
+      this.categoryAutocomplete = null
     }
   }
 }

From 386208612a02ee3e5eba2a1ceb3006f97edda4b4 Mon Sep 17 00:00:00 2001
From: Mark Herwege <mark.herwege@telenet.be>
Date: Fri, 1 Mar 2024 11:06:40 +0100
Subject: [PATCH 16/24] remove unsupported units

Signed-off-by: Mark Herwege <mark.herwege@telenet.be>
---
 bundles/org.openhab.ui/web/src/assets/units.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/assets/units.js b/bundles/org.openhab.ui/web/src/assets/units.js
index 39a0be842e..4de2272172 100644
--- a/bundles/org.openhab.ui/web/src/assets/units.js
+++ b/bundles/org.openhab.ui/web/src/assets/units.js
@@ -79,8 +79,8 @@ export const Units = [{
   baseUnitsMetric: ['Ω']
 }, {
   dimension: 'Energy',
-  units: ['kWh', 'Wh', 'kVAh', 'kvarh', 'J', 'kJ', 'cal', 'kcal'],
-  baseUnitsMetric: ['Ws', 'Wh', 'VAs', 'VAh', 'vars', 'varh', 'J', 'cal']
+  units: ['kWh', 'Wh', 'J', 'kJ', 'cal', 'kcal'],
+  baseUnitsMetric: ['Ws', 'Wh', 'J', 'cal']
 }, {
   dimension: 'Force',
   units: ['N', 'kN'],

From cdc756afa885754924abc872cad2c902213bf415 Mon Sep 17 00:00:00 2001
From: Mark Herwege <mark.herwege@telenet.be>
Date: Fri, 1 Mar 2024 11:06:41 +0100
Subject: [PATCH 17/24] improvements and fixes

Signed-off-by: Mark Herwege <mark.herwege@telenet.be>
---
 .../org.openhab.ui/web/src/assets/units.js    |  4 +--
 .../web/src/components/item/group-form.vue    |  9 ++++--
 .../web/src/components/item/item-form.vue     | 24 ++++++++------
 .../web/src/components/item/uom-mixin.js      | 31 ++++++-------------
 .../org.openhab.ui/web/src/js/store/index.js  |  2 ++
 5 files changed, 35 insertions(+), 35 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/assets/units.js b/bundles/org.openhab.ui/web/src/assets/units.js
index 4de2272172..39a9fd0bcd 100644
--- a/bundles/org.openhab.ui/web/src/assets/units.js
+++ b/bundles/org.openhab.ui/web/src/assets/units.js
@@ -160,5 +160,5 @@ export const Units = [{
   baseUnitsMetric: ['m³/s', 'm³/min', 'm³/h', 'm³/d']
 }]
 
-export const prefixesMetric = ['y', 'z', 'a', 'f', 'p', 'n', 'µ', 'm', 'c', 'd', 'da', 'h', 'k', 'M', 'G', 'T', 'P', 'E', 'Z', 'Y']
-export const prefixesBinary = ['ki', 'Mi', 'Gi', 'Ti', 'Pi', 'Ei', 'Zi', 'Yi']
+export const MetricPrefixes = ['y', 'z', 'a', 'f', 'p', 'n', 'µ', 'm', 'c', 'd', 'da', 'h', 'k', 'M', 'G', 'T', 'P', 'E', 'Z', 'Y']
+export const BinaryPrefixes = ['ki', 'Mi', 'Gi', 'Ti', 'Pi', 'Ei', 'Zi', 'Yi']
diff --git a/bundles/org.openhab.ui/web/src/components/item/group-form.vue b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
index f731ef569a..74e9a11a9c 100644
--- a/bundles/org.openhab.ui/web/src/components/item/group-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
@@ -18,7 +18,7 @@
       </select>
     </f7-list-item>
     <!-- (Internal) Unit & State Description -->
-    <f7-list-input v-show="groupType && groupDimension && unitsReady"
+    <f7-list-input v-show="groupType && groupDimension && dimensionsReady"
                    ref="groupUnit"
                    label="Unit"
                    type="text"
@@ -68,6 +68,11 @@ export default {
       oldGroupUnit: ''
     }
   },
+  watch: {
+    dimensionsReady (newValue, oldValue) {
+      if (oldValue === false && newValue === true) this.initializeAutocompleteGroupUnit()
+    }
+  },
   computed: {
     editable () {
       return this.createMode || (this.item && this.item.editable)
@@ -226,7 +231,7 @@ export default {
     if (!this.createMode && this.groupDimension) {
       this.oldGroupDimension = this.groupDimension
       this.oldGroupUnit = this.groupUnit
-      this.initializeAutocompleteGroupUnit()
+      if (this.dimensionsReady) this.initializeAutocompleteGroupUnit()
     }
   },
   beforeDestroy () {
diff --git a/bundles/org.openhab.ui/web/src/components/item/item-form.vue b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
index 1841977d78..e0fa91ac80 100644
--- a/bundles/org.openhab.ui/web/src/components/item/item-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
@@ -9,9 +9,9 @@
         <f7-list-input label="Label" type="text" placeholder="Item label for display purposes" :value="item.label"
                        @input="item.label = $event.target.value" :disabled="!editable" :clear-button="editable" />
       </f7-list-group>
-      <f7-list-group v-if="itemType && !hideType">
+      <f7-list-group v-if="!hideType" v-show="itemType">
         <!-- Type -->
-        <f7-list-item v-if="itemType && !hideType" title="Type" class="aligned-smart-select" :disabled="!editable" :key="'type-' + itemType" smart-select :smart-select-params="{searchbar: true, openIn: 'popup', closeOnSelect: true}">
+        <f7-list-item title="Type" class="aligned-smart-select" :disabled="!editable" :key="'type-' + itemType" smart-select :smart-select-params="{searchbar: true, openIn: 'popup', closeOnSelect: true}">
           <select name="select-type" @change="itemType = $event.target.value">
             <option v-for="t in types.ItemTypes" :key="t" :value="t" :selected="t === itemType">
               {{ t }}
@@ -19,9 +19,9 @@
           </select>
         </f7-list-item>
         <!-- Dimensions -->
-        <f7-list-item v-if="dimensions.length && !hideType && itemType === 'Number'" title="Dimension" class="aligned-smart-select" :disabled="!editable" :key="'dimension-' + itemDimension" smart-select :smart-select-params="{searchbar: true, openIn: 'popup', closeOnSelect: true}">
+        <f7-list-item v-if="dimensions.length && itemType === 'Number'" title="Dimension" class="aligned-smart-select" :disabled="!editable" :key="'dimension-' + itemDimension" smart-select :smart-select-params="{searchbar: true, openIn: 'popup', closeOnSelect: true}">
           <select name="select-dimension" @change="itemDimension = $event.target.value">
-            <option key="" value="Number" :selected="itemDimension === ''" />
+            <option key="" value="" :selected="itemDimension === ''" />
             <option v-for="d in dimensions" :key="d.name" :value="d.name" :selected="d.name === itemDimension">
               {{ d.label }}
             </option>
@@ -29,7 +29,7 @@
         </f7-list-item>
         <!-- (Internal) Unit & State Description -->
         <!-- Use v-show instead of v-if, because otherwise the autocomplete for unit cannot be initialized -->
-        <f7-list-input v-show="itemDimension && unitsReady"
+        <f7-list-input v-show="itemDimension && dimensionsReady"
                        ref="unit"
                        label="Unit"
                        type="text"
@@ -37,8 +37,7 @@
                                               It is independent from the state visualization in the UI, which is defined through the state description pattern.' : ''"
                        :disabled="!editable"
                        :value="itemDimension ? itemUnit : ''"
-                       @change="itemUnit = $event.target.value"
-                       :clear-button="editable" />
+                       @change="itemUnit = $event.target.value" />
         <f7-list-input v-show="itemDimension"
                        label="State Description Pattern"
                        type="text"
@@ -117,6 +116,11 @@ export default {
       oldItemUnit: ''
     }
   },
+  watch: {
+    dimensionsReady (newValue, oldValue) {
+      if (oldValue === false && newValue === true) this.initializeAutocompleteUnit()
+    }
+  },
   computed: {
     editable () {
       return this.createMode || (this.item && this.item.editable)
@@ -193,6 +197,7 @@ export default {
       return this.item.stateDescriptionPattern ? this.item.stateDescriptionPattern : '%.0f %unit%'
     },
     initializeAutocompleteUnit () {
+      if (this.hideType) return
       const self = this
       const unitControl = this.$refs.unit
       if (!unitControl || !unitControl.$el) return
@@ -228,6 +233,7 @@ export default {
       })
     },
     initializeAutocompleteCategory () {
+      if (this.hideCategory) return
       const categoryControl = this.$refs.category
       if (!categoryControl || !categoryControl.$el) return
       const inputElement = this.$$(categoryControl.$el).find('input')
@@ -245,7 +251,7 @@ export default {
     },
     onNameInput (event) {
       this.item.name = event.target.value
-      this.thisnameErrorMessage = this.validateItemName(this.item.name)
+      this.$set(this, 'nameErrorMessage', this.validateItemName(this.item.name))
     },
     deleteGroup (event) {
       const group = event.target.previousSibling.innerText
@@ -268,7 +274,7 @@ export default {
       this.oldItemUnit = this.itemUnit
     }
     this.initializeAutocompleteCategory()
-    this.initializeAutocompleteUnit()
+    if (this.dimensionsReady) this.initializeAutocompleteUnit()
   },
   beforeDestroy () {
     if (this.unitAutocomplete) {
diff --git a/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js b/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
index 8740f38c13..1cefb7b7b1 100644
--- a/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
+++ b/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
@@ -1,17 +1,14 @@
-import * as Units from '@/assets/units.js'
+import { Units, MetricPrefixes, BinaryPrefixes } from '@/assets/units'
 
 export default {
   data () {
     return {
-      measurementSystem: '',
+      measurementSystem: this.$store.state.measurementSystem,
       dimensions: [],
       dimensionsReady: false
     }
   },
   created () {
-    this.$oh.api.get('/rest/').then((data) => {
-      this.measurementSystem = data.measurementSystem
-    })
     this.$oh.api.get('/rest/systeminfo/uom').then((data) => {
       data.uomInfo.dimensions.forEach((d) => {
         this.dimensions.push({
@@ -23,23 +20,13 @@ export default {
     }).then(this.dimensionsReady = true)
   },
   computed: {
-    unitsReady () {
-      const ready = this.measurementSystem && this.dimensionsReady
-      if (!ready) return false
-      if (this.item.type === 'Group') {
-        this.initializeAutocompleteGroupUnit(this.groupDimension)
-      } else {
-        this.initializeAutocompleteUnit(this.itemDimension)
-      }
-      return true
-    },
     unit () {
-      if (!this.unitsReady) return ''
+      if (!this.dimensionsReady) return ''
       return this.item.unit ? this.item.unit : (this.createMode ? this.getUnitHint(this.dimension) : this.configuredUnit)
     },
     configuredUnit () {
       if (this.item.unitSymbol) return this.item.unitSymbol
-      if (!this.unitsReady) return ''
+      if (!this.dimensionsReady) return ''
       return this.item.type === 'Group' ? this.systemUnit(this.groupDimension) : this.systemUnit(this.itemDimension)
     },
     dimension () {
@@ -55,7 +42,7 @@ export default {
       const units = ((channelType && channelType.unitHint) ? channelType.unitHint : '').split(',')
       let unitHint = (this.measurementSystem === 'US' && units.length > 1) ? units[1].trim() : units[0].trim()
       if (!unitHint) {
-        const unitCurated = Units.Units.find(u => u.dimension === dimension)
+        const unitCurated = Units.find(u => u.dimension === dimension)
         if (unitCurated) {
           if (this.measurementSystem === 'SI' && unitCurated.defaultSI) {
             unitHint = unitCurated.defaultSI
@@ -73,7 +60,7 @@ export default {
     },
     getUnitList (dimension) {
       let unitList = []
-      const unitCurated = Units.Units.find(u => u.dimension === dimension)
+      const unitCurated = Units.find(u => u.dimension === dimension)
       if (unitCurated?.units) {
         unitList = unitList.concat(unitCurated.units)
       }
@@ -102,20 +89,20 @@ export default {
     },
     getFullUnitList (dimension) {
       let unitList = []
-      const unit = Units.Units.find(u => u.dimension === dimension)
+      const unit = Units.find(u => u.dimension === dimension)
       let units = unit?.baseUnits
       if (units) {
         unitList = unitList.concat(units)
       }
       let metricUnits = unit?.baseUnitsMetric?.flatMap(
-        u => Units.prefixesMetric.map(
+        u => MetricPrefixes.map(
           p => p.concat(u)
         ))
       if (metricUnits) {
         unitList = unitList.concat(metricUnits)
       }
       let binaryUnits = unit?.baseUnitsBinary?.flatMap(
-        u => Units.prefixesBinary.map(
+        u => BinaryPrefixes.map(
           p => p.concat(u)
         ))
       if (binaryUnits) {
diff --git a/bundles/org.openhab.ui/web/src/js/store/index.js b/bundles/org.openhab.ui/web/src/js/store/index.js
index 5bbef66241..a06f9bd61b 100644
--- a/bundles/org.openhab.ui/web/src/js/store/index.js
+++ b/bundles/org.openhab.ui/web/src/js/store/index.js
@@ -20,6 +20,7 @@ const store = new Vuex.Store({
   },
   state: {
     apiVersion: null,
+    measurementSystem: null,
     apiEndpoints: null,
     locale: null,
     runtimeInfo: null,
@@ -34,6 +35,7 @@ const store = new Vuex.Store({
   mutations: {
     setRootResource (state, { rootResponse }) {
       state.apiVersion = rootResponse.version
+      state.measurementSystem = rootResponse.measurementSystem
       state.runtimeInfo = rootResponse.runtimeInfo
       state.apiEndpoints = rootResponse.links
       state.websiteUrl = `https://${rootResponse.runtimeInfo?.buildString !== 'Release Build' ? 'next' : 'www'}.openhab.org`

From db282b4566656a29d38f815be78b2dcc960f6bc4 Mon Sep 17 00:00:00 2001
From: Mark Herwege <mark.herwege@telenet.be>
Date: Fri, 1 Mar 2024 11:06:42 +0100
Subject: [PATCH 18/24] review improvements

Signed-off-by: Mark Herwege <mark.herwege@telenet.be>
---
 .../web/src/components/item/item-form.vue     | 23 +++++++------------
 .../web/src/components/item/item-mixin.js     |  3 ++-
 .../web/src/components/item/uom-mixin.js      |  8 +++----
 .../web/src/components/thing/channel-list.vue |  2 +-
 .../src/pages/settings/items/item-edit.vue    |  8 +++----
 .../pages/settings/things/link/link-add.vue   |  2 +-
 6 files changed, 20 insertions(+), 26 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/components/item/item-form.vue b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
index e0fa91ac80..0e4ee18e97 100644
--- a/bundles/org.openhab.ui/web/src/components/item/item-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
@@ -51,10 +51,10 @@
         <group-form ref="groupForm" v-if="itemType === 'Group'" :item="item" :createMode="createMode" />
       </f7-list-group>
       <f7-list-group v-if="!hideCategory">
-        <f7-list-input ref="category" label="Category" autocomplete="off" type="text" placeholder="temperature, firstfloor..." :value="item.category"
-                       @input="item.category = $event.target.value" :disabled="!editable" :clear-button="editable">
+        <f7-list-input ref="category" label="Category" autocomplete="off" type="text" placeholder="temperature, firstfloor..." :value="itemCategory"
+                       @input="itemCategory = $event.target.value" :disabled="!editable" :clear-button="editable">
           <div slot="root-end" style="margin-left: calc(35% + 14px)">
-            <oh-icon :icon="item.category" :state="(createMode) ? null : item.state" height="32" width="32" />
+            <oh-icon :icon="itemCategory" :state="(createMode) ? null : item.state" height="32" width="32" />
           </div>
         </f7-list-input>
       </f7-list-group>
@@ -112,8 +112,8 @@ export default {
       unitAutocomplete: null,
       categoryAutocomplete: null,
       nameErrorMessage: '',
-      oldItemDimension: '',
-      oldItemUnit: ''
+      oldItemDimension: (!this.createMode && this.item.type.split(':').length > 1) ? this.item.type.split(':')[1] : '',
+      oldItemUnit: !this.createMode ? (this.unit || '') : ''
     }
   },
   watch: {
@@ -168,6 +168,9 @@ export default {
         }
         this.$set(this.item, 'unit', newUnit)
       }
+    },
+    itemCategory () {
+      return this.item.category || ''
     }
   },
   methods: {
@@ -263,16 +266,6 @@ export default {
   },
   mounted () {
     if (!this.item) return
-    if (!this.item.category) this.$set(this.item, 'category', '')
-    if (!this.item.groupNames) this.$set(this.item, 'groupNames', [])
-    if (this.createMode) {
-      if (!this.items) this.items = []
-      this.nameErrorMessage = this.validateItemName(this.item.name)
-    }
-    if (!this.createMode && this.itemDimension) {
-      this.oldItemDimension = this.itemDimension
-      this.oldItemUnit = this.itemUnit
-    }
     this.initializeAutocompleteCategory()
     if (this.dimensionsReady) this.initializeAutocompleteUnit()
   },
diff --git a/bundles/org.openhab.ui/web/src/components/item/item-mixin.js b/bundles/org.openhab.ui/web/src/components/item/item-mixin.js
index f77f3a3c31..9f904937bc 100644
--- a/bundles/org.openhab.ui/web/src/components/item/item-mixin.js
+++ b/bundles/org.openhab.ui/web/src/components/item/item-mixin.js
@@ -44,8 +44,9 @@ export default {
     },
     /**
      * Save an Item, i.e. add a new Item or update an existing Item.
+     * Unit metadata is saved as well for a UoM Item.
      *
-     * If a new Item is created (checks `this.createMode`), and it is an UoM Item, unit metadata and state description (if changed from the default) metadata are saved as well.
+     * If a new Item is created (checks `this.createMode`), and it is an UoM Item, state description (if changed from the default) metadata are saved as well.
      *
      * @param item
      * @returns {Promise}
diff --git a/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js b/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
index 1cefb7b7b1..4d8df55b0b 100644
--- a/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
+++ b/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
@@ -27,7 +27,7 @@ export default {
     configuredUnit () {
       if (this.item.unitSymbol) return this.item.unitSymbol
       if (!this.dimensionsReady) return ''
-      return this.item.type === 'Group' ? this.systemUnit(this.groupDimension) : this.systemUnit(this.itemDimension)
+      return this.item.type === 'Group' ? this.getSystemUnit(this.groupDimension) : this.getSystemUnit(this.itemDimension)
     },
     dimension () {
       const parts = this.item.type === 'Group' ? this.item.groupType?.split(':') : this.item.type?.split(':')
@@ -35,7 +35,7 @@ export default {
     }
   },
   methods: {
-    systemUnit (dimension) {
+    getSystemUnit (dimension) {
       return this.dimensions.find(d => d.name === dimension)?.systemUnit
     },
     getUnitHint (dimension, channelType) {
@@ -54,7 +54,7 @@ export default {
         }
       }
       if (!unitHint) {
-        unitHint = this.systemUnit(dimension)
+        unitHint = this.getSystemUnit(dimension)
       }
       return unitHint
     },
@@ -79,7 +79,7 @@ export default {
           unitList = unitList.concat(unitCurated.unitsSI)
         }
       }
-      const systemUnit = this.systemUnit(dimension)
+      const systemUnit = this.getSystemUnit(dimension)
       if (systemUnit && !unitList.includes(systemUnit)) {
         unitList = [systemUnit].concat(unitList)
       }
diff --git a/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue b/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue
index 7adfd53095..6153263a40 100644
--- a/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue
+++ b/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue
@@ -206,7 +206,7 @@ export default {
       }
     },
     channelUnit (channel, channelType) {
-      const dimension = channel.itemType.startsWith('Number:') ? this.dimensions.find(d => d.name === channel.itemType.split(':')[1]) : ''
+      const dimension = channel.itemType.startsWith('Number:') ? channel.itemType.split(':')[1] : ''
       return dimension ? this.getUnitHint(dimension.name, channelType) : ''
     },
     toggleAllChecks (checked) {
diff --git a/bundles/org.openhab.ui/web/src/pages/settings/items/item-edit.vue b/bundles/org.openhab.ui/web/src/pages/settings/items/item-edit.vue
index bdd67b2f5d..8836371e28 100644
--- a/bundles/org.openhab.ui/web/src/pages/settings/items/item-edit.vue
+++ b/bundles/org.openhab.ui/web/src/pages/settings/items/item-edit.vue
@@ -183,21 +183,21 @@ export default {
       const unitChange = this.$refs.itemForm.unitChanged()
       if (dimensionChange || unitChange) {
         const title = 'WARNING: ' + (dimensionChange ? 'Dimension' : 'Unit') + ' Changed'
-        const text = dimensionChange ? 'Existing links to channels with dimension may no longer be valid!' : 'Changing the internal unit can corrupt your persisted data!'
+        const text = dimensionChange ? 'Existing links to channels with dimension may no longer be valid!' : 'Changing the internal unit can corrupt your persisted data and affect rules!'
         return this.$f7.dialog.create({
           title: title,
           text: text,
           buttons: [
             { text: 'Cancel', color: 'gray', close: true, onClick: () => this.$refs.itemForm.revertDimensionChange() },
-            { text: 'Save Anyway', color: 'red', close: true, onClick: () => this.saveConfirmed() }
+            { text: 'Save Anyway', color: 'red', close: true, onClick: () => this.doSave() }
           ],
           destroyOnClose: true
         }).open()
       } else {
-        this.saveConfirmed()
+        this.doSave()
       }
     },
-    saveConfirmed () {
+    doSave () {
       this.saveItem(this.item).then(() => {
         if (this.createMode) {
           this.$f7.toast.create({
diff --git a/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue b/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue
index 3537f013d6..8f39380b29 100644
--- a/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue
+++ b/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue
@@ -204,7 +204,7 @@ export default {
       })
     },
     linkUnit () {
-      const dimension = this.channel.itemType.startsWith('Number:') ? this.dimensions.find(d => d.name === this.channel.itemType.split(':')[1]) : ''
+      const dimension = this.channel.itemType.startsWith('Number:') ? this.channel.itemType.split(':')[1] : ''
       return dimension ? this.getUnitHint(dimension.name, this.channelType) : ''
     },
     loadProfileTypes (channel) {

From d2eaef4f0434fd120d4f347cade6e4272f3d6ccb Mon Sep 17 00:00:00 2001
From: Florian Hotze <florianh_dev@icloud.com>
Date: Fri, 1 Mar 2024 11:55:59 +0100
Subject: [PATCH 19/24] Shorten unit field description

Signed-off-by: Florian Hotze <florianh_dev@icloud.com>
---
 bundles/org.openhab.ui/web/src/components/item/group-form.vue | 3 +--
 bundles/org.openhab.ui/web/src/components/item/item-form.vue  | 3 +--
 2 files changed, 2 insertions(+), 4 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/components/item/group-form.vue b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
index 74e9a11a9c..3541fe4bc0 100644
--- a/bundles/org.openhab.ui/web/src/components/item/group-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/group-form.vue
@@ -22,8 +22,7 @@
                    ref="groupUnit"
                    label="Unit"
                    type="text"
-                   :info="(createMode) ? 'Type any valid unit for the dimension or select from one of the proposed units. Used internally, for persistence and external systems. \
-                                          It is independent from the state visualization in the UI, which is defined through the state description pattern.' : ''"
+                   :info="(createMode) ? 'Type a valid unit for the dimension or select from the proposed units. Used internally, for persistence and external systems. Is independent from state visualization in the UI, which is defined through the state description pattern.' : ''"
                    :value="groupDimension ? groupUnit : ''"
                    @change="groupUnit = $event.target.value" :clear-button="editable" />
     <f7-list-input v-show="groupType && groupDimension"
diff --git a/bundles/org.openhab.ui/web/src/components/item/item-form.vue b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
index 0e4ee18e97..74899159a6 100644
--- a/bundles/org.openhab.ui/web/src/components/item/item-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
@@ -33,8 +33,7 @@
                        ref="unit"
                        label="Unit"
                        type="text"
-                       :info="(createMode) ? 'Type any valid unit for the dimension or select from one of the proposed units. Used internally, for persistence and external systems. \
-                                              It is independent from the state visualization in the UI, which is defined through the state description pattern.' : ''"
+                       :info="(createMode) ? 'Type a valid unit for the dimension or select from the proposed units. Used internally, for persistence and external systems. Is independent from state visualization in the UI, which is defined through the state description pattern.' : ''"
                        :disabled="!editable"
                        :value="itemDimension ? itemUnit : ''"
                        @change="itemUnit = $event.target.value" />

From bed61104c0d6116e38cffdf1f4025faa5f3c4175 Mon Sep 17 00:00:00 2001
From: Florian Hotze <florianh_dev@icloud.com>
Date: Fri, 1 Mar 2024 11:56:28 +0100
Subject: [PATCH 20/24] Add missing setter for itemCategory

Signed-off-by: Florian Hotze <florianh_dev@icloud.com>
---
 .../org.openhab.ui/web/src/components/item/item-form.vue | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/components/item/item-form.vue b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
index 74899159a6..200b80a402 100644
--- a/bundles/org.openhab.ui/web/src/components/item/item-form.vue
+++ b/bundles/org.openhab.ui/web/src/components/item/item-form.vue
@@ -168,8 +168,13 @@ export default {
         this.$set(this.item, 'unit', newUnit)
       }
     },
-    itemCategory () {
-      return this.item.category || ''
+    itemCategory: {
+      get () {
+        return this.item.category || ''
+      },
+      set (newCategory) {
+        this.$set(this.item, 'category', newCategory)
+      }
     }
   },
   methods: {

From 0e8086c7949dc480e67582b1e4ef2725a0bbc87a Mon Sep 17 00:00:00 2001
From: Florian Hotze <florianh_dev@icloud.com>
Date: Fri, 1 Mar 2024 11:56:43 +0100
Subject: [PATCH 21/24] item-mixin: Improve JSDoc

Signed-off-by: Florian Hotze <florianh_dev@icloud.com>
---
 bundles/org.openhab.ui/web/src/components/item/item-mixin.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/components/item/item-mixin.js b/bundles/org.openhab.ui/web/src/components/item/item-mixin.js
index 9f904937bc..81d91161b8 100644
--- a/bundles/org.openhab.ui/web/src/components/item/item-mixin.js
+++ b/bundles/org.openhab.ui/web/src/components/item/item-mixin.js
@@ -44,9 +44,9 @@ export default {
     },
     /**
      * Save an Item, i.e. add a new Item or update an existing Item.
-     * Unit metadata is saved as well for a UoM Item.
+     * If the Item is an UoM Item, unit metadata is saved as well.
      *
-     * If a new Item is created (checks `this.createMode`), and it is an UoM Item, state description (if changed from the default) metadata are saved as well.
+     * If a new Item is created (checks `this.createMode`), and it is an UoM Item, state description (if changed from the default) metadata is also saved.
      *
      * @param item
      * @returns {Promise}

From d073bdc750f216d3461376736e7e1c7391848735 Mon Sep 17 00:00:00 2001
From: Florian Hotze <florianh_dev@icloud.com>
Date: Fri, 1 Mar 2024 11:57:22 +0100
Subject: [PATCH 22/24] Minor fixes

Signed-off-by: Florian Hotze <florianh_dev@icloud.com>
---
 .../org.openhab.ui/web/src/components/thing/channel-list.vue    | 2 +-
 .../web/src/pages/settings/things/link/link-add.vue             | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue b/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue
index 6153263a40..413c8fb25b 100644
--- a/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue
+++ b/bundles/org.openhab.ui/web/src/components/thing/channel-list.vue
@@ -207,7 +207,7 @@ export default {
     },
     channelUnit (channel, channelType) {
       const dimension = channel.itemType.startsWith('Number:') ? channel.itemType.split(':')[1] : ''
-      return dimension ? this.getUnitHint(dimension.name, channelType) : ''
+      return dimension ? this.getUnitHint(dimension, channelType) : ''
     },
     toggleAllChecks (checked) {
       this.thing.channels.forEach((c) => {
diff --git a/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue b/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue
index 8f39380b29..cbc15303eb 100644
--- a/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue
+++ b/bundles/org.openhab.ui/web/src/pages/settings/things/link/link-add.vue
@@ -205,7 +205,7 @@ export default {
     },
     linkUnit () {
       const dimension = this.channel.itemType.startsWith('Number:') ? this.channel.itemType.split(':')[1] : ''
-      return dimension ? this.getUnitHint(dimension.name, this.channelType) : ''
+      return dimension ? this.getUnitHint(dimension, this.channelType) : ''
     },
     loadProfileTypes (channel) {
       this.ready = false

From c3faf0e1d0c08a41cf9f010d0094371b4fbcdeb2 Mon Sep 17 00:00:00 2001
From: Florian Hotze <florianh_dev@icloud.com>
Date: Fri, 1 Mar 2024 12:23:19 +0100
Subject: [PATCH 23/24] Improve/Add JSDoc

Signed-off-by: Florian Hotze <florianh_dev@icloud.com>
---
 .../org.openhab.ui/web/src/assets/units.js    | 50 ++++++++++++-------
 .../web/src/components/item/uom-mixin.js      | 21 ++++++++
 2 files changed, 54 insertions(+), 17 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/assets/units.js b/bundles/org.openhab.ui/web/src/assets/units.js
index 39a9fd0bcd..f7599f232a 100644
--- a/bundles/org.openhab.ui/web/src/assets/units.js
+++ b/bundles/org.openhab.ui/web/src/assets/units.js
@@ -1,21 +1,28 @@
-// Units defines the possible units for UI unit selection. Each unit is defined by one or more fields:
-//   dimension: required field, unit dimension
-//   units: units used in a curated shortlist of units, not specific to SI or Imperial measurement system
-//   unitsSI: units used in a curated shortlist of units, specific to the SI measurement system
-//   unitsUS: units used in a curated shortlist of units, specific to the Imperial measurement system
-//   default: default unit, to be set to override core default unit, not specific to SI or Imperial measurement system
-//   defaultSI: default unit in SI measurement system, to be set to override OH core default SI unit
-//   defaultUS: default unit in Imperial measurement system, to be set to override OH core default Imperial unit
-//   baseUnits: all supported base units that don't allow metric or binary prefixes
-//   baseUnitsMetric: metric base units, the full list of units will include all of these with all metric prefixes
-//   baseUnitsBinary: binary base units, the full list of units will include all of these with all binary prefixes
-// If nothing is defined for an allowed dimension, the UI will fall back on the OH core default unit in the configured
-// measurement system.
-// For dimensions defined, any of the fields can be ommitted. Logical defaults will be used.
-// Units from curated units lists will always be added to the full unit list constructed from baseUnits and prefixes. So it
-// is not necessary to explicitely add what is already in the curated units for the full units list. However, no prefixes
-// will be applied to these. If you want prefixes to be applied, you should add them in the respective baseUnits Array as well.
+// Units defines the possible units for UI unit selection.
+// If nothing is defined for an allowed dimension, the UI will fall back on the OH core default unit in the configured measurement system.
+// For dimensions defined, any of the fields can be omitted. Logical defaults will be used.
+// Units from curated units lists will always be added to the full unit list constructed from baseUnits and prefixes.
+// So it is not necessary to explicitly add what is already in the curated units for the full units list.
+// However, no prefixes will be applied to these. If you want prefixes to be applied, you should add them in the respective baseUnits Array as well.
 
+/**
+ * @typedef Unit
+ * @property {string} dimension unit dimension (required)
+ * @property {string[]} [units] units used in a curated shortlist of units, not specific to SI or Imperial measurement system
+ * @property {string[]} [unitsSI] units used in a curated shortlist of units, specific to the SI measurement system
+ * @property {string[]} [unitsUS] units used in a curated shortlist of units, specific to the Imperial measurement system
+ * @property {string} [default] default unit, to be set to override core default unit, not specific to SI or Imperial measurement system
+ * @property {string} [defaultsSI] default unit in SI measurement system, to be set to override OH core default SI unit
+ * @property {string} [defaultUS] default unit in Imperial measurement system, to be set to override OH core default Imperial unit
+ * @property {string[]} [baseUnits] all supported base units that don't allow metric or binary prefixes
+ * @property {string[]} [baseUnitsMetric] metric base units, the full list of units will include all of these with all metric prefixes
+ * @property {string[]} [baseUnitsBinary] binary base units, the full list of units will include all of these with all binary prefixes
+ */
+
+/**
+ * Defines the possible units for UI unit selection.
+ * @type {Unit[]}
+ */
 export const Units = [{
   dimension: 'Acceleration',
   baseUnits: ['gₙ'],
@@ -160,5 +167,14 @@ export const Units = [{
   baseUnitsMetric: ['m³/s', 'm³/min', 'm³/h', 'm³/d']
 }]
 
+/**
+ * Metric prefixes for metric base units.
+ * @type {string[]}
+ */
 export const MetricPrefixes = ['y', 'z', 'a', 'f', 'p', 'n', 'µ', 'm', 'c', 'd', 'da', 'h', 'k', 'M', 'G', 'T', 'P', 'E', 'Z', 'Y']
+
+/**
+ * Binary prefixes for binary base units.
+ * @type {string[]}
+ */
 export const BinaryPrefixes = ['ki', 'Mi', 'Gi', 'Ti', 'Pi', 'Ei', 'Zi', 'Yi']
diff --git a/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js b/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
index 4d8df55b0b..a282dd764b 100644
--- a/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
+++ b/bundles/org.openhab.ui/web/src/components/item/uom-mixin.js
@@ -20,11 +20,22 @@ export default {
     }).then(this.dimensionsReady = true)
   },
   computed: {
+    /**
+     * The unit shown in the UI when configuring the Item.
+     * It is pre-filled with the unit hint if in `createMode`, or else the {@link configuredUnit}.
+     * @returns {string}
+     */
     unit () {
+      if (!this.item) return ''
       if (!this.dimensionsReady) return ''
       return this.item.unit ? this.item.unit : (this.createMode ? this.getUnitHint(this.dimension) : this.configuredUnit)
     },
+    /**
+     * The unit currently configured and used by the openHAB server.
+     * @returns {string}
+     */
     configuredUnit () {
+      if (!this.item) return ''
       if (this.item.unitSymbol) return this.item.unitSymbol
       if (!this.dimensionsReady) return ''
       return this.item.type === 'Group' ? this.getSystemUnit(this.groupDimension) : this.getSystemUnit(this.itemDimension)
@@ -58,6 +69,11 @@ export default {
       }
       return unitHint
     },
+    /**
+     * Get the list of curated units for the given dimension.
+     * @param dimension
+     * @returns {string[]}
+     */
     getUnitList (dimension) {
       let unitList = []
       const unitCurated = Units.find(u => u.dimension === dimension)
@@ -87,6 +103,11 @@ export default {
       unitList = [...new Set(unitList)]
       return unitList
     },
+    /**
+     * Get the full list of units for the given dimensions, i.e. the curated units plus all base units with all prefixes.
+     * @param dimension
+     * @returns {string[]}
+     */
     getFullUnitList (dimension) {
       let unitList = []
       const unit = Units.find(u => u.dimension === dimension)

From 1e0547279d7adba3c7c05a386a43135564b29a08 Mon Sep 17 00:00:00 2001
From: Florian Hotze <florianh_dev@icloud.com>
Date: Fri, 1 Mar 2024 12:34:24 +0100
Subject: [PATCH 24/24] Fix wrong unit

Signed-off-by: Florian Hotze <florianh_dev@icloud.com>
---
 bundles/org.openhab.ui/web/src/assets/units.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/bundles/org.openhab.ui/web/src/assets/units.js b/bundles/org.openhab.ui/web/src/assets/units.js
index f7599f232a..1829ac1e12 100644
--- a/bundles/org.openhab.ui/web/src/assets/units.js
+++ b/bundles/org.openhab.ui/web/src/assets/units.js
@@ -47,7 +47,7 @@ export const Units = [{
   baseUnitsBinary: ['bit', 'B', 'o']
 }, {
   dimension: 'DataTransferRate',
-  units: ['bit/s', 'kbit/s', 'Mbit/s', 'GBit/s'],
+  units: ['bit/s', 'kbit/s', 'Mbit/s', 'Gbit/s'],
   baseUnitsMetric: ['bit/s'],
   baseUnitsBinary: ['bit/s']
 }, {