wip

packages/frontend/src/components/MkDrive.vue

@@ -85,7 +85,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 						@dragend="isDragSource = false"
 					/>
 				</div>
-				<MkButton v-if="foldersPaginator.canFetchOlder" primary rounded @click="foldersPaginator.fetchOlder()">{{ i18n.ts.loadMore }}</MkButton>
+				<MkButton v-if="foldersPaginator.canFetchOlder.value" primary rounded @click="foldersPaginator.fetchOlder()">{{ i18n.ts.loadMore }}</MkButton>
 			</div>
 
 			<div v-show="filesPaginator.items.value.length > 0">
@@ -110,7 +110,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 						/>
 					</div>
 				</MkStickyContainer>
-				<MkButton v-show="filesPaginator.canFetchOlder" primary rounded @click="filesPaginator.fetchOlder()">{{ i18n.ts.loadMore }}</MkButton>
+				<MkButton v-show="filesPaginator.canFetchOlder.value" primary rounded @click="filesPaginator.fetchOlder()">{{ i18n.ts.loadMore }}</MkButton>
 			</div>
 
 			<div v-if="filesPaginator.items.value.length == 0 && foldersPaginator.items.value.length == 0 && !fetching" :class="$style.empty">
@@ -203,6 +203,7 @@ const filesPaginator = usePagination({
 	ctx: {
 		endpoint: 'drive/files',
 		limit: 30,
+		canFetchDetection: 'limit',
 		params: computed(() => ({
 			folderId: folder.value ? folder.value.id : null,
 			type: props.type,
@@ -217,6 +218,7 @@ const foldersPaginator = usePagination({
 	ctx: {
 		endpoint: 'drive/folders',
 		limit: 30,
+		canFetchDetection: 'limit',
 		params: computed(() => ({
 			folderId: folder.value ? folder.value.id : null,
 		})),

packages/frontend/src/composables/use-pagination.ts

@@ -35,6 +35,9 @@ export type PagingCtx<E extends keyof Misskey.Endpoints = keyof Misskey.Endpoint
 
 	baseId?: MisskeyEntity['id'];
 	direction?: 'newer' | 'older';
+
+	// 一部のAPIはさらに遡れる場合でもパフォーマンス上の理由でlimit以下の結果を返す場合があり、その場合はsafe、それ以外はlimitにすることを推奨
+	canFetchDetection?: 'safe' | 'limit';
 };
 
 export function usePagination<Endpoint extends keyof Misskey.Endpoints, T = Misskey.Endpoints[Endpoint]['res'] extends (infer I)[] ? I : never>(props: {
@@ -95,13 +98,21 @@ export function usePagination<Endpoint extends keyof Misskey.Endpoints, T = Miss
 				if (i === 3) item._shouldInsertAd_ = true;
 			}
 
-			if (res.length === 0 || props.ctx.noPaging) {
 			pushItems(res);
+
+			if (props.ctx.canFetchDetection === 'limit') {
+				if (res.length < FIRST_FETCH_LIMIT) {
 					canFetchOlder.value = false;
 				} else {
-				pushItems(res);
 					canFetchOlder.value = true;
 				}
+			} else if (props.ctx.canFetchDetection === 'safe' || props.ctx.canFetchDetection == null) {
+				if (res.length === 0 || props.ctx.noPaging) {
+					canFetchOlder.value = false;
+				} else {
+					canFetchOlder.value = true;
+				}
+			}
 
 			error.value = false;
 			fetching.value = false;
@@ -133,13 +144,20 @@ export function usePagination<Endpoint extends keyof Misskey.Endpoints, T = Miss
 				if (i === 10) item._shouldInsertAd_ = true;
 			}
 
+			pushItems(res);
+
+			if (props.ctx.canFetchDetection === 'limit') {
+				if (res.length < FIRST_FETCH_LIMIT) {
+					canFetchOlder.value = false;
+				} else {
+					canFetchOlder.value = true;
+				}
+			} else if (props.ctx.canFetchDetection === 'safe' || props.ctx.canFetchDetection == null) {
 				if (res.length === 0) {
 					canFetchOlder.value = false;
-				fetchingOlder.value = false;
 				} else {
-				pushItems(res);
 					canFetchOlder.value = true;
-				fetchingOlder.value = false;
+				}
 			}
 		}, err => {
 			fetchingOlder.value = false;