fix: technical debts left by the Sites, Authors and SEO slices, plus backend support for the new Sites and Authors pagination

web/src/composables/useMediaNames.ts

@@ -1,29 +1,49 @@
 import { ref } from 'vue'
 import { useApi } from '@/composables/useApi'
-import type { MediaItem, MediaListResponse } from '@/composables/useMedia'
+import type { MediaItem } from '@/composables/useMedia'
 
-const LOOKUP_QUERY = 'page=1&size=100&sort=newest'
+export const MEDIA_LOOKUP_CONCURRENCY = 4
+export const MEDIA_FAILURE_CACHE_LIMIT = 50
 
 export function useMediaNames() {
 	const { request } = useApi()
 	const items = ref<Record<number, MediaItem>>({})
+	const failed = new Set<number>()
 
 	function remember(item: MediaItem) {
 		items.value = { ...items.value, [item.id]: item }
 	}
 
+	function rememberFailure(id: number) {
+		failed.delete(id)
+		failed.add(id)
+		if (failed.size > MEDIA_FAILURE_CACHE_LIMIT) {
+			failed.delete(failed.values().next().value as number)
+		}
+	}
+
+	async function lookUp(id: number) {
+		try {
+			remember(await request<MediaItem>(`/v1/media/${id}`))
+		} catch {
+			rememberFailure(id)
+		}
+	}
+
+	async function lookUpAll(queue: number[]) {
+		const next = queue.values()
+		const worker = async () => {
+			for (const id of next) {
+				await lookUp(id)
+			}
+		}
+		await Promise.all(Array.from({ length: MEDIA_LOOKUP_CONCURRENCY }, worker))
+	}
+
 	async function resolve(ids: (number | null | undefined)[]) {
 		const wanted = ids.filter((id): id is number => typeof id === 'number')
-		if (wanted.every((id) => id in items.value)) {
-			return
-		}
-		try {
-			const page = await request<MediaListResponse>(`/v1/media/?${LOOKUP_QUERY}`)
-			const found = (page?.items ?? []).filter((item) => wanted.includes(item.id))
-			found.forEach(remember)
-		} catch {
-			return
-		}
+		const missing = [...new Set(wanted)].filter((id) => !(id in items.value) && !failed.has(id))
+		await lookUpAll(missing)
 	}
 
 	function itemOf(id: number | null | undefined) {