moon
/
pleroma-fe
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch '492' into 'develop' 

Fix Follow/Mute/Block not functional issue in the user search page

Closes #492

See merge request pleroma/pleroma-fe!754
This commit is contained in:
HJ 2019-04-25 12:32:29 +00:00
parent c8f967d5c0 445b54c553
commit e351f8630c
5 changed files with 60 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/components/follow_card/follow_card.js
View File

@ -10,8 +10,7 @@ const FollowCard = {
data () { data () {
return { return {
inProgress: false, inProgress: false,
requestSent: false, requestSent: false
updated: false
} }
}, },
components: { components: {
@ -19,10 +18,8 @@ const FollowCard = {
RemoteFollow RemoteFollow
}, },
computed: { computed: {
isMe () { return this.$store.state.users.currentUser.id === this.user.id }, isMe () {
following () { return this.updated ? this.updated.following : this.user.following }, return this.$store.state.users.currentUser.id === this.user.id
showFollow () {
return !this.following || this.updated && !this.updated.following
}, },
loggedIn () { loggedIn () {
return this.$store.state.users.currentUser return this.$store.state.users.currentUser
@ -31,17 +28,15 @@ const FollowCard = {
methods: { methods: {
followUser () { followUser () {
this.inProgress = true this.inProgress = true
requestFollow(this.user, this.$store).then(({ sent, updated }) => { requestFollow(this.user, this.$store).then(({ sent }) => {
this.inProgress = false this.inProgress = false
this.requestSent = sent this.requestSent = sent
this.updated = updated
}) })
}, },
unfollowUser () { unfollowUser () {
this.inProgress = true this.inProgress = true
requestUnfollow(this.user, this.$store).then(({ updated }) => { requestUnfollow(this.user, this.$store).then(() => {
this.inProgress = false this.inProgress = false
this.updated = updated
}) })
} }
} }

60
src/components/follow_card/follow_card.vue
View File

@ -4,34 +4,38 @@
<span class="faint" v-if="!noFollowsYou && user.follows_you"> <span class="faint" v-if="!noFollowsYou && user.follows_you">
{{ isMe ? $t('user_card.its_you') : $t('user_card.follows_you') }} {{ isMe ? $t('user_card.its_you') : $t('user_card.follows_you') }}
</span> </span>
<div class="follow-card-follow-button" v-if="showFollow && !loggedIn"> <template v-if="!loggedIn">
<RemoteFollow :user="user" /> <div class="follow-card-follow-button" v-if="!user.following">
</div> <RemoteFollow :user="user" />
<button </div>
v-if="showFollow && loggedIn" </template>
class="btn btn-default follow-card-follow-button" <template v-else>
@click="followUser" <button
:disabled="inProgress" v-if="!user.following"
:title="requestSent ? $t('user_card.follow_again') : ''" class="btn btn-default follow-card-follow-button"
> @click="followUser"
<template v-if="inProgress"> :disabled="inProgress"
{{ $t('user_card.follow_progress') }} :title="requestSent ? $t('user_card.follow_again') : ''"
</template> >
<template v-else-if="requestSent"> <template v-if="inProgress">
{{ $t('user_card.follow_sent') }} {{ $t('user_card.follow_progress') }}
</template> </template>
<template v-else> <template v-else-if="requestSent">
{{ $t('user_card.follow') }} {{ $t('user_card.follow_sent') }}
</template> </template>
</button> <template v-else>
<button v-if="following" class="btn btn-default follow-card-follow-button pressed" @click="unfollowUser" :disabled="inProgress"> {{ $t('user_card.follow') }}
<template v-if="inProgress"> </template>
{{ $t('user_card.follow_progress') }} </button>
</template> <button v-else class="btn btn-default follow-card-follow-button pressed" @click="unfollowUser" :disabled="inProgress">
<template v-else> <template v-if="inProgress">
{{ $t('user_card.follow_unfollow') }} {{ $t('user_card.follow_progress') }}
</template> </template>
</button> <template v-else>
{{ $t('user_card.follow_unfollow') }}
</template>
</button>
</template>
</div> </div>
</basic-user-card> </basic-user-card>
</template> </template>

14
src/components/user_search/user_search.js
View File

@ -1,5 +1,6 @@
import FollowCard from '../follow_card/follow_card.vue' import FollowCard from '../follow_card/follow_card.vue'
import userSearchApi from '../../services/new_api/user_search.js' import map from 'lodash/map'
const userSearch = { const userSearch = {
components: { components: {
FollowCard FollowCard
@ -10,10 +11,15 @@ const userSearch = {
data () { data () {
return { return {
username: '', username: '',
users: [], userIds: [],
loading: false loading: false
} }
}, },
computed: {
users () {
return this.userIds.map(userId => this.$store.getters.findUser(userId))
}
},
mounted () { mounted () {
this.search(this.query) this.search(this.query)
}, },
@ -33,10 +39,10 @@ const userSearch = {
return return
} }
this.loading = true this.loading = true
userSearchApi.search({query, store: this.$store}) this.$store.dispatch('searchUsers', query)
.then((res) => { .then((res) => {
this.loading = false this.loading = false
this.users = res this.userIds = map(res, 'id')
}) })
} }
} }

9
src/modules/users.js
View File

@ -1,4 +1,5 @@
import backendInteractorService from '../services/backend_interactor_service/backend_interactor_service.js' import backendInteractorService from '../services/backend_interactor_service/backend_interactor_service.js'
import userSearchApi from '../services/new_api/user_search.js'
import { compact, map, each, merge, last, concat, uniq } from 'lodash' import { compact, map, each, merge, last, concat, uniq } from 'lodash'
import { set } from 'vue' import { set } from 'vue'
import { registerPushNotifications, unregisterPushNotifications } from '../services/push/push.js' import { registerPushNotifications, unregisterPushNotifications } from '../services/push/push.js'
@ -341,6 +342,14 @@ const users = {
store.commit('setUserForNotification', notification) store.commit('setUserForNotification', notification)
}) })
}, },
searchUsers (store, query) {
// TODO: Move userSearch api into api.service
return userSearchApi.search({query, store: { state: store.rootState }})
.then((users) => {
store.commit('addNewUsers', users)
return users
})
},
async signUp (store, userInfo) { async signUp (store, userInfo) {
store.commit('signUpPending') store.commit('signUpPending')

20
src/services/follow_manipulate/follow_manipulate.js
View File

@ -23,18 +23,12 @@ export const requestFollow = (user, store) => new Promise((resolve, reject) => {
// For locked users we just mark it that we sent the follow request // For locked users we just mark it that we sent the follow request
if (updated.locked) { if (updated.locked) {
resolve({ resolve({ sent: true })
sent: true,
updated
})
} }
if (updated.following) { if (updated.following) {
// If we get result immediately, just stop. // If we get result immediately, just stop.
resolve({ resolve({ sent: false })
sent: false,
updated
})
} }
// But usually we don't get result immediately, so we ask server // But usually we don't get result immediately, so we ask server
@ -48,16 +42,10 @@ export const requestFollow = (user, store) => new Promise((resolve, reject) => {
.then((following) => { .then((following) => {
if (following) { if (following) {
// We confirmed and everything's good. // We confirmed and everything's good.
resolve({ resolve({ sent: false })
sent: false,
updated
})
} else { } else {
// If after all the tries, just treat it as if user is locked // If after all the tries, just treat it as if user is locked
resolve({ resolve({ sent: false })
sent: false,
updated
})
} }
}) })
}) })