1
0
mirror of https://github.com/h3poteto/whalebird-desktop synced 2025-02-09 08:18:44 +01:00

Remove marker in mentions

This commit is contained in:
AkiraFukushima 2022-12-18 11:49:13 +09:00
parent dad54b435e
commit 04467896df
No known key found for this signature in database
GPG Key ID: B6E51BAC4DE1A957
3 changed files with 21 additions and 164 deletions

View File

@ -3,25 +3,18 @@
<div></div>
<DynamicScroller :items="mentions" :min-item-size="86" id="scroller" class="scroller" ref="scroller">
<template v-slot="{ item, index, active }">
<template v-if="item.id === 'loading-card'">
<DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.id]" :data-index="index" :watchData="true">
<StatusLoading :since_id="item.since_id" :max_id="item.max_id" :loading="loadingMore" @load_since="fetchMentionsSince" />
</DynamicScrollerItem>
</template>
<template v-else>
<DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.url]" :data-index="index" :watchData="true">
<notification
:message="item"
:focused="item.id === focusedId"
:overlaid="modalOpened"
:filters="[]"
v-on:update="updateToot"
@focusRight="focusSidebar"
@selectNotification="focusNotification(item)"
>
</notification>
</DynamicScrollerItem>
</template>
<DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.url]" :data-index="index" :watchData="true">
<notification
:message="item"
:focused="item.id === focusedId"
:overlaid="modalOpened"
:filters="[]"
v-on:update="updateToot"
@focusRight="focusSidebar"
@selectNotification="focusNotification(item)"
>
</notification>
</DynamicScrollerItem>
</template>
</DynamicScroller>
<div :class="openSideBar ? 'upper-with-side-bar' : 'upper'" v-show="!heading">
@ -33,9 +26,8 @@
</template>
<script lang="ts">
import { computed, defineComponent, onBeforeUnmount, onBeforeUpdate, onMounted, onUnmounted, ref, watch } from 'vue'
import { computed, defineComponent, onBeforeUpdate, onMounted, onUnmounted, ref, watch } from 'vue'
import { useMagicKeys, whenever, and } from '@vueuse/core'
import moment from 'moment'
import { useI18next } from 'vue3-i18next'
import { useRoute } from 'vue-router'
import { Entity } from 'megalodon'
@ -63,7 +55,6 @@ export default defineComponent({
const { j, k, Ctrl_r } = useMagicKeys()
const focusedId = ref<string | null>(null)
const loadingMore = ref(false)
const scroller = ref<any>()
const mentions = computed<Array<Entity.Notification | LoadingCard>>(() => store.getters[`${space}/mentions`])
@ -78,10 +69,6 @@ export default defineComponent({
onMounted(() => {
store.commit(`TimelineSpace/SideMenu/${SIDE_MENU_MUTATION.CHANGE_UNREAD_MENTIONS}`, false)
document.getElementById('scroller')?.addEventListener('scroll', onScroll)
if (heading.value && mentions.value.length > 0) {
store.dispatch(`${space}/${ACTION_TYPES.SAVE_MARKER}`)
}
})
onBeforeUpdate(() => {
if (store.state.TimelineSpace.SideMenu.unreadMentions && heading.value) {
@ -104,15 +91,6 @@ export default defineComponent({
})
}
})
watch(
mentions,
(newVal, _oldVal) => {
if (heading.value && newVal.length > 0) {
store.dispatch(`${space}/${ACTION_TYPES.SAVE_MARKER}`)
}
},
{ deep: true }
)
watch(focusedId, (newVal, _oldVal) => {
if (newVal && heading.value) {
store.commit(`${space}/${MUTATION_TYPES.CHANGE_HEADING}`, false)
@ -153,20 +131,11 @@ 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.dispatch(`${space}/${ACTION_TYPES.SAVE_MARKER}`)
}
}
const updateToot = (message: Entity.Status) => {
store.commit(`${space}/${MUTATION_TYPES.UPDATE_TOOT}`, message)
}
const fetchMentionsSince = (since_id: string) => {
loadingMore.value = true
store.dispatch(`${space}/${ACTION_TYPES.FETCH_MENTIONS_SINCE}`, since_id).finally(() => {
setTimeout(() => {
loadingMore.value = false
}, 500)
})
}
const reload = async () => {
store.commit(`TimelineSpace/${TIMELINE_MUTATION.CHANGE_LOADING}`, true)
try {
@ -203,8 +172,6 @@ export default defineComponent({
return {
mentions,
scroller,
loadingMore,
fetchMentionsSince,
focusedId,
modalOpened,
updateToot,

View File

@ -33,9 +33,8 @@
</template>
<script lang="ts">
import { defineComponent, ref, computed, onMounted, onBeforeUpdate, onBeforeUnmount, onUnmounted, watch } from 'vue'
import { defineComponent, ref, computed, onMounted, onBeforeUpdate, onUnmounted, watch } from 'vue'
import { useMagicKeys, whenever, and } from '@vueuse/core'
import moment from 'moment'
import { ElMessage } from 'element-plus'
import { Entity } from 'megalodon'
import Notification from '@/components/organisms/Notification.vue'

View File

@ -1,11 +1,6 @@
import generator, { Entity, NotificationType } from 'megalodon'
import { Module, MutationTree, ActionTree, GetterTree } from 'vuex'
import { RootState } from '@/store'
import { MyWindow } from '~/src/types/global'
import { LoadingCard } from '@/types/loading-card'
import { LocalMarker } from '~/src/types/localMarker'
const win = (window as any) as MyWindow
const excludes: Array<string> = [
NotificationType.Follow,
@ -19,7 +14,7 @@ const excludes: Array<string> = [
export type MentionsState = {
lazyLoading: boolean
heading: boolean
mentions: Array<Entity.Notification | LoadingCard>
mentions: Array<Entity.Notification>
}
const state = (): MentionsState => ({
@ -37,8 +32,7 @@ export const MUTATION_TYPES = {
ARCHIVE_MENTIONS: 'archiveMentions',
CLEAR_MENTIONS: 'clearMentions',
UPDATE_TOOT: 'updateToot',
DELETE_TOOT: 'deleteToot',
APPEND_MENTIONS_AFTER_LOADING_CARD: 'appendMentionsAfterLoadingCard'
DELETE_TOOT: 'deleteToot'
}
const mutations: MutationTree<MentionsState> = {
@ -51,13 +45,13 @@ const mutations: MutationTree<MentionsState> = {
[MUTATION_TYPES.APPEND_MENTIONS]: (state, update: Entity.Notification) => {
// Reject duplicated status in timeline
if (!state.mentions.find(item => item.id === update.id)) {
state.mentions = ([update] as Array<Entity.Notification | LoadingCard>).concat(state.mentions)
state.mentions = [update].concat(state.mentions)
}
},
[MUTATION_TYPES.UPDATE_MENTIONS]: (state, messages: Array<Entity.Notification | LoadingCard>) => {
[MUTATION_TYPES.UPDATE_MENTIONS]: (state, messages: Array<Entity.Notification>) => {
state.mentions = messages
},
[MUTATION_TYPES.INSERT_MENTIONS]: (state, messages: Array<Entity.Notification | LoadingCard>) => {
[MUTATION_TYPES.INSERT_MENTIONS]: (state, messages: Array<Entity.Notification>) => {
state.mentions = state.mentions.concat(messages)
},
[MUTATION_TYPES.ARCHIVE_MENTIONS]: state => {
@ -94,30 +88,16 @@ const mutations: MutationTree<MentionsState> = {
return true
}
})
},
[MUTATION_TYPES.APPEND_MENTIONS_AFTER_LOADING_CARD]: (state, mentions: Array<Entity.Notification | LoadingCard>) => {
const m = state.mentions.flatMap(mention => {
if (mention.id !== 'loading-card') {
return mention
} else {
return mentions
}
})
// Reject duplicated status in timeline
state.mentions = Array.from(new Set(m))
}
}
export const ACTION_TYPES = {
FETCH_MENTIONS: 'fetchMentions',
LAZY_FETCH_MENTIONS: 'lazyFetchMentions',
FETCH_MENTIONS_SINCE: 'fetchMentionsSince',
GET_MARKER: 'getMarker',
SAVE_MARKER: 'saveMarker'
LAZY_FETCH_MENTIONS: 'lazyFetchMentions'
}
const actions: ActionTree<MentionsState, RootState> = {
[ACTION_TYPES.FETCH_MENTIONS]: async ({ dispatch, commit, rootState }): Promise<Array<Entity.Notification>> => {
[ACTION_TYPES.FETCH_MENTIONS]: async ({ commit, rootState }): Promise<Array<Entity.Notification>> => {
const client = generator(
rootState.TimelineSpace.sns,
rootState.TimelineSpace.account.baseURL,
@ -125,33 +105,6 @@ const actions: ActionTree<MentionsState, RootState> = {
rootState.App.userAgent
)
const localMarker: LocalMarker | null = await dispatch('getMarker').catch(err => {
console.error(err)
})
if (rootState.TimelineSpace.timelineSetting.useMarker.mentions && localMarker !== null) {
const nextResponse = await client.getNotifications({
limit: 1,
min_id: localMarker.last_read_id,
exclude_types: excludes
})
if (nextResponse.data.length > 0) {
const card: LoadingCard = {
type: 'middle-load',
since_id: localMarker.last_read_id,
max_id: null,
id: 'loading-card',
uri: 'loading-card'
}
let mentions: Array<Entity.Notification | LoadingCard> = [card]
const res = await client.getNotifications({ limit: 30, max_id: nextResponse.data[0].id, exclude_types: excludes })
mentions = mentions.concat(res.data)
commit(MUTATION_TYPES.UPDATE_MENTIONS, mentions)
commit('TimelineSpace/SideMenu/changeUnreadMentions', true, { root: true })
return res.data
}
}
const res = await client.getNotifications({
limit: 30,
exclude_types: excludes
@ -186,68 +139,6 @@ const actions: ActionTree<MentionsState, RootState> = {
.finally(() => {
commit(MUTATION_TYPES.CHANGE_LAZY_LOADING, false)
})
},
[ACTION_TYPES.FETCH_MENTIONS_SINCE]: async (
{ state, rootState, commit },
since_id: string
): Promise<Array<Entity.Notification> | null> => {
const client = generator(
rootState.TimelineSpace.sns,
rootState.TimelineSpace.account.baseURL,
rootState.TimelineSpace.account.accessToken,
rootState.App.userAgent
)
const cardIndex = state.mentions.findIndex(s => {
if (s.id === 'loading-card') {
return true
}
return false
})
let maxID: string | null = null
if (cardIndex > 0) {
maxID = state.mentions[cardIndex - 1].id
}
let params = { min_id: since_id, limit: 30, exclude_types: excludes }
if (maxID !== null) {
params = Object.assign({}, params, {
max_id: maxID
})
}
const res = await client.getNotifications(params)
if (res.data.length >= 30) {
const card: LoadingCard = {
type: 'middle-load',
since_id: res.data[0].id,
max_id: maxID,
id: 'loading-card',
uri: 'loading-card'
}
let mentions: Array<Entity.Notification | LoadingCard> = [card]
mentions = mentions.concat(res.data)
commit(MUTATION_TYPES.APPEND_MENTIONS_AFTER_LOADING_CARD, mentions)
} else {
commit(MUTATION_TYPES.APPEND_MENTIONS_AFTER_LOADING_CARD, res.data)
}
return res.data
},
[ACTION_TYPES.GET_MARKER]: async ({ rootState }): Promise<LocalMarker | null> => {
if (!rootState.TimelineSpace.timelineSetting.useMarker.mentions) {
return null
}
const localMarker: LocalMarker | null = await win.ipcRenderer.invoke('get-mentions-marker', rootState.TimelineSpace.account._id)
return localMarker
},
[ACTION_TYPES.SAVE_MARKER]: async ({ state, rootState }) => {
const mentions = state.mentions
if (mentions.length === 0 || mentions[0].id === 'loading-card') {
return
}
win.ipcRenderer.send('save-marker', {
owner_id: rootState.TimelineSpace.account._id,
timeline: 'mentions',
last_read_id: mentions[0].id
} as LocalMarker)
}
}