forked from Mirrors/elk
chore: move path to page when using notification paginator
This commit is contained in:
parent
26883d6d19
commit
5acd2224df
6 changed files with 25 additions and 15 deletions
|
@ -116,9 +116,7 @@ function groupItems(items: mastodon.v1.Notification[]): NotificationSlot[] {
|
||||||
// Finalize remaining groups
|
// Finalize remaining groups
|
||||||
processGroup()
|
processGroup()
|
||||||
|
|
||||||
nextTick().then(() => {
|
|
||||||
nuxtApp.$trackScroll.restoreCustomPageScroll()
|
nuxtApp.$trackScroll.restoreCustomPageScroll()
|
||||||
})
|
|
||||||
|
|
||||||
return results
|
return results
|
||||||
}
|
}
|
||||||
|
@ -153,10 +151,6 @@ function preprocess(items: NotificationSlot[]): NotificationSlot[] {
|
||||||
|
|
||||||
const { clearNotifications } = useNotifications()
|
const { clearNotifications } = useNotifications()
|
||||||
const { formatNumber } = useHumanReadableNumber()
|
const { formatNumber } = useHumanReadableNumber()
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
nuxtApp.$trackScroll.registerCustomRoute(path)
|
|
||||||
})
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
defineProps<{ path: string }>()
|
||||||
// Default limit is 20 notifications, and servers are normally caped to 30
|
// Default limit is 20 notifications, and servers are normally caped to 30
|
||||||
const paginator = useMastoClient().v1.notifications.list({ limit: 30, types: ['mention'] })
|
const paginator = useMastoClient().v1.notifications.list({ limit: 30, types: ['mention'] })
|
||||||
const stream = $(useStreaming(client => client.v1.stream.streamUser()))
|
const stream = $(useStreaming(client => client.v1.stream.streamUser()))
|
||||||
|
@ -8,5 +9,5 @@ onActivated(clearNotifications)
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<NotificationPaginator v-bind="{ path: '/notification/mention', paginator, stream }" />
|
<NotificationPaginator v-bind="{ path, paginator, stream }" />
|
||||||
</template>
|
</template>
|
||||||
|
|
|
@ -1,4 +1,6 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
defineProps<{ path: string }>()
|
||||||
|
|
||||||
// Default limit is 20 notifications, and servers are normally caped to 30
|
// Default limit is 20 notifications, and servers are normally caped to 30
|
||||||
const paginator = useMastoClient().v1.notifications.list({ limit: 30 })
|
const paginator = useMastoClient().v1.notifications.list({ limit: 30 })
|
||||||
const stream = useStreaming(client => client.v1.stream.streamUser())
|
const stream = useStreaming(client => client.v1.stream.streamUser())
|
||||||
|
@ -8,5 +10,5 @@ onActivated(clearNotifications)
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<NotificationPaginator v-bind="{ path: '/notification', paginator, stream }" />
|
<NotificationPaginator v-bind="{ path, paginator, stream }" />
|
||||||
</template>
|
</template>
|
||||||
|
|
|
@ -3,8 +3,11 @@ const { t } = useI18n()
|
||||||
useHeadFixed({
|
useHeadFixed({
|
||||||
title: () => `${t('tab.notifications_all')} | ${t('nav.notifications')}`,
|
title: () => `${t('tab.notifications_all')} | ${t('nav.notifications')}`,
|
||||||
})
|
})
|
||||||
|
onMounted(() => {
|
||||||
|
useNuxtApp().$trackScroll.registerCustomRoute('/notifications')
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<TimelineNotifications v-if="isHydrated" />
|
<TimelineNotifications v-if="isHydrated" path="/notifications" />
|
||||||
</template>
|
</template>
|
||||||
|
|
|
@ -3,8 +3,12 @@ const { t } = useI18n()
|
||||||
useHeadFixed({
|
useHeadFixed({
|
||||||
title: () => `${t('tab.notifications_mention')} | ${t('nav.notifications')}`,
|
title: () => `${t('tab.notifications_mention')} | ${t('nav.notifications')}`,
|
||||||
})
|
})
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
useNuxtApp().$trackScroll.registerCustomRoute('/notification/mention')
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<TimelineMentions v-if="isHydrated" />
|
<TimelineMentions v-if="isHydrated" path="/notifications/mention" />
|
||||||
</template>
|
</template>
|
||||||
|
|
|
@ -13,7 +13,7 @@ export default defineNuxtPlugin((nuxtApp) => {
|
||||||
track.value = true
|
track.value = true
|
||||||
})
|
})
|
||||||
|
|
||||||
const forceScroll = () => {
|
const forceScrollToTop = () => {
|
||||||
storage.value[route.fullPath] = 0
|
storage.value[route.fullPath] = 0
|
||||||
window.scrollTo({ top: 0, left: 0, behavior: 'smooth' })
|
window.scrollTo({ top: 0, left: 0, behavior: 'smooth' })
|
||||||
}
|
}
|
||||||
|
@ -22,7 +22,7 @@ export default defineNuxtPlugin((nuxtApp) => {
|
||||||
const path = route.fullPath
|
const path = route.fullPath
|
||||||
return nextTick().then(() => {
|
return nextTick().then(() => {
|
||||||
if (route.meta?.noScrollTrack) {
|
if (route.meta?.noScrollTrack) {
|
||||||
forceScroll()
|
forceScrollToTop()
|
||||||
return Promise.resolve()
|
return Promise.resolve()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -43,6 +43,13 @@ export default defineNuxtPlugin((nuxtApp) => {
|
||||||
if (scrollPosition)
|
if (scrollPosition)
|
||||||
window.scrollTo(0, scrollPosition)
|
window.scrollTo(0, scrollPosition)
|
||||||
|
|
||||||
|
// required for custom routes: first call will reject
|
||||||
|
if (!track.value) {
|
||||||
|
nextTick().then(() => {
|
||||||
|
track.value = true
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
resolve()
|
resolve()
|
||||||
}, 600)
|
}, 600)
|
||||||
})
|
})
|
||||||
|
@ -76,9 +83,8 @@ export default defineNuxtPlugin((nuxtApp) => {
|
||||||
return {
|
return {
|
||||||
provide: {
|
provide: {
|
||||||
trackScroll: reactive({
|
trackScroll: reactive({
|
||||||
forceScroll,
|
forceScrollToTop,
|
||||||
restoreScroll,
|
restoreScroll,
|
||||||
track,
|
|
||||||
registerCustomRoute,
|
registerCustomRoute,
|
||||||
restoreCustomPageScroll,
|
restoreCustomPageScroll,
|
||||||
}),
|
}),
|
||||||
|
|
Loading…
Reference in a new issue