sam/pleroma-fe
sam/pleroma-fe
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

refactor using List component

Browse source
This commit is contained in:
taehoon 2019-04-03 22:28:08 -04:00
parent 1cec2b6969
commit 738a3dc02d
2 changed files with 27 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

38
src/components/user_profile/user_profile.js
View file

@ -4,30 +4,25 @@ import UserCard from '../user_card/user_card.vue'
import FollowCard from '../follow_card/follow_card.vue'
import Timeline from '../timeline/timeline.vue'
import ModerationTools from '../moderation_tools/moderation_tools.vue'
import List from '../list/list.vue'
import withLoadMore from '../../hocs/with_load_more/with_load_more'
import withList from '../../hocs/with_list/with_list'
const FollowerList = compose(
withLoadMore({
fetch: (props, $store) => $store.dispatch('fetchFollowers', props.userId),
select: (props, $store) => get($store.getters.findUser(props.userId), 'followerIds', []).map(id => $store.getters.findUser(id)),
destory: (props, $store) => $store.dispatch('clearFollowers', props.userId),
childPropName: 'entries',
additionalPropNames: ['userId']
}),
withList({ getEntryProps: user => ({ user }) })
)(FollowCard)
const FollowerList = withLoadMore({
fetch: (props, $store) => $store.dispatch('fetchFollowers', props.userId),
select: (props, $store) => get($store.getters.findUser(props.userId), 'followerIds', []).map(id => $store.getters.findUser(id)),
destory: (props, $store) => $store.dispatch('clearFollowers', props.userId),
childPropName: 'items',
additionalPropNames: ['userId']
})(List)
const FriendList = compose(
withLoadMore({
fetch: (props, $store) => $store.dispatch('fetchFriends', props.userId),
select: (props, $store) => get($store.getters.findUser(props.userId), 'friendIds', []).map(id => $store.getters.findUser(id)),
destory: (props, $store) => $store.dispatch('clearFriends', props.userId),
childPropName: 'entries',
additionalPropNames: ['userId']
}),
withList({ getEntryProps: user => ({ user }) })
)(FollowCard)
const FriendList = withLoadMore({
fetch: (props, $store) => $store.dispatch('fetchFriends', props.userId),
select: (props, $store) => get($store.getters.findUser(props.userId), 'friendIds', []).map(id => $store.getters.findUser(id)),
destory: (props, $store) => $store.dispatch('clearFriends', props.userId),
childPropName: 'items',
additionalPropNames: ['userId']
})(List)
const UserProfile = {
data () {
@ -134,7 +129,8 @@ const UserProfile = {
Timeline,
FollowerList,
FriendList,
ModerationTools
ModerationTools,
FollowCard
}
}

12
src/components/user_profile/user_profile.vue
View file

@ -14,10 +14,18 @@
:user-id="userId"
/>
<div :label="$t('user_card.followees')" v-if="followsTabVisible" :disabled="!user.friends_count">
<FriendList :userId="userId" />
<FriendList :userId="userId">
<template slot="item" scope="p">
<FollowCard :key="p.item.id" :user="p.item" />
</template>
</FriendList>
</div>
<div :label="$t('user_card.followers')" v-if="followersTabVisible" :disabled="!user.followers_count">
<FollowerList :userId="userId" :entryProps="{noFollowsYou: isUs}" />
<FollowerList :userId="userId">
<template slot="item" scope="p">
<FollowCard :key="p.item.id" :user="p.item" :noFollowsYou="isUs" />
</template>
</FollowerList>
</div>
<Timeline
:label="$t('user_card.media')"