react-query-lightbase-codegen 0.0.21 → 0.1.0

package/lib/bin/react-query-codegen-import.js

@@ -0,0 +1,39 @@
+import chalk from 'chalk';
+import program from 'commander';
+import { readFileSync, writeFileSync } from 'fs';
+import { join, parse } from 'path';
+import importOpenApi from '../scripts/import-open-api';
+const log = console.log; // tslint:disable-line:no-console
+program.option('-o, --output [value]', 'output file destination');
+program.option('-f, --file [value]', 'input file (yaml or json openapi specs)');
+program.parse(process.argv);
+const createSuccessMessage = (backend) => chalk.green(`${backend ? `[${backend}] ` : ''}🎉  Your OpenAPI spec has been converted into react query hooks`);
+const successWithoutOutputMessage = chalk.yellow('Success! No output path specified; printed to standard output.');
+const importSpecs = async (options) => {
+    if (!options.file) {
+        throw new Error("You need to provide an input specification with `--file`, '--url', or `--github`");
+    }
+    const data = readFileSync(join(process.cwd(), options.file), 'utf-8');
+    const { ext } = parse(options.file);
+    const format = ['.yaml', '.yml'].includes(ext.toLowerCase()) ? 'yaml' : 'json';
+    return importOpenApi({
+        data,
+        format,
+    });
+};
+// Use flags as configuration
+importSpecs(program)
+    .then((data) => {
+    if (program.output) {
+        writeFileSync(join(process.cwd(), program.output), data);
+        log(createSuccessMessage());
+    }
+    else {
+        log(data);
+        log(successWithoutOutputMessage);
+    }
+})
+    .catch((err) => {
+    log(chalk.red(err));
+    process.exit(1);
+});

package/lib/bin/react-query-codegen.js

@@ -0,0 +1,8 @@
+import program from 'commander';
+import { readFileSync } from 'fs';
+import { join } from 'path';
+const { version } = JSON.parse(readFileSync(join(__dirname, '../../package.json'), 'utf-8'));
+program
+    .version(version)
+    .command('import [open-api-file]', 'generate react-query hooks from OpenAPI specs')
+    .parse(process.argv);

package/lib/cjs/import-open-api.js

@@ -341,6 +341,13 @@ const generateRestfulComponent = ({ operation, verb, route, operationIds, parame
         }
     }), 'in');
     const headerParams = header.filter((p) => !headerFilters?.includes(p.name));
