161sh/iceshrimp-161sh
1
0
Fork 0
mirror of https://iceshrimp.dev/crimekillz/iceshrimp-161sh.git synced 2024-11-22 04:03:49 +01:00
Code Issues Packages Projects Releases Wiki Activity

[client] Use defaultStore instead of $store, debounce fetches

Browse Source
This commit is contained in:
Laura Hausmann 2023-11-23 18:44:31 +01:00
parent 9a34c38d0b
commit 248bf22b94
No known key found for this signature in database
GPG Key ID: D044E84C5BE01605
2 changed files with 13 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
packages/client/src/components/MkNotes.vue
View File

@ -42,6 +42,7 @@ import MkPagination from "@/components/MkPagination.vue";
import { i18n } from "@/i18n"; import { i18n } from "@/i18n";
import { scroll } from "@/scripts/scroll"; import { scroll } from "@/scripts/scroll";
import {instance} from "@/instance"; import {instance} from "@/instance";
import { defaultStore } from "@/store.js";
const tlEl = ref<HTMLElement>(); const tlEl = ref<HTMLElement>();
@ -53,20 +54,22 @@ const props = defineProps<{
const pagingComponent = ref<InstanceType<typeof MkPagination>>(); const pagingComponent = ref<InstanceType<typeof MkPagination>>();
const interval = ref<NodeJS.Timer>(); const interval = ref<NodeJS.Timer>();
const lastFetchScrollTop = ref(0);
function scrollTop() { function scrollTop() {
if (!tlEl.value) return; if (!tlEl.value) return;
scroll(tlEl.value, { top: 0, behavior: "smooth" }); scroll(tlEl.value, { top: 0, behavior: "smooth" });
} }
const setTimer = () => { function setTimer() {
if ($store.state.enableInfiniteScroll && !interval.value) { if (interval.value || !defaultStore.state.enableInfiniteScroll) return;
interval.value = setInterval(() => { interval.value = setInterval(() => {
const viewport = document.documentElement.clientHeight; const viewport = document.documentElement.clientHeight;
const left = document.documentElement.scrollHeight - document.documentElement.scrollTop; const left = document.documentElement.scrollHeight - document.documentElement.scrollTop;
if (left <= viewport * 3) pagingComponent.value.prefetchMore(); if (left > viewport * 3 || document.documentElement.scrollTop - lastFetchScrollTop.value < viewport) return;
}, 100); pagingComponent.value.prefetchMore();
} lastFetchScrollTop.value = document.documentElement.scrollTop;
}, 100);
} }
function clearTimer() { function clearTimer() {

3
packages/client/src/components/MkPagination.vue
View File

@ -83,6 +83,7 @@ import {
import MkButton from "@/components/MkButton.vue"; import MkButton from "@/components/MkButton.vue";
import { i18n } from "@/i18n"; import { i18n } from "@/i18n";
import {instance} from "@/instance"; import {instance} from "@/instance";
import { defaultStore } from "@/store.js";
export type Paging< export type Paging<
E extends keyof misskey.Endpoints = keyof misskey.Endpoints, E extends keyof misskey.Endpoints = keyof misskey.Endpoints,
@ -242,7 +243,7 @@ const refresh = async (): void => {
}; };
const prefetchMore = async (): Promise<void> => { const prefetchMore = async (): Promise<void> => {
if (props.disableAutoLoad || !$store.state.enableInfiniteScroll) return; if (props.disableAutoLoad || !defaultStore.state.enableInfiniteScroll) return;
await fetchMore(); await fetchMore();
} }