Show who to follow in the mobile view

This commit is contained in:
Hakaba Hitoyo 2019-01-16 02:33:08 +00:00 committed by HJ
parent 502a76be0a
commit 05ead45fb7
8 changed files with 77 additions and 11 deletions

View file

@ -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 }
]

View file

@ -23,6 +23,9 @@ const SideDrawer = {
},
unseenNotificationsCount () {
return this.unseenNotifications.length
},
suggestionsEnabled () {
return this.$store.state.instance.suggestionsEnabled
}
},
methods: {

View file

@ -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>

View file

@ -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

View file

@ -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>

View file

@ -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
}

View file

@ -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>

View file

@ -39,6 +39,7 @@
"timeline": "Timeline",
"twkn": "The Whole Known Network",
"user_search": "User Search",
"who_to_follow": "Who to follow",
"preferences": "Preferences"
},
"notifications": {