フロントエンドもMkPaginationに

packages/backend/src/queue/processors/ScheduleNotePostProcessorService.ts

@@ -24,13 +24,13 @@ export class ScheduleNotePostProcessorService {
 		@Inject(DI.usersRepository)
 		private usersRepository: UsersRepository,
 
-        private noteCreateService: NoteCreateService,
-        private queueLoggerService: QueueLoggerService,
+		private noteCreateService: NoteCreateService,
+		private queueLoggerService: QueueLoggerService,
 	) {
 		this.logger = this.queueLoggerService.logger.createSubLogger('schedule-note-post');
 	}
 
-    @bindThis
+	@bindThis
 	public async process(job: Bull.Job<ScheduleNotePostJobData>): Promise<void> {
 		this.scheduledNotesRepository.findOneBy({ id: job.data.scheduledNoteId }).then(async (data) => {
 			if (!data) {

packages/frontend/src/components/MkSchedulePostListDialog.vue

@@ -12,39 +12,51 @@ SPDX-License-Identifier: AGPL-3.0-only
 	@closed="$emit('closed')"
 >
 	<template #header>{{ i18n.ts._schedulePost.list }}</template>
-	<div v-for="item in notes">
-		<MkSpacer :marginMin="14" :marginMax="16">
-			<MkNoteSimple scheduled="true" :note="item.note"/>
-		</MkSpacer>
-	</div>
+	<MkSpacer :marginMin="14" :marginMax="16">
+		<MkPagination :pagination="pagination">
+			<template #empty>
+				<div class="_fullinfo">
+					<img :src="infoImageUrl" class="_ghost"/>
+					<div>{{ i18n.ts.nothing }}</div>
+				</div>
+			</template>
+
+			<template #default="{ items }">
+				<div class="_gaps">
+					<MkNoteSimple v-for="item in items" :key="item.id" :scheduled="true" :note="item.note"/>
+				</div>
+			</template>
+		</MkPagination>
+	</MkSpacer>
 </MkModalWindow>
 </template>
 
 <script lang="ts" setup>
-import { onMounted, ref } from 'vue';
+import { ref } from 'vue';
 import * as Misskey from 'misskey-js';
+import type { Paging } from '@/components/MkPagination.vue';
 import MkModalWindow from '@/components/MkModalWindow.vue';
-import * as os from '@/os.js';
+import MkPagination from '@/components/MkPagination.vue';
 import MkNoteSimple from '@/components/MkNoteSimple.vue';
 import { i18n } from '@/i18n.js';
+import { infoImageUrl } from '@/instance.js';
 
 const emit = defineEmits<{
 	(ev: 'ok', selected: Misskey.entities.UserDetailed): void;
 	(ev: 'cancel'): void;
-	(ev: 'closed'): void;
+	(ev: 'c-losed'): void;
 }>();
 
-let dialogEl = $ref();
-const notes = ref([]);
+const dialogEl = ref();
 const cancel = () => {
 	emit('cancel');
-	dialogEl.close();
+	dialogEl.value.close();
 };
 
-onMounted(async () => {
-	notes.value = await os.api('notes/schedule/list');
-});
-
+const pagination: Paging = {
+	endpoint: 'notes/schedule/list',
+	limit: 10,
+};
 </script>
 
 <style lang="scss" module>