+    let enabled = [];
+    [...queryParams, ...pathParams, ...headerParams].forEach((item) => {
+        if (item.required) {
+            enabled.push(`["${item.name}"]`);
+        }
+    });
+    const enabledParam = `!!props${enabled.join(' && !!props')}`;
     const paramsTypes = paramsInPath
         .map((p) => {
         try {
@@ -420,6 +427,7 @@ const generateRestfulComponent = ({ operation, verb, route, operationIds, parame
     use${componentName}Query.prefetch = (params: ${componentName}Variables) =>
     queryClient.prefetchQuery<${componentName}Response>(use${componentName}Query.queryKey(params), ()=> use${componentName}Query.fetch(params));
 
+    use${componentName}Query.cancelQueries = (params: ${componentName}Variables) => queryClient.cancelQueries(use${componentName}Query.queryKey(params))
     use${componentName}Query.invalidate = (params: ${componentName}Variables) =>
       queryClient.invalidateQueries<${componentName}Response>(use${componentName}Query.queryKey(params));
 
@@ -428,7 +436,7 @@ const generateRestfulComponent = ({ operation, verb, route, operationIds, parame
     }
     export function use${componentName}Query<T = ${componentName}Response>({ options = {}, ...props }: ${componentName}QueryProps<T>) { 
       return useQuery(use${componentName}Query.queryKey(props), async () => use${componentName}Query.fetch(props), 
-      { enabled: !!props.${paramsInPath.join(' && !!props.')}, ...options }
+      { enabled: ${enabledParam}, ...options }
     );}
 
     type ${componentName}MutationProps<T> = {
@@ -466,6 +474,7 @@ const generateRestfulComponent = ({ operation, verb, route, operationIds, parame
     use${componentName}Query.prefetch = (params: ${componentName}Variables) =>
     queryClient.prefetchQuery<${componentName}Response>(use${componentName}Query.queryKey(params), ()=> use${componentName}Query.fetch(params));
 
+    use${componentName}Query.cancelQueries = (params: ${componentName}Variables) => queryClient.cancelQueries(use${componentName}Query.queryKey(params))
     use${componentName}Query.invalidate = (params: ${componentName}Variables) =>
       queryClient.invalidateQueries<${componentName}Response>(use${componentName}Query.queryKey(params));
       
@@ -473,7 +482,8 @@ const generateRestfulComponent = ({ operation, verb, route, operationIds, parame
       options?: UseQueryOptions<${componentName}Response, AxiosError, T, any> 
     }
     export function use${componentName}Query<T = ${componentName}Response>({ options = {}, ...props }: ${componentName}QueryProps<T>) { 
-    return useQuery(use${componentName}Query.queryKey(props), async () => use${componentName}Query.fetch(props), { enabled: !!props.${paramsInPath.join(' && !!props.')}, ...options }
+    return useQuery(use${componentName}Query.queryKey(props), async () => use${componentName}Query.fetch(props), { 
+      enabled: ${enabledParam}, ...options }
     );}
     
     type ${componentName}MutationProps<T> = {
@@ -503,6 +513,7 @@ const generateRestfulComponent = ({ operation, verb, route, operationIds, parame
     use${componentName}Query.prefetch = () =>
     queryClient.prefetchQuery<${componentName}Response>(use${componentName}Query.queryKey(), ()=> use${componentName}Query.fetch());
 
+    use${componentName}Query.cancelQueries = () => queryClient.cancelQueries(use${componentName}Query.queryKey())
     use${componentName}Query.invalidate = () =>
       queryClient.invalidateQueries<${componentName}Response>(use${componentName}Query.queryKey());
 
@@ -549,12 +560,13 @@ const generateRestfulComponent = ({ operation, verb, route, operationIds, parame
     use${componentName}Query.prefetch = (params: ${componentName}Variables) =>
     queryClient.prefetchQuery<${componentName}Response>(use${componentName}Query.queryKey(params), ()=> use${componentName}Query.fetch(params));
 
+    use${componentName}Query.cancelQueries = (params: ${componentName}Variables) => queryClient.cancelQueries(use${componentName}Query.queryKey(params))
     use${componentName}Query.invalidate = (params: ${componentName}Variables) =>
       queryClient.invalidateQueries<${componentName}Response>(use${componentName}Query.queryKey(params));
 
     export function use${componentName}Query<T = ${componentName}Response>({ options = {}, ...props }: ${componentName}Variables & { options?: UseQueryOptions<${componentName}Response, AxiosError, T, any>}) { 
     return useQuery(use${componentName}Query.queryKey(props), async () => use${componentName}Query.fetch(props), 
-    { enabled: !!props${queryParams.map((param) => `["${param.name}"]`).join(' && !!props')}, ...options }
+    { enabled: ${enabledParam}, ...options }
     );}
     
     export function use${componentName}Mutation<T = ${componentName}Response>(props?: { options?: UseMutationOptions<${componentName}Response, AxiosError, ${componentName}Variables, T>}) { 
@@ -585,6 +597,7 @@ const generateRestfulComponent = ({ operation, verb, route, operationIds, parame
     use${componentName}Query.prefetch = (params: ${componentName}Variables) =>
     queryClient.prefetchQuery<${componentName}Response>(use${componentName}Query.queryKey(params), ()=> use${componentName}Query.fetch(params));
 
+    use${componentName}Query.cancelQueries = (params: ${componentName}Variables) => queryClient.cancelQueries(use${componentName}Query.queryKey(params))
     use${componentName}Query.invalidate = (params: ${componentName}Variables) =>
       queryClient.invalidateQueries<${componentName}Response>(use${componentName}Query.queryKey(params));
 
@@ -608,7 +621,9 @@ const generateRestfulComponent = ({ operation, verb, route, operationIds, parame
         output += `
     type ${componentName}Response = ${genericsTypes}
     type ${componentName}Variables = {
-      body: ${requestBodyComponent}${paramsTypes}}
+      body: ${requestBodyComponent}
+      ${paramsTypes}
+    }
 
     type ${componentName}QueryProps<T = ${componentName}Response> =  ${componentName}Variables & {
       options?: UseQueryOptions<${componentName}Response, AxiosError, T, any> 
@@ -631,12 +646,14 @@ const generateRestfulComponent = ({ operation, verb, route, operationIds, parame
     use${componentName}Query.prefetch = (params: ${componentName}Variables) =>
     queryClient.prefetchQuery<${componentName}Response>(use${componentName}Query.queryKey(params), ()=> use${componentName}Query.fetch(params));
 
+    use${componentName}Query.cancelQueries = (params: ${componentName}Variables) => queryClient.cancelQueries(use${componentName}Query.queryKey(params))
     use${componentName}Query.invalidate = (params: ${componentName}Variables) =>
       queryClient.invalidateQueries<${componentName}Response>(use${componentName}Query.queryKey(params));
 
 
     export function use${componentName}Query<T = ${componentName}Response>({ options = {}, ...props }: ${componentName}QueryProps<T>) { 
-    return useQuery(use${componentName}Query.queryKey(props), async () =>  use${componentName}Query.fetch(props), { enabled: !!props.${paramsInPath.join(' && !!props.')}, ...options }
+    return useQuery(use${componentName}Query.queryKey(props), async () =>  use${componentName}Query.fetch(props), { 
+      enabled: ${enabledParam}, ...options }
     );}
     
     type ${componentName}MutationProps<T> = {
@@ -678,14 +695,14 @@ const generateRestfulComponent = ({ operation, verb, route, operationIds, parame
     use${componentName}Query.prefetch = (params: ${componentName}Variables) =>
     queryClient.prefetchQuery<${componentName}Response>(use${componentName}Query.queryKey(params), ()=> use${componentName}Query.fetch(params));
 
+    use${componentName}Query.cancelQueries = (params: ${componentName}Variables) => queryClient.cancelQueries(use${componentName}Query.queryKey(params))
     use${componentName}Query.invalidate = (params: ${componentName}Variables) =>
       queryClient.invalidateQueries<${componentName}Response>(use${componentName}Query.queryKey(params));
 
 
     export function use${componentName}Query<T = ${componentName}Response>({ options = {}, ...props }: ${componentName}QueryProps<T>) { 
-    return useQuery(use${componentName}Query.queryKey(props), async () =>  use${componentName}Query.fetch(props), { enabled: !!props${queryParams
-            .map((param) => `["${param.name}"]`)
-            .join(' && !!props')}, ...options }
+    return useQuery(use${componentName}Query.queryKey(props), async () =>  use${componentName}Query.fetch(props), { 
+      enabled: ${enabledParam}, ...options }
     );}
     
     
@@ -736,6 +753,7 @@ const generateRestfulComponent = ({ operation, verb, route, operationIds, parame
     use${componentName}Query.prefetch = (params: ${componentName}Variables) =>
     queryClient.prefetchQuery<${componentName}Response>(use${componentName}Query.queryKey(params), ()=> use${componentName}Query.fetch(params));
 
+    use${componentName}Query.cancelQueries = (params: ${componentName}Variables) => queryClient.cancelQueries(use${componentName}Query.queryKey(params))
     use${componentName}Query.invalidate = (params: ${componentName}Variables) =>
       queryClient.invalidateQueries<${componentName}Response>(use${componentName}Query.queryKey(params));
 
@@ -745,7 +763,7 @@ const generateRestfulComponent = ({ operation, verb, route, operationIds, parame
     }
     export function use${componentName}Query<T = ${componentName}Response>({ options = {}, ...props }: ${componentName}QueryProps<T>) { 
       return useQuery(use${componentName}Query.queryKey(props), async () => use${componentName}Query.fetch(props), 
-      { enabled: !!props${headerParams.map((param) => `["${param.name}"]`).join(' && !!props')}, ...options }
+      { enabled: ${enabledParam}, ...options }
       );}
 
 
@@ -789,7 +807,8 @@ const generateRestfulComponent = ({ operation, verb, route, operationIds, parame
     use${componentName}Query.prefetch = (params: ${componentName}Variables) =>
       queryClient.prefetchQuery<${componentName}Response>(use${componentName}Query.queryKey(params), ()=> use${componentName}Query.fetch(params));
 
-    use${componentName}Query.invalidate = (params: ${componentName}Variables) =>
+    use${componentName}Query.cancelQueries = (params: ${componentName}Variables) => queryClient.cancelQueries(use${componentName}Query.queryKey(params))
+      use${componentName}Query.invalidate = (params: ${componentName}Variables) =>
       queryClient.invalidateQueries<${componentName}Response>(use${componentName}Query.queryKey(params));
 
     type ${componentName}QueryProps<T = ${componentName}Response> = ${componentName}Variables & {
@@ -797,9 +816,7 @@ const generateRestfulComponent = ({ operation, verb, route, operationIds, parame
     }
     export function use${componentName}Query<T = ${componentName}Response>({ options = {}, ...props }: ${componentName}QueryProps<T>) { 
     return useQuery(use${componentName}Query.queryKey(props), async () => use${componentName}Query.fetch(props), 
-    { enabled: !!props${[...queryParams, ...headerParams]
-            .map((param) => `["${param.name}"]`)
-            .join(' && !!props')}, ...options }
+    {  enabled: ${enabledParam}, ...options }
     );}
     
     type ${componentName}MutationProps<T> = {
@@ -840,6 +857,7 @@ const generateRestfulComponent = ({ operation, verb, route, operationIds, parame
     use${componentName}Query.prefetch = (params: ${componentName}Variables) =>
     queryClient.prefetchQuery<${componentName}Response>(use${componentName}Query.queryKey(params), ()=> use${componentName}Query.fetch(params));
 
+    use${componentName}Query.cancelQueries = (params: ${componentName}Variables) => queryClient.cancelQueries(use${componentName}Query.queryKey(params))
     use${componentName}Query.invalidate = (params: ${componentName}Variables) =>
       queryClient.invalidateQueries<${componentName}Response>(use${componentName}Query.queryKey(params));
 
@@ -847,9 +865,8 @@ const generateRestfulComponent = ({ operation, verb, route, operationIds, parame
       options?: UseQueryOptions<${componentName}Response, AxiosError, T, any> 
     }
     export function use${componentName}Query<T = ${componentName}Response>({ options = {}, ...body }: ${componentName}QueryProps<T>) { 
-      return useQuery(use${componentName}Query.queryKey(body), async () => use${componentName}Query.fetch(body),{ enabled: !!body${headerParams
-            .map((param) => `["${param.name}"]`)
-            .join(' && !!props')}, ...options }
+      return useQuery(use${componentName}Query.queryKey(body), async () => use${componentName}Query.fetch(body),{ 
+        enabled: ${enabledParam}, ...options }
     );}
 
     

package/lib/esm/import-open-api.js

@@ -321,6 +321,13 @@ export const generateRestfulComponent = ({ operation, verb, route, operationIds,
         }
     }), 'in');
     const headerParams = header.filter((p) => !headerFilters?.includes(p.name));
+    let enabled = [];
+    [...queryParams, ...pathParams, ...headerParams].forEach((item) => {
+        if (item.required) {
+            enabled.push(`["${item.name}"]`);
+        }
+    });
+    const enabledParam = `!!props${enabled.join(' && !!props')}`;
     const paramsTypes = paramsInPath
         .map((p) => {
         try {
@@ -400,6 +407,7 @@ export const generateRestfulComponent = ({ operation, verb, route, operationIds,
     use${componentName}Query.prefetch = (params: ${componentName}Variables) =>
     queryClient.prefetchQuery<${componentName}Response>(use${componentName}Query.queryKey(params), ()=> use${componentName}Query.fetch(params));
 
+    use${componentName}Query.cancelQueries = (params: ${componentName}Variables) => queryClient.cancelQueries(use${componentName}Query.queryKey(params))
     use${componentName}Query.invalidate = (params: ${componentName}Variables) =>
       queryClient.invalidateQueries<${componentName}Response>(use${componentName}Query.queryKey(params));
 
@@ -408,7 +416,7 @@ export const generateRestfulComponent = ({ operation, verb, route, operationIds,
     }
     export function use${componentName}Query<T = ${componentName}Response>({ options = {}, ...props }: ${componentName}QueryProps<T>) { 
       return useQuery(use${componentName}Query.queryKey(props), async () => use${componentName}Query.fetch(props), 
-      { enabled: !!props.${paramsInPath.join(' && !!props.')}, ...options }
+      { enabled: ${enabledParam}, ...options }
     );}
 
     type ${componentName}MutationProps<T> = {
@@ -446,6 +454,7 @@ export const generateRestfulComponent = ({ operation, verb, route, operationIds,
     use${componentName}Query.prefetch = (params: ${componentName}Variables) =>
     queryClient.prefetchQuery<${componentName}Response>(use${componentName}Query.queryKey(params), ()=> use${componentName}Query.fetch(params));
 
+    use${componentName}Query.cancelQueries = (params: ${componentName}Variables) => queryClient.cancelQueries(use${componentName}Query.queryKey(params))
     use${componentName}Query.invalidate = (params: ${componentName}Variables) =>
       queryClient.invalidateQueries<${componentName}Response>(use${componentName}Query.queryKey(params));
       
@@ -453,7 +462,8 @@ export const generateRestfulComponent = ({ operation, verb, route, operationIds,
       options?: UseQueryOptions<${componentName}Response, AxiosError, T, any> 
     }
     export function use${componentName}Query<T = ${componentName}Response>({ options = {}, ...props }: ${componentName}QueryProps<T>) { 
-    return useQuery(use${componentName}Query.queryKey(props), async () => use${componentName}Query.fetch(props), { enabled: !!props.${paramsInPath.join(' && !!props.')}, ...options }
+    return useQuery(use${componentName}Query.queryKey(props), async () => use${componentName}Query.fetch(props), { 
+      enabled: ${enabledParam}, ...options }
     );}
     
     type ${componentName}MutationProps<T> = {
@@ -483,6 +493,7 @@ export const generateRestfulComponent = ({ operation, verb, route, operationIds,
     use${componentName}Query.prefetch = () =>
     queryClient.prefetchQuery<${componentName}Response>(use${componentName}Query.queryKey(), ()=> use${componentName}Query.fetch());
 
+    use${componentName}Query.cancelQueries = () => queryClient.cancelQueries(use${componentName}Query.queryKey())
     use${componentName}Query.invalidate = () =>
       queryClient.invalidateQueries<${componentName}Response>(use${componentName}Query.queryKey());
 
@@ -529,12 +540,13 @@ export const generateRestfulComponent = ({ operation, verb, route, operationIds,
     use${componentName}Query.prefetch = (params: ${componentName}Variables) =>
     queryClient.prefetchQuery<${componentName}Response>(use${componentName}Query.queryKey(params), ()=> use${componentName}Query.fetch(params));
 
+    use${componentName}Query.cancelQueries = (params: ${componentName}Variables) => queryClient.cancelQueries(use${componentName}Query.queryKey(params))
     use${componentName}Query.invalidate = (params: ${componentName}Variables) =>
       queryClient.invalidateQueries<${componentName}Response>(use${componentName}Query.queryKey(params));
 
     export function use${componentName}Query<T = ${componentName}Response>({ options = {}, ...props }: ${componentName}Variables & { options?: UseQueryOptions<${componentName}Response, AxiosError, T, any>}) { 
     return useQuery(use${componentName}Query.queryKey(props), async () => use${componentName}Query.fetch(props), 
-    { enabled: !!props${queryParams.map((param) => `["${param.name}"]`).join(' && !!props')}, ...options }
+    { enabled: ${enabledParam}, ...options }
     );}
     
     export function use${componentName}Mutation<T = ${componentName}Response>(props?: { options?: UseMutationOptions<${componentName}Response, AxiosError, ${componentName}Variables, T>}) { 
@@ -565,6 +577,7 @@ export const generateRestfulComponent = ({ operation, verb, route, operationIds,
     use${componentName}Query.prefetch = (params: ${componentName}Variables) =>
     queryClient.prefetchQuery<${componentName}Response>(use${componentName}Query.queryKey(params), ()=> use${componentName}Query.fetch(params));
 
+    use${componentName}Query.cancelQueries = (params: ${componentName}Variables) => queryClient.cancelQueries(use${componentName}Query.queryKey(params))
     use${componentName}Query.invalidate = (params: ${componentName}Variables) =>
       queryClient.invalidateQueries<${componentName}Response>(use${componentName}Query.queryKey(params));
 
@@ -588,7 +601,9 @@ export const generateRestfulComponent = ({ operation, verb, route, operationIds,
         output += `
     type ${componentName}Response = ${genericsTypes}
     type ${componentName}Variables = {
-      body: ${requestBodyComponent}${paramsTypes}}
+      body: ${requestBodyComponent}
+      ${paramsTypes}
+    }
 
     type ${componentName}QueryProps<T = ${componentName}Response> =  ${componentName}Variables & {
       options?: UseQueryOptions<${componentName}Response, AxiosError, T, any> 
@@ -611,12 +626,14 @@ export const generateRestfulComponent = ({ operation, verb, route, operationIds,
     use${componentName}Query.prefetch = (params: ${componentName}Variables) =>
     queryClient.prefetchQuery<${componentName}Response>(use${componentName}Query.queryKey(params), ()=> use${componentName}Query.fetch(params));
 
+    use${componentName}Query.cancelQueries = (params: ${componentName}Variables) => queryClient.cancelQueries(use${componentName}Query.queryKey(params))
     use${componentName}Query.invalidate = (params: ${componentName}Variables) =>
       queryClient.invalidateQueries<${componentName}Response>(use${componentName}Query.queryKey(params));
 
 
     export function use${componentName}Query<T = ${componentName}Response>({ options = {}, ...props }: ${componentName}QueryProps<T>) { 
-    return useQuery(use${componentName}Query.queryKey(props), async () =>  use${componentName}Query.fetch(props), { enabled: !!props.${paramsInPath.join(' && !!props.')}, ...options }
+    return useQuery(use${componentName}Query.queryKey(props), async () =>  use${componentName}Query.fetch(props), { 
+      enabled: ${enabledParam}, ...options }
     );}
     
     type ${componentName}MutationProps<T> = {
@@ -658,14 +675,14 @@ export const generateRestfulComponent = ({ operation, verb, route, operationIds,
     use${componentName}Query.prefetch = (params: ${componentName}Variables) =>
     queryClient.prefetchQuery<${componentName}Response>(use${componentName}Query.queryKey(params), ()=> use${componentName}Query.fetch(params));
 
+    use${componentName}Query.cancelQueries = (params: ${componentName}Variables) => queryClient.cancelQueries(use${componentName}Query.queryKey(params))
     use${componentName}Query.invalidate = (params: ${componentName}Variables) =>
       queryClient.invalidateQueries<${componentName}Response>(use${componentName}Query.queryKey(params));
 
 
     export function use${componentName}Query<T = ${componentName}Response>({ options = {}, ...props }: ${componentName}QueryProps<T>) { 
-    return useQuery(use${componentName}Query.queryKey(props), async () =>  use${componentName}Query.fetch(props), { enabled: !!props${queryParams
-            .map((param) => `["${param.name}"]`)
-            .join(' && !!props')}, ...options }
+    return useQuery(use${componentName}Query.queryKey(props), async () =>  use${componentName}Query.fetch(props), { 
+      enabled: ${enabledParam}, ...options }
     );}
     
     
@@ -716,6 +733,7 @@ export const generateRestfulComponent = ({ operation, verb, route, operationIds,
     use${componentName}Query.prefetch = (params: ${componentName}Variables) =>
     queryClient.prefetchQuery<${componentName}Response>(use${componentName}Query.queryKey(params), ()=> use${componentName}Query.fetch(params));
 
+    use${componentName}Query.cancelQueries = (params: ${componentName}Variables) => queryClient.cancelQueries(use${componentName}Query.queryKey(params))
     use${componentName}Query.invalidate = (params: ${componentName}Variables) =>
       queryClient.invalidateQueries<${componentName}Response>(use${componentName}Query.queryKey(params));
 
@@ -725,7 +743,7 @@ export const generateRestfulComponent = ({ operation, verb, route, operationIds,
     }
     export function use${componentName}Query<T = ${componentName}Response>({ options = {}, ...props }: ${componentName}QueryProps<T>) { 
       return useQuery(use${componentName}Query.queryKey(props), async () => use${componentName}Query.fetch(props), 
-      { enabled: !!props${headerParams.map((param) => `["${param.name}"]`).join(' && !!props')}, ...options }
+      { enabled: ${enabledParam}, ...options }
       );}
 
 
@@ -769,7 +787,8 @@ export const generateRestfulComponent = ({ operation, verb, route, operationIds,
     use${componentName}Query.prefetch = (params: ${componentName}Variables) =>
       queryClient.prefetchQuery<${componentName}Response>(use${componentName}Query.queryKey(params), ()=> use${componentName}Query.fetch(params));
 
-    use${componentName}Query.invalidate = (params: ${componentName}Variables) =>
+    use${componentName}Query.cancelQueries = (params: ${componentName}Variables) => queryClient.cancelQueries(use${componentName}Query.queryKey(params))
+      use${componentName}Query.invalidate = (params: ${componentName}Variables) =>
       queryClient.invalidateQueries<${componentName}Response>(use${componentName}Query.queryKey(params));
 
     type ${componentName}QueryProps<T = ${componentName}Response> = ${componentName}Variables & {
@@ -777,9 +796,7 @@ export const generateRestfulComponent = ({ operation, verb, route, operationIds,
     }
     export function use${componentName}Query<T = ${componentName}Response>({ options = {}, ...props }: ${componentName}QueryProps<T>) { 
     return useQuery(use${componentName}Query.queryKey(props), async () => use${componentName}Query.fetch(props), 
-    { enabled: !!props${[...queryParams, ...headerParams]
-            .map((param) => `["${param.name}"]`)
-            .join(' && !!props')}, ...options }
+    {  enabled: ${enabledParam}, ...options }
     );}
     
     type ${componentName}MutationProps<T> = {
@@ -820,6 +837,7 @@ export const generateRestfulComponent = ({ operation, verb, route, operationIds,
     use${componentName}Query.prefetch = (params: ${componentName}Variables) =>
     queryClient.prefetchQuery<${componentName}Response>(use${componentName}Query.queryKey(params), ()=> use${componentName}Query.fetch(params));
 
+    use${componentName}Query.cancelQueries = (params: ${componentName}Variables) => queryClient.cancelQueries(use${componentName}Query.queryKey(params))
     use${componentName}Query.invalidate = (params: ${componentName}Variables) =>
       queryClient.invalidateQueries<${componentName}Response>(use${componentName}Query.queryKey(params));
 
@@ -827,9 +845,8 @@ export const generateRestfulComponent = ({ operation, verb, route, operationIds,
       options?: UseQueryOptions<${componentName}Response, AxiosError, T, any> 
     }
     export function use${componentName}Query<T = ${componentName}Response>({ options = {}, ...body }: ${componentName}QueryProps<T>) { 
-      return useQuery(use${componentName}Query.queryKey(body), async () => use${componentName}Query.fetch(body),{ enabled: !!body${headerParams
-            .map((param) => `["${param.name}"]`)
-            .join(' && !!props')}, ...options }
+      return useQuery(use${componentName}Query.queryKey(body), async () => use${componentName}Query.fetch(body),{ 
+        enabled: ${enabledParam}, ...options }
     );}
 
     

package/lib/scripts/import-open-api.js

@@ -0,0 +1,605 @@
+import { pascal } from 'case';
+import get from 'lodash/get';
+import groupBy from 'lodash/groupBy';
+import isEmpty from 'lodash/isEmpty';
+import set from 'lodash/set';
+import uniq from 'lodash/uniq';
+import swagger2openapi from 'swagger2openapi';
+const yaml = require('js-yaml');
+const IdentifierRegexp = /^[a-zA-Z_$][a-zA-Z0-9_$]*$/;
+/**
+ * Import and parse the openapi spec from a yaml/json
+ */
+const importSpecs = (data, extension) => {
+    const schema = extension === 'yaml' ? yaml.load(data) : JSON.parse(data);
+    return new Promise((resolve, reject) => {
+        if (!schema.openapi || !schema.openapi.startsWith('3.')) {
+            swagger2openapi.convertObj(schema, {}, (err, convertedObj) => {
+                if (err) {
+                    reject(err);
+                }
+                else {
+                    resolve(convertedObj.openapi);
+                }
+            });
+        }
+        else {
+            resolve(schema);
+        }
+    });
+};
+/**
+ * Discriminator helper for `ReferenceObject`
+ */
+export const isReference = (property) => {
+    return Boolean(property.$ref);
+};
+/**
+ * Return the typescript equivalent of open-api data type
+ */
+export const getScalar = (item) => {
+    const nullable = item.nullable ? ' | null' : '';
+    switch (item.type) {
+        case 'number':
+        case 'integer':
+            return 'number' + nullable;
+        case 'boolean':
+            return 'boolean' + nullable;
+        case 'array':
+            return getArray(item) + nullable;
+        case 'string':
+            return (item.enum ? `"${item.enum.join(`" | "`)}"` : 'string') + nullable;
+        case 'object':
+        default:
+            return getObject(item) + nullable;
+    }
+};
+/**
+ * Return the output type from the $ref
+ */
+export const getRef = ($ref) => {
+    if ($ref.startsWith('#/components/schemas')) {
+        return pascal($ref.replace('#/components/schemas/', ''));
+    }
+    else if ($ref.startsWith('#/components/responses')) {
+        return pascal($ref.replace('#/components/responses/', '')) + 'Response';
+    }
+    else if ($ref.startsWith('#/components/parameters')) {
+        return pascal($ref.replace('#/components/parameters/', '')) + 'Parameter';
+    }
+    else if ($ref.startsWith('#/components/requestBodies')) {
+        return pascal($ref.replace('#/components/requestBodies/', '')) + 'RequestBody';
+    }
+    else {
+        throw new Error('This library only resolve $ref that are include into `#/components/*` for now');
+    }
+};
+/**
+ * Return the output type from an array
+ */
+export const getArray = (item) => {
+    if (item.items) {
+        if (!isReference(item.items) && (item.items.oneOf || item.items.allOf || item.items.enum)) {
+            return `(${resolveValue(item.items)})[]`;
+        }
+        else {
+            return `${resolveValue(item.items)}[]`;
+        }
+    }
+    else {
+        throw new Error('All arrays must have an `items` key define');
+    }
+};
+/**
+ * Return the output type from an object
+ */
+export const getObject = (item) => {
+    if (isReference(item)) {
+        return getRef(item.$ref);
+    }
+    if (item.allOf) {
+        return item.allOf.map(resolveValue).join(' & ');
+    }
+    if (item.oneOf) {
+        return item.oneOf.map(resolveValue).join(' | ');
+    }
+    if (!item.type && !item.properties && !item.additionalProperties) {
+        return '{}';
+    }
+    // Free form object (https://swagger.io/docs/specification/data-models/data-types/#free-form)
+    if (item.type === 'object' &&
+        !item.properties &&
+        (!item.additionalProperties || item.additionalProperties === true || isEmpty(item.additionalProperties))) {
+        return '{[key: string]: any}';
+    }
+    // Consolidation of item.properties & item.additionalProperties
+    let output = '{\n';
+    if (item.properties) {
+        output += Object.entries(item.properties)
+            .map(([key, prop]) => {
+            const doc = isReference(prop) ? '' : formatDescription(prop.description, 2);
+            const isRequired = (item.required || []).includes(key);
+            const processedKey = IdentifierRegexp.test(key) ? key : `"${key}"`;
+            return `  ${doc}${processedKey}${isRequired ? '' : '?'}: ${resolveValue(prop)};`;
+        })
+            .join('\n');
+    }
+    if (item.additionalProperties) {
+        if (item.properties) {
+            output += '\n';
+        }
+        output += `  [key: string]: ${item.additionalProperties === true ? 'any' : resolveValue(item.additionalProperties)};`;
+    }
+    if (item.properties || item.additionalProperties) {
+        if (output === '{\n') {
+            return '{}';
+        }
+        return output + '\n}';
+    }
+    return item.type === 'object' ? '{[key: string]: any}' : 'any';
+};
+/**
+ * Resolve the value of a schema object to a proper type definition.
+ */
+export const resolveValue = (schema) => isReference(schema) ? getRef(schema.$ref) : getScalar(schema);
+/**
+ * Extract responses / request types from open-api specs
+ */
+export const getResReqTypes = (responsesOrRequests) => uniq(responsesOrRequests.map(([_, res]) => {
+    if (!res) {
+        return 'void';
+    }
+    if (isReference(res)) {
+        return getRef(res.$ref);
+    }
+    if (res.content) {
+        for (let contentType of Object.keys(res.content)) {
+            if (contentType.startsWith('application/json') ||
+                contentType.startsWith('application/octet-stream')) {
+                const schema = res.content[contentType].schema;
+                return resolveValue(schema);
+            }
+        }
+        return 'void';
+    }
+    return 'void';
+})).join(' | ');
+/**
+ * Return every params in a path
+ *
+ * @example
+ * ```
+ * getParamsInPath("/pet/{category}/{name}/");
+ * // => ["category", "name"]
+ * ```
+ */
+export const getParamsInPath = (path) => {
+    let n;
+    const output = [];
+    const templatePathRegex = /\{(\w+)}/g;
+    while ((n = templatePathRegex.exec(path)) !== null) {
+        output.push(n[1]);
+    }
+    return output;
+};
+/**
+ * Generate the interface string
+ */
+export const generateInterface = (name, schema) => {
+    const scalar = getScalar(schema);
+    return `${formatDescription(schema.description)}export interface ${pascal(name)} ${scalar}`;
+};
+/**
+ * Propagate every `discriminator.propertyName` mapping to the original ref
+ *
+ * Note: This method directly mutate the `specs` object.
+ */
+export const resolveDiscriminator = (specs) => {
+    if (specs.components && specs.components.schemas) {
+        Object.values(specs.components.schemas).forEach((schema) => {
+            if (isReference(schema) || !schema.discriminator || !schema.discriminator.mapping) {
+                return;
+            }
+            const { mapping, propertyName } = schema.discriminator;
+            Object.entries(mapping).forEach(([name, ref]) => {
+                if (!ref.startsWith('#/components/schemas/')) {
+                    throw new Error('Discriminator mapping outside of `#/components/schemas` is not supported');
+                }
+                set(specs, `components.schemas.${ref.slice('#/components/schemas/'.length)}.properties.${propertyName}.enum`, [name]);
+            });
+        });
+    }
+};
+/**
+ * Extract all types from #/components/schemas
+ */
+export const generateSchemasDefinition = (schemas = {}) => {
+    if (isEmpty(schemas)) {
+        return '';
+    }
+    return (Object.entries(schemas)
+        .map(([name, schema]) => !isReference(schema) &&
+        (!schema.type || schema.type === 'object') &&
+        !schema.allOf &&
+        !schema.oneOf &&
+        !isReference(schema) &&
+        !schema.nullable
+        ? generateInterface(name, schema)
+        : `${formatDescription(isReference(schema) ? undefined : schema.description)}export type ${pascal(name)} = ${resolveValue(schema)};`)
+        .join('\n\n') + '\n');
+};
+/**
+ * Extract all types from #/components/requestBodies
+ */
+export const generateRequestBodiesDefinition = (requestBodies = {}) => {
+    if (isEmpty(requestBodies)) {
+        return '';
+    }
+    return ('\n' +
+        Object.entries(requestBodies)
+            .map(([name, requestBody]) => {
+            const doc = isReference(requestBody) ? '' : formatDescription(requestBody.description);
+            const type = getResReqTypes([['', requestBody]]);
+            const isEmptyInterface = type === '{}';
+            if (isEmptyInterface) {
+                return `export interface ${pascal(name)}RequestBody ${type}`;
+            }
+            else if (type.includes('{') && !type.includes('|') && !type.includes('&')) {
+                return `${doc}export interface ${pascal(name)}RequestBody ${type}`;
+            }
+            else {
+                return `${doc}export type ${pascal(name)}RequestBody = ${type};`;
+            }
+        })
+            .join('\n\n') +
+        '\n');
+};
+/**
+ * Extract all types from #/components/responses
+ */
+export const generateResponsesDefinition = (responses = {}) => {
+    if (isEmpty(responses)) {
+        return '';
+    }
+    return ('\n' +
+        Object.entries(responses)
+            .map(([name, response]) => {
+            const doc = isReference(response) ? '' : formatDescription(response.description);
+            const type = getResReqTypes([['', response]]);
+            const isEmptyInterface = type === '{}';
+            if (isEmptyInterface) {
+                return `export interface RQ${pascal(name)}Response ${type}`;
+            }
+            else if (type.includes('{') && !type.includes('|') && !type.includes('&')) {
+                return `${doc}export interface RQ${pascal(name)}Response ${type}`;
+            }
+            else {
+                return `${doc}export type RQ${pascal(name)}Response = ${type};`;
+            }
+        })
+            .join('\n\n') +
+        '\n');
+};
+/**
+ * Format a description to code documentation.
+ */
+export const formatDescription = (description, tabSize = 0) => description
+    ? `/**\n${description
+        .split('\n')
+        .map((i) => `${' '.repeat(tabSize)} * ${i}`)
+        .join('\n')}\n${' '.repeat(tabSize)} */\n${' '.repeat(tabSize)}`
+    : '';
+/**
+ * Generate a react-query component from openapi operation specs
+ */
+export const generateRestfulComponent = (operation, verb, route, operationIds, parameters = [], schemasComponents) => {
+    if (!operation.operationId) {
+        throw new Error(`Every path must have a operationId - No operationId set for ${verb} ${route}`);
+    }
+    if (operationIds.includes(operation.operationId)) {
+        throw new Error(`"${operation.operationId}" is duplicated in your schema definition!`);
+    }
+    operationIds.push(operation.operationId);
+    route = route.replace(/\{/g, '${'); // `/pet/{id}` => `/pet/${id}`
+    // Remove the last param of the route if we are in the DELETE case
+    let lastParamInTheRoute = null;
+    const componentName = pascal(operation.operationId);
+    const isOk = ([statusCode]) => statusCode.toString().startsWith('2');
+    const responseTypes = getResReqTypes(Object.entries(operation.responses).filter(isOk)) || 'void';
+    const requestBodyTypes = getResReqTypes([['body', operation.requestBody]]);
+    const needAResponseComponent = true;
+    const paramsInPath = getParamsInPath(route).filter((param) => !(verb === 'delete' && param === lastParamInTheRoute));
+    const { query: queryParams = [], path: pathParams = [] } = groupBy([...parameters, ...(operation.parameters || [])].map((p) => {
+        if (isReference(p)) {
+            return get(schemasComponents, p.$ref.replace('#/components/', '').replace('/', '.'));
+        }
+        else {
+            return p;
+        }
+    }), 'in');
+    const paramsTypes = paramsInPath
+        .map((p) => {
+        try {
+            const { name, required, schema } = pathParams.find((i) => i.name === p);
+            return `${name}${required ? '' : '?'}: ${resolveValue(schema)}`;
+        }
+        catch (err) {
+            throw new Error(`The path params ${p} can't be found in parameters (${operation.operationId})`);
+        }
+    })
+        .join('; ');
+    const queryParamsType = queryParams
+        .map((p) => {
+        const processedName = IdentifierRegexp.test(p.name) ? p.name : `"${p.name}"`;
+        return `${formatDescription(p.description, 2)}${processedName}${p.required ? '' : '?'}: ${resolveValue(p.schema)}`;
+    })
+        .join(';\n  ');
+    // Retrieve the type of the param for delete verb
+    const lastParamInTheRouteDefinition = operation.parameters && lastParamInTheRoute
+        ? operation.parameters.find((p) => {
+            if (isReference(p)) {
+                return false;
+            }
+            return p.name === lastParamInTheRoute;
+        }) // Reference is not possible
+        : { schema: { type: 'string' } };
+    if (!lastParamInTheRouteDefinition) {
+        throw new Error(`The path params ${lastParamInTheRoute} can't be found in parameters (${operation.operationId})`);
+    }
+    let genericsTypes = `${needAResponseComponent ? componentName + 'Res' : responseTypes}`;
+    if (verb !== 'get') {
+        genericsTypes = `${needAResponseComponent ? componentName + 'Res' : responseTypes}`;
+    }
+    const description = formatDescription(operation.summary && operation.description
+        ? `${operation.summary}\n\n${operation.description}`
+        : `${operation.summary || ''}${operation.description || ''}`);
+    let output = `\n\n${description}`;
+    const typeOrInterface = `type ${componentName}Res =`;
+    output += `
+  ${needAResponseComponent ? `export ${typeOrInterface} ${responseTypes}` : ''}
+  `;
+    const queryParam = queryParamsType && queryParamsType !== 'void' ? `${queryParamsType}` : '';
+    const requestBodyComponent = requestBodyTypes && requestBodyTypes !== 'void' ? `${requestBodyTypes}` : '';
+    // QUERIES
+    if (!requestBodyComponent && paramsInPath.length && !queryParam) {
+        output += `
+    type ${componentName}Params = {${paramsTypes}};
+    use${componentName}Query.fetch = async (props: ${componentName}Params ) => {
+      const result = await api.${verb}<${genericsTypes}>(\`${route.replace(/\{/g, '{props.')}\`);
+      return result.data;
+    }
+    
+    use${componentName}Query.baseKey = (): QueryKey => ["${componentName.toLowerCase()}"];
+    use${componentName}Query.queryKey = (params: ${componentName}Params ): QueryKey => [...use${componentName}Query.baseKey(), params];
+
+    type ${componentName}QueryProps<T = ${genericsTypes}> = {
+      options?: UseQueryOptions<${genericsTypes}, AxiosError, T, any> 
+    } & ${componentName}Params
+    
+    export function use${componentName}Query<T = ${genericsTypes}>({ options = {}, ...props }: ${componentName}QueryProps<T>) { 
+      return useQuery(use${componentName}Query.queryKey(props), async () => use${componentName}Query.fetch(props), 
+      { enabled: !!props.${paramsInPath.join(' && !!props.')}, ...options }
+    );}
+  
+    type ${componentName}MutationProps<T> = {
+      options?: UseMutationOptions<${genericsTypes}, AxiosError, ${componentName}Params, T> 
+    }
+    export function use${componentName}Mutation<T = ${genericsTypes}>(props?: ${componentName}MutationProps<T>) { 
+    return useMutation(async ({${paramsInPath.join(', ')}}) => {
+      const result = await api.${verb}<${genericsTypes}>(\`${route}\`) 
+      return result.data
+    },
+    props?.options
+  )};`;
+    }
+    if (!requestBodyComponent && paramsInPath.length && queryParam) {
+        output += `    
+    type ${componentName}Params = {
+      ${paramsTypes}
+      ${queryParamsType}
+    }
+
+    use${componentName}Query.fetch = async (props: ${componentName}Params) => {
+      const {${paramsInPath.join(', ')}, ...queryParams} = props
+      const params = queryString.stringify(queryParams);
+      const result = await api.${verb}<${genericsTypes}>(\`${route}?\${params}\`)
+      return result.data;
+    }
+    
+    use${componentName}Query.baseKey = (): QueryKey => ["${componentName.toLowerCase()}"];
+
+    use${componentName}Query.queryKey = (params: ${componentName}Params): QueryKey => [...use${componentName}Query.baseKey(), params];
+    
+    type ${componentName}QueryProps<T = ${genericsTypes}> = {
+      options?: UseQueryOptions<${genericsTypes}, AxiosError, T, any> 
+    } & ${componentName}Params
+
+    export function use${componentName}Query<T = ${genericsTypes}>({ options = {}, ...props }: ${componentName}QueryProps<T>) { 
+      return useQuery(use${componentName}Query.queryKey(props), async () => use${componentName}Query.fetch(props), { enabled: !!props.${paramsInPath.join(' && !!props.')}, ...options }
+    );}
+    
+    type ${componentName}MutationProps<T> = {
+      options?: UseMutationOptions<${genericsTypes}, AxiosError, ${componentName}Params, T> 
+    }
+
+    export function use${componentName}Mutation<T = ${genericsTypes}>(props?: ${componentName}MutationProps<T>) { 
+    return useMutation(async (data) => {
+      const {${paramsInPath.join(', ')}, ...queryParams} = data
+      const params = queryString.stringify(queryParams);
+      const result = await api.${verb}<${genericsTypes}>(\`${route}?\${params}\`)
+      return result.data
+    },
+    props?.options
+  )};`;
+    }
+    if (!requestBodyComponent && !paramsInPath.length && !queryParam) {
+        output += `
+    use${componentName}Query.baseKey = (): QueryKey => ["${componentName.toLowerCase()}"];
+    use${componentName}Query.queryKey = (): QueryKey => use${componentName}Query.baseKey()
+
+    use${componentName}Query.fetch = async () => {
+      const result = await api.${verb}<${genericsTypes}>(\`${route}\`);
+      return result.data;
+    }
+
+    type ${componentName}QueryProps<T = ${genericsTypes}> = {
+      options?: UseQueryOptions<${genericsTypes}, AxiosError, T, any> 
+    }
+
+    export function use${componentName}Query<T = ${genericsTypes}>(props?: ${componentName}QueryProps<T>) { 
+      return useQuery(use${componentName}Query.queryKey(), use${componentName}Query.fetch, props?.options
+    );}
+ 
+    type ${componentName}MutationProps<T> = {
+      options?: UseMutationOptions<${genericsTypes}, AxiosError, void, T> 
+    }
+    export function use${componentName}Mutation<T = ${genericsTypes}>(props?: ${componentName}MutationProps<T>) { 
+      return useMutation(async () => { 
+        const result = await api.${verb}<${genericsTypes}>(\`${route}\`);
+        return result.data;
+      },
+      props?.options
+    )};
+    `;
+    }
+    if (!requestBodyComponent && !paramsInPath.length && queryParam) {
+        output += `
+    type ${componentName}Params = {
+      ${queryParamsType}
+    }
+
+    use${componentName}Query.fetch = async (props: ${componentName}Params) => {
+      const params = queryString.stringify({${queryParams
+            .map((param) => `${param.name}: props.${param.name}`)
+            .join(',')}});
+      const result = await api.${verb}<${genericsTypes}>(\`${route}?\${params}\`)
+      return result.data;
+    }
+
+    use${componentName}Query.baseKey = (): QueryKey => ["${componentName.toLowerCase()}"];
+    use${componentName}Query.queryKey = (params: ${componentName}Params ): QueryKey => [...use${componentName}Query.baseKey(), params];
+    
+
+    type ${componentName}QueryProps<T = ${genericsTypes}> = {
+      options?: UseQueryOptions<${genericsTypes}, AxiosError, T, any> 
+    } & ${componentName}Params
+
+    export function use${componentName}Query<T = ${genericsTypes}>({ options = {}, ...props }: ${componentName}QueryProps<T>) { 
+      return useQuery(use${componentName}Query.queryKey(props), async () => use${componentName}Query.fetch(props), 
+      {
+        enabled: !!props.${queryParams.map((param) => param.name).join(' && !!props.')}, 
+        ...options 
+      }
+    );}
+    
+    type ${componentName}MutationProps<T> = {
+      options?: UseMutationOptions<${genericsTypes}, AxiosError, ${componentName}Params, T> 
+    }
+  
+    export function use${componentName}Mutation<T = ${genericsTypes}>(props?: ${componentName}MutationProps<T>) { 
+      return useMutation(async (data) => {
+        const params = queryString.stringify({${queryParams
+            .map((param) => `${param.name}: data.${param.name}`)
+            .join(',')}});
+        const result = await api.${verb}<${genericsTypes}>(\`${route}?\${params}\`)
+        return result.data;
+      },
+      props?.options
+  )};`;
+    }
+    if (requestBodyComponent && !paramsInPath.length && !queryParam) {
+        output += `
+    use${componentName}Query.fetch = async (body:${requestBodyComponent}) => {
+      const result = await api.${verb}<${genericsTypes}>(\`${route}\`, body)
+        return result.data
+      }
+      
+    use${componentName}Query.baseKey = (): QueryKey => ["${componentName.toLowerCase()}"];
+    use${componentName}Query.queryKey = (params:${requestBodyComponent}): QueryKey => [...use${componentName}Query.baseKey(), params];
+
+
+    type ${componentName}QueryProps<T = ${genericsTypes}> = {
+      options?: UseQueryOptions<${genericsTypes}, AxiosError, T, any> 
+    } & ${requestBodyComponent}
+    
+    export function use${componentName}Query<T = ${genericsTypes}>({ options = {}, ...body }: ${componentName}QueryProps<T>) { 
+      return useQuery(use${componentName}Query.queryKey(body), async () => use${componentName}Query.fetch(body), options
+    );}
+
+    type ${componentName}MutationProps<T> = {
+      options?: UseMutationOptions<${genericsTypes}, AxiosError, ${requestBodyComponent}, T> 
+    }
+    export function use${componentName}Mutation<T = ${genericsTypes}>(props?: ${componentName}MutationProps<T>) { 
+    return useMutation(async (body) => { 
+      const result = await api.${verb}<${genericsTypes}>(\`${route}\`, body)
+      return result.data
+    },
+    props?.options
+  )};`;
+    }
+    if (requestBodyComponent && paramsInPath.length && !queryParam) {
+        output += `
+    // HDHD
+    type ${componentName}Params = {${paramsTypes}} & ${requestBodyComponent}
+
+    use${componentName}Query.fetch = async (props: ${componentName}Params) => {
+      const {${paramsInPath.join(', ')}, ...body} = props
+      const result = await api.${verb}<${genericsTypes}>(\`${route}\`, body)
+      return result.data
+    }
+    
+    use${componentName}Query.baseKey = (): QueryKey => ["${componentName.toLowerCase()}"];
+    use${componentName}Query.queryKey = (params: ${componentName}Params ): QueryKey => [...use${componentName}Query.baseKey(), params];
+
+
+    type ${componentName}QueryProps<T = ${genericsTypes}> = {
+      options?: UseQueryOptions<${genericsTypes}, AxiosError, T, any> 
+    } & ${componentName}Params
+  
+    export function use${componentName}Query<T = ${genericsTypes}>({ options = {}, ...props }: ${componentName}QueryProps<T>) { 
+    return useQuery(use${componentName}Query.queryKey(props), async () =>  use${componentName}Query.fetch(props), { enabled: !!props.${paramsInPath.join(' && !!props.')}, ...options }
+    );}  
+
+    type ${componentName}MutationProps<T> = {
+      options?: UseMutationOptions<${genericsTypes}, AxiosError,${componentName}Params, T>
+    }
+    export function use${componentName}Mutation<T = ${genericsTypes}>(props?: ${componentName}MutationProps<T>) {
+      return useMutation(async (body) => use${componentName}Query.fetch(body),
+      props?.options
+  )};`;
+    }
+    if (requestBodyComponent && queryParam) {
+        output += `// TODO: CODEGEN DOES NOT SUPPORT QUERYPARAM AND REQUESTBODY`;
+    }
+    return output;
+};
+/**
+ * Main entry of the generator. Generate react-query component from openAPI.
+ */
+const importOpenApi = async ({ data, format }) => {
+    const operationIds = [];
+    let specs = await importSpecs(data, format);
+    resolveDiscriminator(specs);
+    let output = `
+  import { useQuery, useMutation, UseQueryOptions, UseMutationOptions, QueryKey } from 'react-query';
+  import queryString from 'query-string';
+  import {AxiosError} from 'axios';
+  import { api } from 'api';
+  `;
+    output += '\n\n// SCEHMAS\n';
+    output += generateSchemasDefinition(specs.components && specs.components.schemas);
+    output += '\n\n// RESPONSES\n';
+    output += generateResponsesDefinition(specs.components && specs.components.responses);
+    output += '\n\n// REQUEST BODIES\n';
+    output += generateRequestBodiesDefinition(specs.components && specs.components.requestBodies);
+    output += '\n\n// HOOKS\n';
+    Object.entries(specs.paths).forEach(([route, verbs]) => {
+        Object.entries(verbs).forEach(([verb, operation]) => {
+            if (['get', 'post', 'patch', 'put', 'delete'].includes(verb) && !operation.deprecated) {
+                output += generateRestfulComponent(operation, verb, route, operationIds, verbs.parameters, specs.components);
+            }
+        });
+    });
+    return output;
+};
+export default importOpenApi;

package/lib/types.js

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-query-lightbase-codegen",
-  "version": "0.0.21",
+  "version": "0.1.0",
   "license": "MIT",
   "main": "./lib/cjs/index.js",
   "module": "./lib/esm/index.js",