From 20a0b8ba83030a60035324ee5646cba4935b6666 Mon Sep 17 00:00:00 2001
From: Johan Bisse Mattsson <bisse.mattsson@kb.se>
Date: Tue, 26 Nov 2024 10:26:33 +0100
Subject: [PATCH] Update types

---
 packages/supersearch/src/lib/types/json.ts     |  8 ++++++++
 .../supersearch/src/lib/types/superSearch.ts   | 18 ++++--------------
 .../src/lib/utils/useSearchRequest.svelte.ts   |  3 ++-
 packages/supersearch/src/routes/+page.svelte   | 17 +++++++++++++++--
 .../supersearch/src/routes/api/find/+server.ts | 13 +++++++------
 5 files changed, 36 insertions(+), 23 deletions(-)
 create mode 100644 packages/supersearch/src/lib/types/json.ts

diff --git a/packages/supersearch/src/lib/types/json.ts b/packages/supersearch/src/lib/types/json.ts
new file mode 100644
index 000000000..467d6c263
--- /dev/null
+++ b/packages/supersearch/src/lib/types/json.ts
@@ -0,0 +1,8 @@
+type JSONPrimitive = string | number | boolean | null | undefined;
+
+export type JSONValue =
+	| JSONPrimitive
+	| JSONValue[]
+	| {
+			[key: string]: JSONValue;
+	  };
diff --git a/packages/supersearch/src/lib/types/superSearch.ts b/packages/supersearch/src/lib/types/superSearch.ts
index b5ddbe528..a0bd89bf8 100644
--- a/packages/supersearch/src/lib/types/superSearch.ts
+++ b/packages/supersearch/src/lib/types/superSearch.ts
@@ -1,18 +1,8 @@
+import type { JSONValue } from './json.js';
+
 export type QueryFunction = (value: string) => URLSearchParams;
 export type PaginationQueryFunction = (
 	searchParams: URLSearchParams,
-	data: QueryResponse
+	data: JSONValue
 ) => URLSearchParams | undefined;
-export type TransformFunction = (data: unknown) => unknown;
-
-export interface ResultItem {
-	'@id'?: string;
-	heading: string;
-}
-
-export interface QueryResponse {
-	'@id'?: string;
-	context?: string;
-	items: ResultItem[];
-	totalItems: number;
-}
+export type TransformFunction = (data: JSONValue) => JSONValue;
diff --git a/packages/supersearch/src/lib/utils/useSearchRequest.svelte.ts b/packages/supersearch/src/lib/utils/useSearchRequest.svelte.ts
index 0e21e845d..ec88ab085 100644
--- a/packages/supersearch/src/lib/utils/useSearchRequest.svelte.ts
+++ b/packages/supersearch/src/lib/utils/useSearchRequest.svelte.ts
@@ -3,6 +3,7 @@ import type {
 	PaginationQueryFunction,
 	TransformFunction
 } from '$lib/types/superSearch.js';
+import type { JSONValue } from '$lib/types/json.js';
 import debounce from '$lib/utils/debounce.js';
 
 export function useSearchRequest({
@@ -38,7 +39,7 @@ export function useSearchRequest({
 			const response = await fetch(`${endpoint}?${searchParams.toString()}`, {
 				signal: controller.signal
 			});
-			const jsonResponse = await response.json();
+			const jsonResponse = (await response.json()) as JSONValue;
 
 			const _data = transformFn?.(jsonResponse) || jsonResponse;
 			moreSearchParams = paginationQueryFn?.(searchParams, _data);
diff --git a/packages/supersearch/src/routes/+page.svelte b/packages/supersearch/src/routes/+page.svelte
index 68bc92c59..c7d420778 100644
--- a/packages/supersearch/src/routes/+page.svelte
+++ b/packages/supersearch/src/routes/+page.svelte
@@ -1,21 +1,33 @@
 <script lang="ts">
 	import SuperSearch from '$lib/components/SuperSearch.svelte';
+	import type { JSONValue } from '$lib/types/json.js';
 	import type { MockQueryResponse } from './api/find/+server.js';
 
 	let value1 = $state('');
 	let value2 = $state('');
 	let placeholder = $state('Search');
 
-	function handlePaginationQuery(searchParams: URLSearchParams, prevData: MockQueryResponse) {
+	function handlePaginationQuery(searchParams: URLSearchParams, prevData: JSONValue) {
 		const paginatedSearchParams = new URLSearchParams(Array.from(searchParams.entries()));
 		const limit = parseInt(searchParams.get('_limit')!, 10);
 		const offset = limit + parseInt(searchParams.get('_offset') || '0', 10);
-		if (prevData && offset < prevData.totalItems) {
+		if (prevData && offset < (prevData as unknown as MockQueryResponse).totalItems) {
 			paginatedSearchParams.set('_offset', offset.toString());
 			return paginatedSearchParams;
 		}
 		return undefined;
 	}
+
+	function handleTransform(data: JSONValue) {
+		const { items, ...rest } = data as unknown as MockQueryResponse;
+		return {
+			...rest,
+			items: items.map((item) => ({
+				...item,
+				heading: `${item.heading} for ${value1}`
+			}))
+		};
+	}
 </script>
 
 <form action="test1">
@@ -32,6 +44,7 @@
 					_limit: '10'
 				})}
 			paginationQueryFn={handlePaginationQuery}
+			transformFn={handleTransform}
 		>
 			{#snippet resultItem(item)}
 				<button type="button" data-test-id="result-item">
diff --git a/packages/supersearch/src/routes/api/find/+server.ts b/packages/supersearch/src/routes/api/find/+server.ts
index 87c54059b..e9af6949d 100644
--- a/packages/supersearch/src/routes/api/find/+server.ts
+++ b/packages/supersearch/src/routes/api/find/+server.ts
@@ -1,4 +1,3 @@
-import type { QueryResponse, ResultItem } from '$lib/types/superSearch.js';
 import type { RequestHandler } from './$types.ts';
 import { json } from '@sveltejs/kit';
 
@@ -10,22 +9,24 @@ const MOCK_ITEMS_DATA = Array.from({ length: MAX_ITEMS }, (_, i) => ({
 }));
 
 export const GET: RequestHandler = async ({ url }) => {
-	const q = url.searchParams.get('_q');
 	const limit = parseInt(url.searchParams.get('_limit')!, 10);
 	const offset = parseInt(url.searchParams.get('_offset') || '0', 10);
 
 	return json({
 		'@id': `/api/find?${url.searchParams.toString()}`,
 		items: MOCK_ITEMS_DATA.slice(offset, offset + limit).map((item) => ({
-			'@id': `${q}-${item.id}`,
-			heading: `${item.heading} for query: "${q}"`
+			'@id': item.id,
+			heading: item.heading
 		})),
 		totalItems: MAX_ITEMS
 	});
 };
 
-export interface MockQueryResponse extends QueryResponse {
+export interface MockQueryResponse {
 	'@id'?: string;
-	items: ResultItem[];
+	items: {
+		'@id'?: string;
+		heading: string;
+	}[];
 	totalItems: number;
 }