From ff07ca4fa91679939e99ea3490c0bdfaae96eeba Mon Sep 17 00:00:00 2001
From: paring <me@paring.moe>
Date: Tue, 18 Jun 2024 00:55:09 +0900
Subject: [PATCH] fix: multiple requests are sent on page fetch

---
 src/components/templates/LevelList.svelte | 7 ++++---
 src/routes/rankings/+page.svelte          | 7 ++++---
 2 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/src/components/templates/LevelList.svelte b/src/components/templates/LevelList.svelte
index 613e482..f4310ff 100644
--- a/src/components/templates/LevelList.svelte
+++ b/src/components/templates/LevelList.svelte
@@ -25,7 +25,7 @@
 
   let query = createInfiniteQuery({
     queryKey: ['levels'],
-    queryFn: ({ pageParam }) => fetchPage(pageParam),
+    queryFn: ({ pageParam, signal }) => fetchPage(pageParam, signal),
     initialPageParam: 0,
     getNextPageParam: (lastPage, pages) => {
       return lastPage.length === pageSize ? pages.length + 1 : null;
@@ -46,9 +46,10 @@
   //   loading = false;
   // };
 
-  const fetchPage = async (page: number) => {
+  const fetchPage = async (page: number, signal: AbortSignal) => {
     const { data } = await api.get<ListResponse<Level>>('/api/v1/levels', {
-      params: params(page * pageSize)
+      params: params(page * pageSize),
+      signal
     });
 
     return data.results;
diff --git a/src/routes/rankings/+page.svelte b/src/routes/rankings/+page.svelte
index 4af52a9..e7910b7 100644
--- a/src/routes/rankings/+page.svelte
+++ b/src/routes/rankings/+page.svelte
@@ -16,16 +16,17 @@
 
   let query = createInfiniteQuery({
     queryKey: ['rankings'],
-    queryFn: ({ pageParam }) => fetchPage(pageParam),
+    queryFn: ({ pageParam, signal }) => fetchPage(pageParam, signal),
     initialPageParam: 0,
     getNextPageParam: (lastPage, pages) => {
       return lastPage.length === pageSize ? pages.length + 1 : null;
     }
   });
 
-  const fetchPage = async (page: number) => {
+  const fetchPage = async (page: number, signal: AbortSignal) => {
     const { data } = await api.get<ListResponse<RankingResult>>('/api/v1/ranking', {
-      params: { offset: page * pageSize, amount: pageSize }
+      params: { offset: page * pageSize, amount: pageSize },
+      signal
     });
 
     return data.results;