fix(swr): fix to use Array as key for useMutation (#1546)

* chore: remove unnecessary body params by swr key function * feat: add query params and update mutation key to Array * fix: updated `useMutation` argument to use `Key` type * chore: update sample app
orval-labs · Jul 28, 2024 · 31f2f94 · 31f2f94
1 parent 05286d3
commit 31f2f94
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 10 deletions.
diff --git a/packages/swr/src/index.ts b/packages/swr/src/index.ts
@@ -137,7 +137,7 @@ const generateSwrMutationArguments = ({
   swrBodyType: string;
   httpClient: OutputHttpClient;
 }) => {
-  const definition = `SWRMutationConfiguration<Awaited<ReturnType<typeof ${operationName}>>, TError, string, ${swrBodyType}, Awaited<ReturnType<typeof ${operationName}>>> & { swrKey?: string }`;
+  const definition = `SWRMutationConfiguration<Awaited<ReturnType<typeof ${operationName}>>, TError, Key, ${swrBodyType}, Awaited<ReturnType<typeof ${operationName}>>> & { swrKey?: string }`;
 
   if (!isRequestOptions) {
     return `swrOptions?: ${definition}`;
@@ -418,8 +418,8 @@ const generateSwrHook = (
     const swrKeyFn = `
 export const ${swrKeyFnName} = (${queryKeyProps}) => [\`${route}\`${
       queryParams ? ', ...(params ? [params]: [])' : ''
-    }${body.implementation ? `, ${body.implementation}` : ''}] as const;
-\n`;
+    }] as const;
+`;
 
     const swrKeyLoaderFnName = camel(
       `get-${operationName}-infinite-key-loader`,
@@ -458,7 +458,8 @@ export const ${swrKeyFnName} = (${queryKeyProps}) => [\`${route}\`${
       props.filter(
         (prop) =>
           prop.type === GetterPropType.PARAM ||
-          prop.type === GetterPropType.NAMED_PATH_PARAMS,
+          prop.type === GetterPropType.NAMED_PATH_PARAMS ||
+          prop.type === GetterPropType.QUERY_PARAM,
       ),
       'implementation',
     );
@@ -506,7 +507,8 @@ export const ${swrKeyFnName} = (${queryKeyProps}) => [\`${route}\`${
       .filter(
         (prop) =>
           prop.type === GetterPropType.PARAM ||
-          prop.type === GetterPropType.NAMED_PATH_PARAMS,
+          prop.type === GetterPropType.NAMED_PATH_PARAMS ||
+          prop.type === GetterPropType.QUERY_PARAM,
       )
       .map((prop) => {
         if (prop.type === GetterPropType.NAMED_PATH_PARAMS) {
@@ -518,7 +520,10 @@ export const ${swrKeyFnName} = (${queryKeyProps}) => [\`${route}\`${
       .join(',');
 
     const swrKeyFnName = camel(`get-${operationName}-mutation-key`);
-    const swrMutationKeyFn = `export const ${swrKeyFnName} = (${queryKeyProps}) => \`${route}\` as const;\n`;
+    const swrMutationKeyFn = `export const ${swrKeyFnName} = (${queryKeyProps}) => [\`${route}\`${
+      queryParams ? ', ...(params ? [params]: [])' : ''
+    }] as const;
+`;
 
     const swrMutationFetcherName = camel(
       `get-${operationName}-mutation-fetcher`,
@@ -553,7 +558,7 @@ export const ${swrKeyFnName} = (${queryKeyProps}) => [\`${route}\`${
 
     const swrMutationFetcherFn = `
 export const ${swrMutationFetcherName} = (${swrProps} ${swrMutationFetcherOptions}) => {
-  return (_: string, ${swrMutationFetcherArg}: { arg: ${swrBodyType} }): ${swrMutationFetcherType} => {
+  return (_: Key, ${swrMutationFetcherArg}: { arg: ${swrBodyType} }): ${swrMutationFetcherType} => {
     return ${operationName}(${httpFnProperties}${
       swrMutationFetcherOptions.length
         ? (httpFnProperties.length ? ', ' : '') + 'options'

diff --git a/samples/react-app-with-swr/src/api/endpoints/petstoreFromFileSpecWithTransformer.ts b/samples/react-app-with-swr/src/api/endpoints/petstoreFromFileSpecWithTransformer.ts
@@ -89,12 +89,12 @@ export const createPets = (
 };
 
 export const getCreatePetsMutationFetcher = (version: number = 1) => {
-  return (_: string, { arg }: { arg: CreatePetsBody }): Promise<Pet> => {
+  return (_: Key, { arg }: { arg: CreatePetsBody }): Promise<Pet> => {
     return createPets(arg, version);
   };
 };
 export const getCreatePetsMutationKey = (version: number = 1) =>
-  `/v${version}/pets` as const;
+  [`/v${version}/pets`] as const;
 
 export type CreatePetsMutationResult = NonNullable<
   Awaited<ReturnType<typeof createPets>>
@@ -110,7 +110,7 @@ export const useCreatePets = <TError = Error>(
     swr?: SWRMutationConfiguration<
       Awaited<ReturnType<typeof createPets>>,
       TError,
-      string,
+      Key,
       CreatePetsBody,
       Awaited<ReturnType<typeof createPets>>
     > & { swrKey?: string };