From 61e5bbb4824ea893f96477eb20c6a5abb250d6db Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <62335616+lucaseduoli@users.noreply.github.com>
Date: Tue, 3 Sep 2024 14:41:53 -0300
Subject: [PATCH] fix: folders call when saving flow (#3658)

* Removed refetching of get folder on save

* Made component appear if its loading

* Rebaned query key to not refetch folders

* Changed isLoading to isFetching for the component to be unclickable while refetching
---
 .../API/queries/flows/use-patch-update-flow.ts           | 9 +--------
 .../API/queries/folders/use-get-download-folders.ts      | 6 +++++-
 .../MainPage/components/componentsComponent/index.tsx    | 2 +-
 .../MainPage/components/myCollectionComponent/index.tsx  | 6 +++---
 4 files changed, 10 insertions(+), 13 deletions(-)

diff --git a/src/frontend/src/controllers/API/queries/flows/use-patch-update-flow.ts b/src/frontend/src/controllers/API/queries/flows/use-patch-update-flow.ts
index 218e7de1e..98d0c8e14 100644
--- a/src/frontend/src/controllers/API/queries/flows/use-patch-update-flow.ts
+++ b/src/frontend/src/controllers/API/queries/flows/use-patch-update-flow.ts
@@ -33,14 +33,7 @@ export const usePatchUpdateFlow: useMutationFunctionType<
   };
 
   const mutation: UseMutationResult<IPatchUpdateFlow, any, IPatchUpdateFlow> =
-    mutate(["usePatchUpdateFlow"], PatchUpdateFlowFn, {
-      ...options,
-      onSettled: () => {
-        queryClient.refetchQueries({
-          queryKey: ["useGetFolder"],
-        });
-      },
-    });
+    mutate(["usePatchUpdateFlow"], PatchUpdateFlowFn, options);
 
   return mutation;
 };
diff --git a/src/frontend/src/controllers/API/queries/folders/use-get-download-folders.ts b/src/frontend/src/controllers/API/queries/folders/use-get-download-folders.ts
index ab367dce3..8d4dec403 100644
--- a/src/frontend/src/controllers/API/queries/folders/use-get-download-folders.ts
+++ b/src/frontend/src/controllers/API/queries/folders/use-get-download-folders.ts
@@ -20,6 +20,10 @@ export const useGetDownloadFolders: useMutationFunctionType<
     return res.data;
   };
 
-  const mutation = mutate(["useGetFolders"], downloadFoldersFn, options);
+  const mutation = mutate(
+    ["useGetDownloadFolders"],
+    downloadFoldersFn,
+    options,
+  );
   return mutation;
 };
diff --git a/src/frontend/src/pages/MainPage/components/componentsComponent/index.tsx b/src/frontend/src/pages/MainPage/components/componentsComponent/index.tsx
index ab6b72bdb..fbbc58e92 100644
--- a/src/frontend/src/pages/MainPage/components/componentsComponent/index.tsx
+++ b/src/frontend/src/pages/MainPage/components/componentsComponent/index.tsx
@@ -234,7 +234,7 @@ export default function ComponentsComponent({
               <EmptyComponent />
             ) : (
               <div className="grid w-full gap-4 md:grid-cols-2 lg:grid-cols-2">
-                {data?.length > 0 && isLoading === false ? (
+                {data?.length > 0 ? (
                   <>
                     {data?.map((item) => (
                       <FormProvider {...methods} key={item.id}>
diff --git a/src/frontend/src/pages/MainPage/components/myCollectionComponent/index.tsx b/src/frontend/src/pages/MainPage/components/myCollectionComponent/index.tsx
index 83b5cd7b9..89b58c81e 100644
--- a/src/frontend/src/pages/MainPage/components/myCollectionComponent/index.tsx
+++ b/src/frontend/src/pages/MainPage/components/myCollectionComponent/index.tsx
@@ -13,7 +13,7 @@ const MyCollectionComponent = ({ type }: MyCollectionComponentProps) => {
   const { folderId } = useParams();
   const myCollectionId = useFolderStore((state) => state.myCollectionId);
 
-  const { data, isLoading } = useGetFolderQuery(
+  const { data, isFetching } = useGetFolderQuery(
     {
       id: folderId ?? myCollectionId ?? "",
     },
@@ -27,13 +27,13 @@ const MyCollectionComponent = ({ type }: MyCollectionComponentProps) => {
 
   return (
     <>
-      <HeaderTabsSearchComponent loading={isLoading || isLoadingFolders} />
+      <HeaderTabsSearchComponent loading={isFetching || isLoadingFolders} />
       <div className="mt-5 flex h-full flex-col">
         <ComponentsComponent
           key={type}
           type={type}
           currentFolder={data}
-          isLoading={isLoading || isLoadingFolders}
+          isLoading={isFetching || isLoadingFolders}
         />
       </div>
     </>