Merge pull request #872 from rainlanguage/2024-09-16-query-sync-order…

…-detail-trades Order trades and order detail query sync
rainlanguage · Sep 19, 2024 · 58c4981 · 58c4981
2 parents 4139db6 + 023214b
commit 58c4981
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 5 deletions.
diff --git a/tauri-app/src/lib/components/detail/OrderDetail.svelte b/tauri-app/src/lib/components/detail/OrderDetail.svelte
@@ -17,16 +17,32 @@
   import OrderTradesListTable from '../tables/OrderTradesListTable.svelte';
   import OrderTradesChart from '../charts/OrderTradesChart.svelte';
   import OrderQuote from '../detail/TanstackOrderQuote.svelte';
+  import { onDestroy } from 'svelte';
+  import { queryClient } from '$lib/queries/queryClient';
 
   export let id: string;
 
   $: orderDetailQuery = createQuery({
-    queryKey: [QKEY_ORDER + id],
+    queryKey: [id, QKEY_ORDER + id],
     queryFn: () => {
       return orderDetail(id, $subgraphUrl || '');
     },
     enabled: !!$subgraphUrl,
   });
+
+  const interval = setInterval(async () => {
+    // This invalidate function invalidates
+    // both order detail and order trades list queries
+    await queryClient.invalidateQueries({
+      queryKey: [id],
+      refetchType: 'active',
+      exact: false,
+    });
+  }, 10000);
+
+  onDestroy(() => {
+    clearInterval(interval);
+  });
 </script>
 
 <TanstackPageContentDetail query={orderDetailQuery} emptyMessage="Order not found">

diff --git a/tauri-app/src/lib/components/tables/OrderTradesListTable.svelte b/tauri-app/src/lib/components/tables/OrderTradesListTable.svelte
@@ -12,19 +12,19 @@
   import { formatUnits } from 'viem';
   import { handleDebugTradeModal } from '$lib/services/modal';
   import { BugOutline } from 'flowbite-svelte-icons';
+  import type { Trade } from '$lib/typeshare/subgraphTypes';
 
   export let id: string;
 
   $: orderTradesQuery = createInfiniteQuery({
-    queryKey: [QKEY_ORDER_TRADES_LIST + id],
-    queryFn: ({ pageParam }) => {
+    queryKey: [id, QKEY_ORDER_TRADES_LIST + id],
+    queryFn: ({ pageParam }: { pageParam: number }) => {
       return orderTradesList(id, $subgraphUrl || '', pageParam);
     },
     initialPageParam: 0,
-    getNextPageParam(lastPage, _allPages, lastPageParam) {
+    getNextPageParam: (lastPage: Trade[], _allPages: Trade[][], lastPageParam: number) => {
       return lastPage.length === DEFAULT_PAGE_SIZE ? lastPageParam + 1 : undefined;
     },
-    refetchInterval: 10000,
     enabled: !!$subgraphUrl,
   });
 </script>