Merge branch 'feature/who-to-follow-panel-uses-suggestions-api' into 'develop'

Who to follow panel uses suggestions api

See merge request pleroma/pleroma-fe!294

src/App.js

@@ -29,7 +29,7 @@ export default {
     style () { return { 'background-image': `url(${this.background})` } },
     sitename () { return this.$store.state.config.name },
     chat () { return this.$store.state.chat.channel.state === 'joined' },
-    showWhoToFollowPanel () { return this.$store.state.config.showWhoToFollowPanel },
+    suggestionsEnabled () { return this.$store.state.config.suggestionsEnabled },
     showInstanceSpecificPanel () { return this.$store.state.config.showInstanceSpecificPanel }
   },
   methods: {

src/App.vue

@@ -24,7 +24,7 @@
               <user-panel></user-panel>
               <nav-panel></nav-panel>
               <instance-specific-panel v-if="showInstanceSpecificPanel"></instance-specific-panel>
-              <who-to-follow-panel v-if="currentUser && showWhoToFollowPanel"></who-to-follow-panel>
+              <who-to-follow-panel v-if="currentUser && suggestionsEnabled"></who-to-follow-panel>
               <notifications v-if="currentUser"></notifications>
             </div>
           </div>

src/components/who_to_follow_panel/who_to_follow_panel.js

@@ -1,5 +1,7 @@
-function showWhoToFollow (panel, reply, aHost, aUser) {
-  var users = reply.ids
+import apiService from '../../services/api/api.service.js'
+
+function showWhoToFollow (panel, reply) {
+  var users = reply
   var cn
   var index = 0
   var random = Math.floor(Math.random() * 10)
@@ -7,12 +9,12 @@ function showWhoToFollow (panel, reply, aHost, aUser) {
     var user
     user = users[cn]
     var img
-    if (user.icon) {
-      img = user.icon
+    if (user.avatar) {
+      img = user.avatar
     } else {
       img = '/images/avi.png'
     }
-    var name = user.to_id
+    var name = user.acct
     if (index === 0) {
       panel.img1 = img
       panel.name1 = name
@@ -52,27 +54,15 @@ function showWhoToFollow (panel, reply, aHost, aUser) {
 }
 
 function getWhoToFollow (panel) {
-  var user = panel.$store.state.users.currentUser.screen_name
-  if (user) {
+  var credentials = panel.$store.state.users.currentUser.credentials
+  if (credentials) {
     panel.name1 = 'Loading...'
     panel.name2 = 'Loading...'
     panel.name3 = 'Loading...'
-    var host = window.location.hostname
-    var whoToFollowProvider = panel.$store.state.config.whoToFollowProvider
-    var url
-    url = whoToFollowProvider.replace(/{{host}}/g, encodeURIComponent(host))
-    url = url.replace(/{{user}}/g, encodeURIComponent(user))
-    window.fetch(url, {mode: 'cors'}).then(function (response) {
-      if (response.ok) {
-        return response.json()
-      } else {
-        panel.name1 = ''
-        panel.name2 = ''
-        panel.name3 = ''
-      }
-    }).then(function (reply) {
-      showWhoToFollow(panel, reply, host, user)
-    })
+    apiService.suggestions({credentials: credentials})
+      .then((reply) => {
+        showWhoToFollow(panel, reply)
+      })
   }
 }
 
@@ -95,26 +85,26 @@ const WhoToFollowPanel = {
     moreUrl: function () {
       var host = window.location.hostname
       var user = this.user
-      var whoToFollowLink = this.$store.state.config.whoToFollowLink
+      var suggestionsWeb = this.$store.state.config.suggestionsWeb
       var url
-      url = whoToFollowLink.replace(/{{host}}/g, encodeURIComponent(host))
+      url = suggestionsWeb.replace(/{{host}}/g, encodeURIComponent(host))
       url = url.replace(/{{user}}/g, encodeURIComponent(user))
       return url
     },
-    showWhoToFollowPanel () {
-      return this.$store.state.config.showWhoToFollowPanel
+    suggestionsEnabled () {
+      return this.$store.state.config.suggestionsEnabled
     }
   },
   watch: {
     user: function (user, oldUser) {
-      if (this.showWhoToFollowPanel) {
+      if (this.suggestionsEnabled) {
         getWhoToFollow(this)
       }
     }
   },
   mounted:
     function () {
-      if (this.showWhoToFollowPanel) {
+      if (this.suggestionsEnabled) {
         getWhoToFollow(this)
       }
     }

src/main.js

@@ -192,3 +192,11 @@ window.fetch('/instance/panel.html')
     store.dispatch('setOption', { name: 'instanceSpecificPanelContent', value: html })
   })
 
+window.fetch('/nodeinfo/2.0.json')
+  .then((res) => res.json())
+  .then((data) => {
+    const suggestions = data.metadata.suggestions
+    store.dispatch('setOption', { name: 'suggestionsEnabled', value: suggestions.enabled })
+    store.dispatch('setOption', { name: 'suggestionsWeb', value: suggestions.web })
+  })
+

src/services/api/api.service.js

@@ -36,6 +36,7 @@ const CHANGE_PASSWORD_URL = '/api/pleroma/change_password'
 const FOLLOW_REQUESTS_URL = '/api/pleroma/friend_requests'
 const APPROVE_USER_URL = '/api/pleroma/friendships/approve'
 const DENY_USER_URL = '/api/pleroma/friendships/deny'
+const SUGGESTIONS_URL = '/api/v1/suggestions'
 
 import { each, map } from 'lodash'
 import 'whatwg-fetch'
@@ -449,6 +450,12 @@ const fetchMutes = ({credentials}) => {
   }).then((data) => data.json())
 }
 
+const suggestions = ({credentials}) => {
+  return fetch(SUGGESTIONS_URL, {
+    headers: authHeaders(credentials)
+  }).then((data) => data.json())
+}
+
 const apiService = {
   verifyCredentials,
   fetchTimeline,
@@ -482,7 +489,8 @@ const apiService = {
   changePassword,
   fetchFollowRequests,
   approveUser,
-  denyUser
+  denyUser,
+  suggestions
 }
 
 export default apiService