Mastodon/Whalebird-desktop-client-mac-linux-windows
1
0
Fork 0
mirror of https://github.com/h3poteto/whalebird-desktop synced 2025-02-07 23:38:48 +01:00
Code Issues Releases Wiki Activity

Stop prepending new status when scrolling in Lists

Browse Source
This commit is contained in:
AkiraFukushima 2022-12-13 21:50:48 +09:00
parent fe745d886d
commit 2d10fc128c
No known key found for this signature in database
GPG Key ID: B6E51BAC4DE1A957
4 changed files with 56 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
spec/renderer/integration/store/TimelineSpace/Contents/Lists/Show.spec.ts
View File

@ -122,7 +122,8 @@ let state = (): ShowState => {
return {
lazyLoading: false,
heading: true,
timeline: []
timeline: [],
unreads: []
}
}
@ -194,7 +195,8 @@ describe('Lists/Show', () => {
return {
lazyLoading: false,
heading: true,
timeline: [status1]
timeline: [status1],
unreads: []
}
}
})

23
spec/renderer/unit/store/TimelineSpace/Contents/Lists/Show.spec.ts
View File

@ -139,7 +139,8 @@ describe('TimelineSpace/Contents/Lists/Show', () => {
state = {
lazyLoading: false,
heading: true,
timeline: [status2, status1]
timeline: [status2, status1],
unreads: []
}
})
it('should be deleted', () => {
@ -153,7 +154,8 @@ describe('TimelineSpace/Contents/Lists/Show', () => {
state = {
lazyLoading: false,
heading: true,
timeline: [status2, rebloggedStatus]
timeline: [status2, rebloggedStatus],
unreads: []
}
})
it('should be deleted', () => {
@ -170,7 +172,8 @@ describe('TimelineSpace/Contents/Lists/Show', () => {
state = {
lazyLoading: false,
heading: true,
timeline: [status2, status1]
timeline: [status2, status1],
unreads: []
}
})
it('should be updated timeline', () => {
@ -184,7 +187,8 @@ describe('TimelineSpace/Contents/Lists/Show', () => {
state = {
lazyLoading: false,
heading: true,
timeline: [rebloggedStatus, status2, status1]
timeline: [rebloggedStatus, status2, status1],
unreads: []
}
})
it('should not be updated timeline', () => {
@ -200,12 +204,14 @@ describe('TimelineSpace/Contents/Lists/Show', () => {
state = {
lazyLoading: false,
heading: false,
timeline: [status2, status1]
timeline: [status2, status1],
unreads: []
}
})
it('should be updated timeline', () => {
it('should not be updated timeline', () => {
Show.mutations![MUTATION_TYPES.APPEND_TIMELINE](state, rebloggedStatus)
expect(state.timeline).toEqual([rebloggedStatus, status2, status1])
expect(state.timeline).toEqual([status2, status1])
expect(state.unreads).toEqual([rebloggedStatus])
})
})
@ -214,7 +220,8 @@ describe('TimelineSpace/Contents/Lists/Show', () => {
state = {
lazyLoading: false,
heading: false,
timeline: [rebloggedStatus, status2, status1]
timeline: [rebloggedStatus, status2, status1],
unreads: []
}
})
it('should not be updated timeline', () => {

25
src/renderer/components/TimelineSpace/Contents/Lists/Show.vue
View File

@ -1,6 +1,6 @@
<template>
<div name="list" class="list-timeline">
<div></div>
<div class="unread">{{ unreads.length > 0 ? unreads.length : '' }}</div>
<DynamicScroller :items="timeline" :min-item-size="86" id="scroller" class="scroller" ref="scroller">
<template v-slot="{ item, index, active }">
<DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.uri]" :data-index="index" :watchData="true">
@ -27,9 +27,8 @@
</template>
<script lang="ts">
import { defineComponent, toRefs, ref, computed, onMounted, onBeforeUpdate, watch, onBeforeUnmount, onUnmounted } from 'vue'
import { defineComponent, toRefs, ref, computed, onMounted, watch, onBeforeUnmount, onUnmounted } from 'vue'
import { useMagicKeys, whenever, and } from '@vueuse/core'
import moment from 'moment'
import { ElMessage } from 'element-plus'
import { useI18next } from 'vue3-i18next'
import { Entity } from 'megalodon'
@ -56,6 +55,7 @@ export default defineComponent({
const scroller = ref<any>(null)
const timeline = computed(() => store.state.TimelineSpace.Contents.Lists.Show.timeline)
const unreads = computed(() => store.state.TimelineSpace.Contents.Lists.Show.unreads)
const lazyLoading = computed(() => store.state.TimelineSpace.Contents.Lists.Show.lazyLoading)
const heading = computed(() => store.state.TimelineSpace.Contents.Lists.Show.heading)
const openSideBar = computed(() => store.state.TimelineSpace.Contents.SideBar.openSideBar)
@ -160,6 +160,7 @@ export default defineComponent({
store.commit(`${space}/${MUTATION_TYPES.CHANGE_HEADING}`, false)
} else if ((event.target as HTMLElement)!.scrollTop <= 10 && !heading.value) {
store.commit(`${space}/${MUTATION_TYPES.CHANGE_HEADING}`, true)
store.commit(`${space}/${MUTATION_TYPES.MERGE_UNREADS}`)
}
}
const reload = async () => {
@ -224,7 +225,8 @@ export default defineComponent({
focusToot,
openSideBar,
heading,
upper
upper,
unreads
}
}
})
@ -256,6 +258,21 @@ export default defineComponent({
.upper-icon {
padding: 3px;
}
.unread {
position: fixed;
right: 24px;
top: 52px;
background-color: rgba(0, 0, 0, 0.6);
color: #ffffff;
padding: 4px 8px;
border-radius: 0 0 2px 2px;
z-index: 1;
&:empty {
display: none;
}
}
}
</style>

20
src/renderer/store/TimelineSpace/Contents/Lists/Show.ts
View File

@ -10,12 +10,14 @@ export type ShowState = {
timeline: Array<Entity.Status>
lazyLoading: boolean
heading: boolean
unreads: Array<Entity.Status>
}
const state = (): ShowState => ({
timeline: [],
lazyLoading: false,
heading: true
heading: true,
unreads: []
})
export const MUTATION_TYPES = {
@ -27,7 +29,8 @@ export const MUTATION_TYPES = {
CLEAR_TIMELINE: 'clearTimeline',
UPDATE_TOOT: 'updateToot',
DELETE_TOOT: 'deleteToot',
CHANGE_LAZY_LOADING: 'changeLazyLoading'
CHANGE_LAZY_LOADING: 'changeLazyLoading',
MERGE_UNREADS: 'mergeUnreads'
}
const mutations: MutationTree<ShowState> = {
@ -36,8 +39,12 @@ const mutations: MutationTree<ShowState> = {
},
[MUTATION_TYPES.APPEND_TIMELINE]: (state, update: Entity.Status) => {
// Reject duplicated status in timeline
if (!state.timeline.find(item => item.id === update.id)) {
state.timeline = [update].concat(state.timeline)
if (!state.timeline.find(item => item.id === update.id) && !state.unreads.find(item => item.id === update.id)) {
if (state.heading) {
state.timeline = [update].concat(state.timeline)
} else {
state.unreads = [update].concat(state.unreads)
}
}
},
[MUTATION_TYPES.UPDATE_TIMELINE]: (state, timeline: Array<Entity.Status>) => {
@ -51,6 +58,7 @@ const mutations: MutationTree<ShowState> = {
},
[MUTATION_TYPES.CLEAR_TIMELINE]: state => {
state.timeline = []
state.unreads = []
},
[MUTATION_TYPES.UPDATE_TOOT]: (state, message: Entity.Status) => {
state.timeline = state.timeline.map(toot => {
@ -79,6 +87,10 @@ const mutations: MutationTree<ShowState> = {
},
[MUTATION_TYPES.CHANGE_LAZY_LOADING]: (state, value: boolean) => {
state.lazyLoading = value
},
[MUTATION_TYPES.MERGE_UNREADS]: state => {
state.timeline = state.unreads.slice(0, 80).concat(state.timeline)
state.unreads = []
}
}