ensure timelines only start fetching on click (#150)
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful

no more parallel fetching

Co-authored-by: FloatingGhost <hannah@coffee-and-dreams.uk>
Reviewed-on: AkkomaGang/pleroma-fe#150
This commit is contained in:
floatingghost 2022-08-31 15:44:58 +00:00
parent 064b8ba7f7
commit 6f2058a8fc
2 changed files with 26 additions and 16 deletions

View file

@ -48,8 +48,9 @@ const UserProfile = {
},
created () {
const routeParams = this.$route.params
const hash = get(this.$route, 'hash', defaultTabKey).replace(/^#/, '')
if (hash !== '') this.tab = hash
this.load(routeParams.name || routeParams.id)
this.tab = get(this.$route, 'query.hash', defaultTabKey).replace(/^#/, '')
},
unmounted () {
this.stopFetching()
@ -91,23 +92,31 @@ const UserProfile = {
setFooterRef (el) {
this.footerRef = el
},
load (userNameOrId) {
const startFetchingTimeline = (timeline, userId) => {
// Clear timeline only if load another user's profile
if (userId !== this.$store.state.statuses.timelines[timeline].userId) {
this.$store.commit('clearTimeline', { timeline })
}
this.$store.dispatch('startFetchingTimeline', { timeline, userId })
onRouteChange (previousTab, nextTab) {
const timelineTabMap = {
statuses: 'user',
replies: 'replies',
media: 'media'
}
// only we can see our own favourites
if (this.isUs) timelineTabMap['favorites'] = 'favorites'
const timeline = timelineTabMap[nextTab]
const lastTimeline = timelineTabMap[previousTab]
if (timeline) {
this.stopFetching()
if (lastTimeline) this.$store.commit('clearTimeline', { timeline: lastTimeline })
this.$store.dispatch('startFetchingTimeline', { timeline: timeline, userId: this.userId })
}
},
load (userNameOrId) {
const loadById = (userId) => {
this.userId = userId
startFetchingTimeline('user', userId)
startFetchingTimeline('replies', userId)
startFetchingTimeline('media', userId)
if (this.isUs) {
startFetchingTimeline('favorites', userId)
}
const timelines = ['user', 'favorites', 'replies', 'media']
timelines.forEach((timeline) => {
this.$store.commit('clearTimeline', { timeline: timeline })
})
this.onRouteChange(null, this.tab)
// Fetch all pinned statuses immediately
this.$store.dispatch('fetchPinnedStatuses', userId)
}
@ -182,7 +191,9 @@ const UserProfile = {
}
},
'$route.hash': function (newVal) {
const oldTab = this.tab
this.tab = newVal.replace(/^#/, '') || defaultTabKey
this.onRouteChange(oldTab, this.tab)
}
},
components: {

View file

@ -121,7 +121,6 @@
<Timeline
key="media"
:label="$t('user_card.media')"
:disabled="!media.visibleStatuses.length"
:embedded="true"
:title="$t('user_card.media')"
timeline-name="media"
@ -134,7 +133,7 @@
v-if="isUs"
key="favorites"
:label="$t('user_card.favorites')"
:disabled="!favorites.visibleStatuses.length"
:disabled="!isUs"
:embedded="true"
:title="$t('user_card.favorites')"
timeline-name="favorites"