From 14de6174022a5c16c768be01a07f6fce49749dfb Mon Sep 17 00:00:00 2001
From: Mark Herwege <mark.herwege@telenet.be>
Date: Wed, 25 Oct 2023 16:38:44 +0200
Subject: [PATCH] addon suggestions

Signed-off-by: Mark Herwege <mark.herwege@telenet.be>
---
 .../web/src/pages/addons/addons-store.vue     | 24 +++++++--
 .../web/src/pages/wizards/setup-wizard.vue    | 52 ++++++++++---------
 2 files changed, 48 insertions(+), 28 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/pages/addons/addons-store.vue b/bundles/org.openhab.ui/web/src/pages/addons/addons-store.vue
index f55f9491a0..3de77758c6 100644
--- a/bundles/org.openhab.ui/web/src/pages/addons/addons-store.vue
+++ b/bundles/org.openhab.ui/web/src/pages/addons/addons-store.vue
@@ -49,6 +49,13 @@
     </f7-block>
     <f7-tabs>
       <f7-tab :tab-active="currentTab === 'bindings'">
+        <addons-section
+          v-if="suggestedAddons" :show-all="true"
+          @addonButtonClick="addonButtonClick"
+          :addons="suggestedAddons.filter((a) => a.type === 'binding')"
+          :show-as-cards="true"
+          :title="'Binding Suggestions'"
+          :subtitle="'Suggested bindings from network scan'" />
         <addons-section
           v-if="officialAddons"
           @addonButtonClick="addonButtonClick"
@@ -107,6 +114,13 @@
           :subtitle="'Alternative user interfaces and icon sets'" />
       </f7-tab>
       <f7-tab :tab-active="currentTab === 'other'">
+        <addons-section
+          v-if="suggestedAddons" :show-all="true"
+          @addonButtonClick="addonButtonClick"
+          :show-as-cards="true"
+          :addons="suggestedAddons.filter((a) => a.type === 'misc')"
+          :title="'System Integrations Suggestions'"
+          :subtitle="'Suggested system integrations from network scan'" />
         <addons-section
           v-if="addons && officialAddons" :show-all="true"
           @addonButtonClick="addonButtonClick"
@@ -181,19 +195,20 @@ export default {
     return {
       currentTab: this.initialTab || 'bindings',
       services: null,
+      suggestedAddons: [],
       ready: false,
       searchResults: []
     }
   },
   computed: {
     allAddons () {
-      return Object.keys(this.addons).flatMap((k) => this.addons[k])
+      return Object.keys(this.addons).flatMap((k) => this.addons[k]).filter((a) => !this.suggestedAddons.includes(a))
     },
     officialAddons () {
-      return Object.keys(this.addons).filter((k) => k === 'eclipse' || k === 'karaf').flatMap((k) => this.addons[k])
+      return Object.keys(this.addons).filter((k) => k === 'eclipse' || k === 'karaf').flatMap((k) => this.addons[k]).filter((a) => !this.suggestedAddons.includes(a))
     },
     otherAddons () {
-      return Object.keys(this.addons).filter((k) => k !== 'eclipse' && k !== 'karaf' && k !== 'marketplace').flatMap((k) => this.addons[k])
+      return Object.keys(this.addons).filter((k) => k !== 'eclipse' && k !== 'karaf' && k !== 'marketplace').flatMap((k) => this.addons[k]).filter((a) => !this.suggestedAddons.includes(a))
     }
   },
   methods: {
@@ -206,6 +221,9 @@ export default {
     },
     load () {
       this.stopEventSource()
+      this.$oh.api.get('/rest/addons/suggestions').then((data) => {
+        this.$set(this, 'suggestedAddons', data)
+      })
       this.$oh.api.get('/rest/addons/services').then((data) => {
         this.services = data
         Promise.all(this.services.map((s) => this.$oh.api.get('/rest/addons?serviceId=' + s.id))).then((data2) => {
diff --git a/bundles/org.openhab.ui/web/src/pages/wizards/setup-wizard.vue b/bundles/org.openhab.ui/web/src/pages/wizards/setup-wizard.vue
index 404d8548ab..1ba5404d2d 100644
--- a/bundles/org.openhab.ui/web/src/pages/wizards/setup-wizard.vue
+++ b/bundles/org.openhab.ui/web/src/pages/wizards/setup-wizard.vue
@@ -415,31 +415,33 @@ export default {
         this.i18nReady = true
       }
     })
-    this.$oh.api.get('/rest/addons').then((data) => {
-      this.addons = data.sort((a, b) => a.label.toUpperCase().localeCompare(b.label.toUpperCase()))
-      this.selectedAddons = this.addons.filter((a) => this.recommendedAddons.includes(a.uid) && !a.installed)
-      const self = this
-      this.autocompleteAddons = this.$f7.autocomplete.create({
-        openIn: 'popup',
-        pageTitle: this.$t('setupwizard.addons.selectAddons'),
-        searchbarPlaceholder: this.$t('setupwizard.addons.selectAddons.placeholder'),
-        openerEl: this.$refs.selectAddons,
-        multiple: true,
-        requestSourceOnOpen: true,
-        source: (query, render) => {
-          if (query.length === 0) {
-            render(self.addons.filter((a) => !a.installed).map((a) => a.label))
-          } else {
-            render(self.addons.filter((a) => !a.installed && (a.label.toLowerCase().indexOf(query.toLowerCase()) >= 0 || a.uid.toLowerCase().indexOf(query.toLowerCase()) >= 0)).map((a) => a.label))
-          }
-        },
-        on: {
-          change (value) {
-            const selected = value.map((label) => self.addons.find((a) => a.label === label))
-            self.$set(self, 'selectedAddons', selected)
-          }
-        },
-        value: this.addons.filter((a) => this.recommendedAddons.includes(a.uid)).map((a) => a.label)
+    this.$oh.api.get('/rest/addons/suggestions').then((suggestedAddons) => {
+      this.$oh.api.get('/rest/addons').then((data) => {
+        this.addons = data.sort((a, b) => a.label.toUpperCase().localeCompare(b.label.toUpperCase()))
+        this.selectedAddons = this.addons.filter((a) => (this.recommendedAddons.includes(a.uid) || suggestedAddons.includes(a.uid)) && !a.installed)
+        const self = this
+        this.autocompleteAddons = this.$f7.autocomplete.create({
+          openIn: 'popup',
+          pageTitle: this.$t('setupwizard.addons.selectAddons'),
+          searchbarPlaceholder: this.$t('setupwizard.addons.selectAddons.placeholder'),
+          openerEl: this.$refs.selectAddons,
+          multiple: true,
+          requestSourceOnOpen: true,
+          source: (query, render) => {
+            if (query.length === 0) {
+              render(self.addons.filter((a) => !a.installed).map((a) => a.label))
+            } else {
+              render(self.addons.filter((a) => !a.installed && (a.label.toLowerCase().indexOf(query.toLowerCase()) >= 0 || a.uid.toLowerCase().indexOf(query.toLowerCase()) >= 0)).map((a) => a.label))
+            }
+          },
+          on: {
+            change (value) {
+              const selected = value.map((label) => self.addons.find((a) => a.label === label))
+              self.$set(self, 'selectedAddons', selected)
+            }
+          },
+          value: this.addons.filter((a) => this.recommendedAddons.includes(a.uid) || suggestedAddons.includes(a.uid)).map((a) => a.label)
+        })
       })
     })
   }