Added account deletion, fixed some reactivity issues

src/components/Suggestions.vue

@@ -135,8 +135,7 @@ export default {
       maxDays: this.$store.state.cache.maxDays || 60,
       isLoadingSources: false,
       isLoadingRetribute: false,
-      results: {},
-      aggregatedSuggestions: this.$store.state.cache.aggregatedSuggestions || {},
+      results: this.$store.state.cache.results || {},
       retributeProfiles: this.$store.state.cache.retributeProfiles || {},
       loadingRetributeProfiles: [],
       providers: this.$store.state.cache.providers || {},
@@ -194,24 +193,14 @@ export default {
     },
     isLoading () {
       return this.isLoadingSources || this.isLoadingRetribute
-    }
-  },
-  methods: {
-    clearCache () {
-      this.isLoadingSources = false
-      this.isLoadingRetribute = false
-      this.results = {}
-      this.providers = null
-      this.aggregatedSuggestions = {}
-      this.retributeProfiles = {}
-      this.loadingRetributeProfiles = {}
     },
-    aggregateSuggestions (results) {
+    aggregatedSuggestions () {
       const aggregated = {}
-      Object.keys(results).forEach((account) => {
-        let r = results[account]
-        if (!r.results || !r.results.accounts) {
-
+      this.accounts.forEach((accountObj) => {
+        let account = accountObj.id
+        let r = this.results[account]
+        if (!r || !r.results || !r.results.accounts) {
+          return
         } else {
           Object.keys(r.results.accounts).forEach((key) => {
             if (aggregated[key]) {
@@ -227,14 +216,18 @@ export default {
       })
       return aggregated
     },
+  },
+  methods: {
     async fetch (id) {
       let accounts
+      let self = this
       if (id) {
         accounts = this.accounts.filter((a) => {
           return a.id == id
         })
       } else {
         accounts = this.accounts
+        this.results = {}
         this.retributeProfiles = {}
         this.providers = null
         this.loadingRetributeProfiles = []
@@ -243,13 +236,14 @@ export default {
       await this.fetchProviders()
       accounts.forEach((a) => {
         let r = {isLoading: true, progress: 'indeterminate', status: ''}
-        let promise = a._source.fetch({account: a, store: this.$store, results: r, vue: this, maxDays: this.maxDays})
-        this.$set(this.results, a.id, {account: a, promise, results: r})
+        let promise = a._source.fetch({account: a, store: this.$store, results: r, vue: self, maxDays: self.maxDays})
+        self.$set(self.results, a.id, {account: a, promise, results: r})
       })
       const keys = Object.keys(this.results)
       for(let i = 0; i < keys.length; i++){
         await this.results[keys[i]].promise
       }
+      this.$forceUpdate()
       this.isLoadingSources = false
     },
     async fetchProviders () {
@@ -337,8 +331,7 @@ export default {
     },
     results: {
       handler (v) {
-        this.aggregatedSuggestions = this.aggregateSuggestions(v)
-        this.$store.commit('setRecursiveState', {key: 'cache.aggregatedSuggestions', value: this.aggregatedSuggestions})
+        this.$store.commit('setRecursiveState', {key: 'cache.results', value: this.results})
       },
       deep: true,
     },
@@ -373,12 +366,9 @@ export default {
     sortedAccounts: {
       handler (v) {
         let elems = document.querySelectorAll('.modal')
-        M.Modal.init(elems, {
-          onCloseEnd () {
-            // cf https://github.com/Dogfalo/materialize/issues/4622#issuecomment-298072452
-            document.body.style.removeProperty("overflow");
-          }
-        })
+        M.Modal.init(elems, {})
+        // cf https://github.com/Dogfalo/materialize/issues/4622#issuecomment-298072452
+        document.body.style.removeProperty("overflow");
       },
       immediate: true
     }

src/sources/funkwhale.js

 import axios from 'axios'
+import Vue from 'vue'
 import createAuthRefreshInterceptor from 'axios-auth-refresh';
 import moment from 'moment'
 import Form from '../components/FunkwhaleForm.vue'
@@ -186,7 +187,7 @@ export default {
           let mastodonDetail = get(detail, 'funkwhale', {listenings: 0})
           mastodonDetail.listenings += 1
         } else {
-          results.accounts[artistId] = {
+          Vue.set(results.accounts, artistId, {
             weight: 1,
             source: 'musicbrainz',
             id: artistId,
@@ -198,7 +199,7 @@ export default {
                 listenings: 1
               }
             }
-          }
+          })
         }
         // results.progress = Math.min(100, handledListenings / maxFavorites * 100)
       })

src/sources/mastodon.js

 import axios from 'axios'
+import Vue from 'vue'
 import moment from 'moment'
 import Form from '../components/MastodonForm.vue'
 import parseLink from 'parse-link-header'
@@ -124,7 +125,7 @@ export default {
           let mastodonDetail = get(detail, 'mastodon', {favorites: 0})
           mastodonDetail.favorites += 1
         } else {
-          results.accounts[accountId] = {
+          Vue.set(results.accounts, accountId, {
             weight: 1,
             source: 'activitypub',
             id: f.account.url,
@@ -136,7 +137,7 @@ export default {
                 favorites: 1
               }
             }
-          }
+          })
         }
         // results.progress = Math.min(100, handledFavorites / maxFavorites * 100)
       })

src/sources/peertube.js

 import axios from 'axios'
+import Vue from 'vue'
 import createAuthRefreshInterceptor from 'axios-auth-refresh';
 import moment from 'moment'
 import Form from '../components/PeerTubeForm.vue'
@@ -184,7 +185,7 @@ export default {
           detail = get(detail, 'peertube', {views: 0})
           detail.views += 1
         } else {
-          results.accounts[accountId] = {
+          Vue.set(results.accounts, accountId, {
             weight: 1,
             source: 'peertube',
             id: accountId,
@@ -196,7 +197,7 @@ export default {
                 views: 1
               }
             }
-          }
+          })
         }
         // results.progress = Math.min(100, handledViews / maxFavorites * 100)
       })

src/store.js

@@ -13,7 +13,9 @@ export const storeConfig = {
   state: {
     accounts: {},
     sources: {},
-    cache: {}
+    cache: {
+      results: {}
+    }
   },
   mutations: {
     reset (state) {
@@ -28,6 +30,9 @@ export const storeConfig = {
     },
     disconnectAccount (state, {id}) {
       Vue.delete(state.accounts, id)
+      if (state.cache.results) {
+        Vue.delete(state.cache.results, id)
+      }
     },
     setRecursiveState (state, {key, suffix, value}) {
       if (suffix) {