[C-3735] Add forceRefresh to audius-query hook results (#7345)

AudiusProject · Feb 5, 2024 · 03fd837 · 03fd837
1 parent 52715b3
commit 03fd837
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 34 deletions.
diff --git a/packages/common/src/audius-query/createApi.ts b/packages/common/src/audius-query/createApi.ts
@@ -45,7 +45,8 @@ import {
   SliceConfig,
   QueryHookResults,
   FetchResetAction,
-  RetryConfig
+  RetryConfig,
+  MutationHookResults
 } from './types'
 import { capitalize, getKeyFromFetchArgs, selectCommonEntityMap } from './utils'
 
@@ -418,6 +419,15 @@ const buildEndpointHooks = <
 
     const context = useContext(AudiusQueryContext)
 
+    const fetchWrapped = useCallback(async () => {
+      if (!context) return
+      if ([Status.LOADING, Status.ERROR, Status.SUCCESS].includes(status))
+        return
+      if (hookOptions?.disabled) return
+
+      fetchData(fetchArgs, endpointName, endpoint, actions, context)
+    }, [context, fetchArgs, hookOptions?.disabled, status])
+
     useEffect(() => {
       if (isInitialValue) {
         dispatch(
@@ -429,40 +439,25 @@ const buildEndpointHooks = <
         )
       }
 
-      const fetchWrapped = async () => {
-        if (!context) return
-        if ([Status.LOADING, Status.ERROR, Status.SUCCESS].includes(status))
-          return
-        if (hookOptions?.disabled) return
-
-        fetchData(fetchArgs, endpointName, endpoint, actions, context)
-      }
-
       fetchWrapped()
-    }, [
-      fetchArgs,
-      dispatch,
-      status,
-      isInitialValue,
-      nonNormalizedData,
-      context,
-      hookOptions?.disabled
-    ])
+    }, [isInitialValue, dispatch, fetchArgs, nonNormalizedData, fetchWrapped])
 
     if (endpoint.options?.schemaKey) {
       cachedData = cachedData?.[endpoint.options?.schemaKey]
     }
 
-    return { data: cachedData, status, errorMessage }
+    return {
+      data: cachedData,
+      status,
+      errorMessage,
+      forceRefresh: fetchWrapped
+    }
   }
 
   // Hook to be returned as use<EndpointName>
   const useMutation = (
     hookOptions?: QueryHookOptions
-  ): [
-    (fetchArgs: Args, hookOptions?: QueryHookOptions) => void,
-    QueryHookResults<Data>
-  ] => {
+  ): MutationHookResults<Args, Data> => {
     const [fetchArgs, setFetchArgs] = useState<Args | null>(null)
     const key = getKeyFromFetchArgs(fetchArgs)
     const queryState = useQueryState(
@@ -502,7 +497,14 @@ const buildEndpointHooks = <
       cachedData = cachedData?.[endpoint.options?.schemaKey]
     }
 
-    return [fetchWrapped, { data: cachedData, status, errorMessage }]
+    return [
+      fetchWrapped,
+      {
+        data: cachedData,
+        status,
+        errorMessage
+      }
+    ]
   }
 
   api.fetch[endpointName] = (

diff --git a/packages/common/src/audius-query/types.ts b/packages/common/src/audius-query/types.ts
@@ -26,15 +26,10 @@ export type Api<EndpointDefinitions extends DefaultEndpointDefinitions> = {
     [Property in keyof EndpointDefinitions as `use${Capitalize<
       string & Property
     >}`]: EndpointDefinitions[Property]['options']['type'] extends 'mutation'
-      ? () => [
-          (
-            fetchArgs: Parameters<EndpointDefinitions[Property]['fetch']>[0],
-            options?: QueryHookOptions
-          ) => void,
-          QueryHookResults<
-            Awaited<ReturnType<EndpointDefinitions[Property]['fetch']>>
-          >
-        ]
+      ? () => MutationHookResults<
+          Parameters<EndpointDefinitions[Property]['fetch']>[0],
+          Awaited<ReturnType<EndpointDefinitions[Property]['fetch']>>
+        >
       : (
           fetchArgs: Parameters<EndpointDefinitions[Property]['fetch']>[0],
           options?: QueryHookOptions
@@ -140,4 +135,14 @@ export type QueryHookResults<Data> = {
   data: Data
   status: Status
   errorMessage?: string
+  forceRefresh: () => void
 }
+
+export type MutationHookResults<Args, Data> = [
+  (fetchArgs: Args, options?: QueryHookOptions) => void,
+  {
+    data: Data
+    status: Status
+    errorMessage?: string
+  }
+]