commit: ea1d21aafabcddfc9975fffac12bfcfb84988709
parent: 502a76be0aa54edd23b4db58b3af90c57f0771cf
Author: HJ <spam@hjkos.com>
Date: Wed, 16 Jan 2019 02:33:08 +0000
Merge branch 'feature/show-who-to-follow-in-mobile-view' into 'develop'
Show who to follow in the mobile view
See merge request pleroma/pleroma-fe!452
Diffstat:
8 files changed, 77 insertions(+), 11 deletions(-)
diff --git a/src/boot/routes.js b/src/boot/routes.js
@@ -16,6 +16,7 @@ import Notifications from 'components/notifications/notifications.vue'
import UserPanel from 'components/user_panel/user_panel.vue'
import LoginForm from 'components/login_form/login_form.vue'
import ChatPanel from 'components/chat_panel/chat_panel.vue'
+import WhoToFollow from 'components/who_to_follow/who_to_follow.vue'
import About from 'components/about/about.vue'
export default (store) => {
@@ -47,6 +48,7 @@ export default (store) => {
{ name: 'chat', path: '/chat', component: ChatPanel, props: () => ({ floating: false }) },
{ name: 'oauth-callback', path: '/oauth-callback', component: OAuthCallback, props: (route) => ({ code: route.query.code }) },
{ name: 'user-search', path: '/user-search', component: UserSearch, props: (route) => ({ query: route.query.query }) },
+ { name: 'who-to-follow', path: '/who-to-follow', component: WhoToFollow },
{ name: 'about', path: '/about', component: About },
{ name: 'user-profile', path: '/(users/)?:name', component: UserProfile }
]
diff --git a/src/components/side_drawer/side_drawer.js b/src/components/side_drawer/side_drawer.js
@@ -23,6 +23,9 @@ const SideDrawer = {
},
unseenNotificationsCount () {
return this.unseenNotifications.length
+ },
+ suggestionsEnabled () {
+ return this.$store.state.instance.suggestionsEnabled
}
},
methods: {
diff --git a/src/components/side_drawer/side_drawer.vue b/src/components/side_drawer/side_drawer.vue
@@ -62,12 +62,17 @@
</ul>
<ul>
<li @click="toggleDrawer">
- <router-link :to="{ name: 'user-search'}">
+ <router-link :to="{ name: 'user-search' }">
{{ $t("nav.user_search") }}
</router-link>
</li>
+ <li v-if="currentUser && suggestionsEnabled" @click="toggleDrawer">
+ <router-link :to="{ name: 'who-to-follow' }">
+ {{ $t("nav.who_to_follow") }}
+ </router-link>
+ </li>
<li @click="toggleDrawer">
- <router-link :to="{ name: 'settings'}">
+ <router-link :to="{ name: 'settings' }">
{{ $t("settings.settings") }}
</router-link>
</li>
diff --git a/src/components/who_to_follow/who_to_follow.js b/src/components/who_to_follow/who_to_follow.js
@@ -0,0 +1,48 @@
+import apiService from '../../services/api/api.service.js'
+import UserCard from '../user_card/user_card.vue'
+
+const WhoToFollow = {
+ components: {
+ UserCard
+ },
+ data () {
+ return {
+ users: []
+ }
+ },
+ mounted () {
+ this.getWhoToFollow()
+ },
+ methods: {
+ showWhoToFollow (reply) {
+ reply.forEach((i, index) => {
+ const user = {
+ id: 0,
+ name: i.display_name,
+ screen_name: i.acct,
+ profile_image_url: i.avatar || '/images/avi.png'
+ }
+ this.users.push(user)
+
+ this.$store.state.api.backendInteractor.externalProfile(user.screen_name)
+ .then((externalUser) => {
+ if (!externalUser.error) {
+ this.$store.commit('addNewUsers', [externalUser])
+ user.id = externalUser.id
+ }
+ })
+ })
+ },
+ getWhoToFollow () {
+ const credentials = this.$store.state.users.currentUser.credentials
+ if (credentials) {
+ apiService.suggestions({credentials: credentials})
+ .then((reply) => {
+ this.showWhoToFollow(reply)
+ })
+ }
+ }
+ }
+}
+
+export default WhoToFollow
diff --git a/src/components/who_to_follow/who_to_follow.vue b/src/components/who_to_follow/who_to_follow.vue
@@ -0,0 +1,15 @@
+<template>
+ <div class="panel panel-default">
+ <div class="panel-heading">
+ {{$t('who_to_follow.who_to_follow')}}
+ </div>
+ <div class="panel-body">
+ <user-card v-for="user in users" :key="user.id" :user="user" :showFollows="true"></user-card>
+ </div>
+ </div>
+</template>
+
+<script src="./who_to_follow.js"></script>
+
+<style lang="scss">
+</style>
diff --git a/src/components/who_to_follow_panel/who_to_follow_panel.js b/src/components/who_to_follow_panel/who_to_follow_panel.js
@@ -50,14 +50,6 @@ const WhoToFollowPanel = {
user: function () {
return this.$store.state.users.currentUser.screen_name
},
- moreUrl: function () {
- const host = window.location.hostname
- const user = this.user
- const suggestionsWeb = this.$store.state.instance.suggestionsWeb
- const url = suggestionsWeb.replace(/{{host}}/g, encodeURIComponent(host))
- .replace(/{{user}}/g, encodeURIComponent(user))
- return url
- },
suggestionsEnabled () {
return this.$store.state.instance.suggestionsEnabled
}
diff --git a/src/components/who_to_follow_panel/who_to_follow_panel.vue b/src/components/who_to_follow_panel/who_to_follow_panel.vue
@@ -13,7 +13,7 @@
{{user.name}}
</router-link><br />
</span>
- <img v-bind:src="$store.state.instance.logo"> <a v-bind:href="moreUrl" target="_blank">{{$t('who_to_follow.more')}}</a>
+ <img v-bind:src="$store.state.instance.logo"> <router-link :to="{ name: 'who-to-follow' }">{{$t('who_to_follow.more')}}</router-link>
</div>
</div>
</div>
diff --git a/src/i18n/en.json b/src/i18n/en.json
@@ -39,6 +39,7 @@
"timeline": "Timeline",
"twkn": "The Whole Known Network",
"user_search": "User Search",
+ "who_to_follow": "Who to follow",
"preferences": "Preferences"
},
"notifications": {
