adds search api

web/src/routes/trails/+page.svelte

@@ -4,13 +4,17 @@
     import TrailList from "$lib/components/trail/trail_list.svelte";
     import type { TrailFilter } from "$lib/models/trail";
     import { categories } from "$lib/stores/category_store";
-    import { trails, trails_search_filter } from "$lib/stores/trail_store";
+    import {
+        trails,
+        trails_search_filter,
+    } from "$lib/stores/trail_store";
     import { onMount } from "svelte";
     import { _ } from "svelte-i18n";
 
     let filterExpanded: boolean = true;
 
     const filter: TrailFilter = $page.data.filter;
+    const pagination: {page: number, totalPages: number} = $page.data.pagination
 
     onMount(() => {
         if (window.innerWidth < 768) {
@@ -19,7 +23,14 @@
     });
 
     async function handleFilterUpdate() {
-        await trails_search_filter(filter);
+        const response= await trails_search_filter(filter, 1);
+        pagination.page = response.page
+        pagination.totalPages = response.totalPages;
+    }
+
+    async function paginate(page: number) {
+        pagination.page = page;
+        const response = await trails_search_filter(filter, page);
     }
 </script>
 
@@ -39,6 +50,8 @@
     <TrailList
         {filter}
         trails={$trails}
-        on:update={async () => await trails_search_filter(filter)}
+        pagination={pagination}
+        on:update={() => handleFilterUpdate()}
+        on:pagination={(e) => paginate(e.detail)}
     ></TrailList>
 </main>