Minor fixes and enhancements

- Display a message when no filters are available.
- Hide the delete button in create mode.
- Pre-select everyChange as persistence strategy for new configs.
- Make all code only use the filterTypes definitions and don't rely on the existence of any filter type's array.

Signed-off-by: Florian Hotze <florianh_dev@icloud.com>

bundles/org.openhab.ui/web/src/pages/settings/persistence/configuration-popup.vue

@@ -64,7 +64,9 @@ export default {
     return {
       currentConfiguration: this.configuration || {
         items: [],
-        strategies: [],
+        strategies: [
+          'everyChange'
+        ],
         filters: []
       }
     }

bundles/org.openhab.ui/web/src/pages/settings/persistence/filter-picker.vue

@@ -1,16 +1,20 @@
 <template>
   <f7-list class="strategy-picker-container" v-if="filters">
-    <f7-list-item title="Select filters" :smart-select="disabled !== true" :smart-select-params="smartSelectParams"
+    <f7-list-item title="Select filters" :smart-select="disabled !== true && filters.length > 0"
+                  :smart-select-params="smartSelectParams"
                   ref="smartSelect" class="defaults-picker">
-      <select v-if="disabled !== true" name="filters" multiple @change="select">
+      <select v-if="disabled !== true && filters.length > 0" name="filters" multiple @change="select">
         <option v-for="s in filters" :key="s" :value="s"
                 :selected="value.includes(s)">
           {{ s }}
         </option>
       </select>
-      <div v-else>
+      <div v-else-if="disabled === true">
         {{ value.join(', ') }}
       </div>
+      <div v-else-if="disabled !== true && filters.length === 0">
+        No filters available. Please add them first.
+      </div>
     </f7-list-item>
   </f7-list>
 </template>

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

@@ -162,9 +162,9 @@
               </div>
             </div>
           </f7-col>
-          <f7-col>
+          <f7-col v-if="isEditable && !newPersistence">
             <f7-list>
-              <f7-list-button v-if="isEditable" color="red" @click="deletePersistence">
+              <f7-list-button color="red" @click="deletePersistence">
                 Remove persistence configuration
               </f7-list-button>
             </f7-list>
@@ -250,6 +250,7 @@ export default {
       currentFilter: null,
 
       predefinedStrategies: ['everyChange', 'everyUpdate', 'restoreOnStartup'],
+      // Filter configuration is completely based on these definitions, when adding new filters, no code needs to be updated.
       filterTypes: [
         {
           name: 'thresholdFilters',
@@ -413,10 +414,10 @@ export default {
             name: 'everyDay',
             cronExpression: '0 0 0 * * ?'
           }
-        ],
-        thresholdFilters: [],
-        timeFilters: []
+        ]
       }
+      // Dynamically add empty arrays for all filter types defined in the filterTypes object
+      this.filterTypes.forEach((ft) => { this.persistence[ft.name] = [] })
       this.ready = true
     },
     load () {
@@ -604,6 +605,9 @@ export default {
       // Convert comma separated string to array for equals filter
       if (filterTypeName === 'equalsFilters') filter.values = filter.values.split(',').map((v) => v.trim())
 
+      // Ensure that the filter type array exists.
+      // Even though the arrays are created when a new persistence config is initialized, we need this for existing, old configs.
+      if (!this.persistence[filterTypeName]) this.persistence[filterTypeName] = []
       this.saveModule(filterTypeName, index, filter)
     },
     deleteFilter (ev, module, index) {
@@ -645,15 +649,15 @@ export default {
       this.dirty = true
     },
     toYaml () {
-      this.persistenceYaml = YAML.stringify({
+      const toCode = {
         configurations: this.persistence.configs,
         cronStrategies: this.persistence.cronStrategies,
-        defaultStrategies: this.persistence.defaults,
-        thresholdFilters: this.persistence.thresholdFilters,
-        timeFilters: this.persistence.timeFilters,
-        equalsFilters: this.persistence.equalsFilters,
-        includeFilters: this.persistence.includeFilters
+        defaultStrategies: this.persistence.defaults
+      }
+      this.filterTypes.forEach((ft) => {
+        toCode[ft.name] = this.persistence[ft.name]
       })
+      this.persistenceYaml = YAML.stringify(toCode)
     },
     fromYaml () {
       if (!this.isEditable) return false
@@ -662,10 +666,9 @@ export default {
         this.$set(this.persistence, 'configs', updatedPersistence.configurations)
         this.$set(this.persistence, 'cronStrategies', updatedPersistence.cronStrategies)
         this.$set(this.persistence, 'defaults', updatedPersistence.defaultStrategies)
-        this.$set(this.persistence, 'thresholdFilters', updatedPersistence.thresholdFilters)
-        this.$set(this.persistence, 'timeFilters', updatedPersistence.timeFilters)
-        this.$set(this.persistence, 'equalsFilters', updatedPersistence.equalsFilters)
-        this.$set(this.persistence, 'includeFilters', updatedPersistence.includeFilters)
+        this.filterTypes.forEach((ft) => {
+          this.$set(this.persistence, ft.name, updatedPersistence[ft.name])
+        })
         return true
       } catch (e) {
         this.$f7.dialog.alert(e).open()