From ab425c6f2ca889bca22920afc08a716976d188c8 Mon Sep 17 00:00:00 2001
From: Juan Di Toro <ditorojuanf@gmail.com>
Date: Mon, 25 Mar 2024 09:12:31 +0100
Subject: [PATCH] fix: every time in progress query is fetched, we check the
 results for atleast one complete query and this invalidates the query results
 for the files data provider on the list query

---
 app/hooks/usePinning.ts           |  5 +----
 app/providers/PinningProvider.tsx | 33 ++++++++++++++++++++++---------
 2 files changed, 25 insertions(+), 13 deletions(-)

diff --git a/app/hooks/usePinning.ts b/app/hooks/usePinning.ts
index 52f84f7..9b4c638 100644
--- a/app/hooks/usePinning.ts
+++ b/app/hooks/usePinning.ts
@@ -1,4 +1,4 @@
-import { useInvalidate, useNotification } from "@refinedev/core";
+import { useNotification } from "@refinedev/core";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { useCallback, useContext } from "react";
 import { PinningProcess } from "~/data/pinning";
@@ -8,7 +8,6 @@ export const usePinning = () => {
   const queryClient = useQueryClient();
   const context = useContext(PinningContext);
   const { open } = useNotification();
-  const invalidate = useInvalidate();
 
   const { status: pinStatus, data: pinData, mutate: pinMutation } = useMutation({
     mutationKey: ["pin-mutation"],
@@ -25,7 +24,6 @@ export const usePinning = () => {
       }
 
       queryClient.invalidateQueries({ queryKey: ["pin-progress", "file"] });
-      invalidate({ resource: "files", invalidates: ["list"] });
     },
   });
 
@@ -43,7 +41,6 @@ export const usePinning = () => {
         });
       }
       queryClient.invalidateQueries({ queryKey: ["pin-progress"] });
-      invalidate({ resource: "files", invalidates: ["list"] });
     },
   });
 
diff --git a/app/providers/PinningProvider.tsx b/app/providers/PinningProvider.tsx
index afc7fd5..f4d3bf8 100644
--- a/app/providers/PinningProvider.tsx
+++ b/app/providers/PinningProvider.tsx
@@ -1,10 +1,11 @@
+import { useInvalidate } from "@refinedev/core";
 import {
   type QueryClient,
   type UseQueryResult,
   useQuery,
   useQueryClient,
 } from "@tanstack/react-query";
-import { createContext, useContext } from "react";
+import { createContext, useContext, useEffect } from "react";
 import { PinningProcess, type PinningStatus } from "~/data/pinning";
 
 export interface IPinningData {
@@ -26,11 +27,10 @@ export interface IPinningContextType {
 export const PinningContext = createContext<IPinningContextType>(
   {} as IPinningContextType,
 );
-
-export const usePinningContext = () => useContext(PinningContext);
-
-const usePinProgressQuery = () =>
-  useQuery({
+export const PinningProvider = ({ children }: React.PropsWithChildren) => {
+  const invalidate = useInvalidate();
+  const queryClient = useQueryClient();
+  const queryResult = useQuery({
     queryKey: ["pin-progress"],
     refetchInterval: (query) => {
       if (!query.state.data || !query.state.data.items.length) {
@@ -51,9 +51,24 @@ const usePinProgressQuery = () =>
     },
   });
 
-export const PinningProvider = ({ children }: React.PropsWithChildren) => {
-  const queryClient = useQueryClient();
-  const queryResult = usePinProgressQuery();
+  useEffect(() => {
+    if (
+      queryResult.isSuccess &&
+      queryResult.fetchStatus === "idle" &&
+      queryResult.isFetched
+    ) {
+      const hasCompletedItems = queryResult.data.items.some(item => item.status === 'completed');
+      if (hasCompletedItems) {
+        invalidate({ resource: "files", invalidates: ["list"] });
+      }
+    }
+  }, [
+    queryResult.fetchStatus,
+    queryResult.isSuccess,
+    queryResult.isFetched,
+    invalidate,
+    queryResult.data,
+  ]);
 
   return (
     <PinningContext.Provider value={{ query: queryResult, queryClient }}>