feat: pagination in the SPA for the Sites and Authors lists

web/src/lib/directoryQuery.ts

@@ -1,9 +1,11 @@
 import type { LocationQuery } from 'vue-router'
 import {
-	ARTICLE_PAGE_SIZES,
-	ARTICLE_SEARCH_MAX_LENGTH,
-	DEFAULT_ARTICLE_PAGE_SIZE,
-} from '@/lib/articleListQuery'
+	DEFAULT_PAGE_SIZE,
+	PAGE_SIZES,
+	SEARCH_MAX_LENGTH,
+	firstQueryValue,
+	parsePositiveInteger,
+} from '@/lib/pageQuery'
 
 export interface DirectoryQuery {
 	q: string
@@ -11,20 +13,13 @@ export interface DirectoryQuery {
 	size: number
 }
 
-const POSITIVE_INTEGER = /^[1-9]\d*$/
-
-function first(value: LocationQuery[string] | undefined) {
-	const single = Array.isArray(value) ? value[0] : value
-	return single ?? ''
-}
-
 export function parseDirectoryQuery(query: LocationQuery): DirectoryQuery {
-	const page = first(query.page)
-	const size = Number(first(query.size))
+	const page = firstQueryValue(query.page)
+	const size = Number(firstQueryValue(query.size))
 	return {
-		q: first(query.q).slice(0, ARTICLE_SEARCH_MAX_LENGTH),
-		page: POSITIVE_INTEGER.test(page) ? Number(page) : 1,
-		size: ARTICLE_PAGE_SIZES.includes(size) ? size : DEFAULT_ARTICLE_PAGE_SIZE,
+		q: firstQueryValue(query.q).slice(0, SEARCH_MAX_LENGTH),
+		page: parsePositiveInteger(page) ?? 1,
+		size: PAGE_SIZES.includes(size) ? size : DEFAULT_PAGE_SIZE,
 	}
 }
 
@@ -32,7 +27,7 @@ export function toDirectoryRouteQuery(query: DirectoryQuery, rest: LocationQuery
 	const route: Record<string, string> = {}
 	for (const [key, value] of Object.entries(rest)) {
 		if (key !== 'q' && key !== 'page' && key !== 'size') {
-			route[key] = first(value)
+			route[key] = firstQueryValue(value)
 		}
 	}
 	if (query.q) {
@@ -41,7 +36,7 @@ export function toDirectoryRouteQuery(query: DirectoryQuery, rest: LocationQuery
 	if (query.page !== 1) {
 		route.page = String(query.page)
 	}
-	if (query.size !== DEFAULT_ARTICLE_PAGE_SIZE) {
+	if (query.size !== DEFAULT_PAGE_SIZE) {
 		route.size = String(query.size)
 	}
 	return route