react-query-lightbase-codegen 0.3.0 → 1.0.1

package/README.md

@@ -1 +1,77 @@
+# React Query Code Generation
 
+Generate fully typed react query hooks from OpenAPI specifications.
+
+- GET requests will automatically generate `useQuery` hooks together with helper functions
+  - getQueryState
+  - getQueryData
+  - prefetch
+  - cancelQueries
+  - invalidate
+  - refetchStale
+
+- Override default generation forcing query, mutation or infiniteQuery output
+
+## Installation
+
+You can install react-query-lightbase-codegen with NPM or Yarn.
+
+Using NPM:
+
+```bash
+$ npm i -D react-query-lightbase-codegen 
+```
+
+Using Yarn:
+
+```
+$ yarn add -D react-query-lightbase-codegen
+```
+
+## Configuration
+
+create a generateQueries.mjs file in project root folder
+
+```javascript
+// generateQueries.mjs
+import { importSpecs } from 'react-query-lightbase-codegen';
+
+importSpecs({
+  // folder location of the openapi/swagger documents (yaml or JSON)
+  sourceDirectory: './specs',
+  // export folder for hooks and schema code generated files
+  exportDirectory: './src/generated',
+  // api client - as named export labelled 'api'
+  apiDirectory: './src/api',
+  // React query client directory - names export 'queryClient'
+  queryClientDir: './src/api',
+});
+```
+
+## Code generation
+
+To generate the code generated scheme and react query hooks run the above script
+
+```bash
+node scripts/generateQueries.mjs && prettier --check ./src/generated/*.tsx --write
+```
+
+## Configuration Options
+
+```javascript
+// generateQueries.mjs
+import { importSpecs } from 'react-query-lightbase-codegen';
+
+importSpecs({
+  ...
+  // Filter out any headers from individual queries (these might be applied globally in the axios instance)
+  headerFilters: ['X-Session-Token'],
+  overrides: {
+    // operationId listed in the openApi spec
+    findPetsByStatus: {
+      // Override the default query code generation type ('query' | 'mutation' | 'infiniteQuery')
+      type: 'query',
+    },
+  },
+});
+```

package/lib/commonjs/convertSwaggerFile.js

@@ -0,0 +1,37 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.convertSwaggerFile = void 0;
+
+var _swagger2openapi = _interopRequireDefault(require("swagger2openapi"));
+
+var _jsYaml = _interopRequireDefault(require("js-yaml"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+/**
+ * Import and parse the openapi spec from a yaml/json
+ */
+const convertSwaggerFile = (data, extension) => {
+  const schema = extension === 'yaml' ? _jsYaml.default.load(data) : JSON.parse(data);
+  return new Promise((resolve, reject) => {
+    if (!schema.openapi || !schema.openapi.startsWith('3.')) {
+      _swagger2openapi.default.convertObj(schema, {}, (err, convertedObj) => {
+        if (err) {
+          reject(err);
+        } else {
+          // @ts-ignore
+          convertedObj.openapi.basePath = convertedObj.original.basePath;
+          resolve(convertedObj.openapi);
+        }
+      });
+    } else {
+      resolve(schema);
+    }
+  });
+};
+
+exports.convertSwaggerFile = convertSwaggerFile;
+//# sourceMappingURL=convertSwaggerFile.js.map

package/lib/commonjs/convertSwaggerFile.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["convertSwaggerFile","data","extension","schema","yaml","load","JSON","parse","Promise","resolve","reject","openapi","startsWith","swagger2openapi","convertObj","err","convertedObj","basePath","original"],"sources":["convertSwaggerFile.ts"],"sourcesContent":["import { OpenAPIObject } from 'openapi3-ts';\nimport swagger2openapi from 'swagger2openapi';\nimport yaml from 'js-yaml';\n\n/**\n * Import and parse the openapi spec from a yaml/json\n */\nexport const convertSwaggerFile = (data: string, extension: 'yaml' | 'json'): Promise<OpenAPIObject> => {\n  const schema = extension === 'yaml' ? yaml.load(data) : JSON.parse(data);\n  return new Promise((resolve, reject) => {\n    if (!schema.openapi || !schema.openapi.startsWith('3.')) {\n      swagger2openapi.convertObj(schema, {}, (err, convertedObj) => {\n        if (err) {\n          reject(err);\n        } else {\n          // @ts-ignore\n          convertedObj.openapi.basePath = convertedObj.original.basePath;\n          resolve(convertedObj.openapi);\n        }\n      });\n    } else {\n      resolve(schema);\n    }\n  });\n};\n"],"mappings":";;;;;;;AACA;;AACA;;;;AAEA;AACA;AACA;AACO,MAAMA,kBAAkB,GAAG,CAACC,IAAD,EAAeC,SAAf,KAAsE;EACtG,MAAMC,MAAM,GAAGD,SAAS,KAAK,MAAd,GAAuBE,eAAA,CAAKC,IAAL,CAAUJ,IAAV,CAAvB,GAAyCK,IAAI,CAACC,KAAL,CAAWN,IAAX,CAAxD;EACA,OAAO,IAAIO,OAAJ,CAAY,CAACC,OAAD,EAAUC,MAAV,KAAqB;IACtC,IAAI,CAACP,MAAM,CAACQ,OAAR,IAAmB,CAACR,MAAM,CAACQ,OAAP,CAAeC,UAAf,CAA0B,IAA1B,CAAxB,EAAyD;MACvDC,wBAAA,CAAgBC,UAAhB,CAA2BX,MAA3B,EAAmC,EAAnC,EAAuC,CAACY,GAAD,EAAMC,YAAN,KAAuB;QAC5D,IAAID,GAAJ,EAAS;UACPL,MAAM,CAACK,GAAD,CAAN;QACD,CAFD,MAEO;UACL;UACAC,YAAY,CAACL,OAAb,CAAqBM,QAArB,GAAgCD,YAAY,CAACE,QAAb,CAAsBD,QAAtD;UACAR,OAAO,CAACO,YAAY,CAACL,OAAd,CAAP;QACD;MACF,CARD;IASD,CAVD,MAUO;MACLF,OAAO,CAACN,MAAD,CAAP;IACD;EACF,CAdM,CAAP;AAeD,CAjBM"}

package/lib/commonjs/generateHooks.js

@@ -0,0 +1,492 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createHook = void 0;
+
+var _lodash = _interopRequireDefault(require("lodash"));
+
+var _utils = require("./utils.js");
+
+var _case = _interopRequireDefault(require("case"));
+
+var _chalk = _interopRequireDefault(require("chalk"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const {
+  get,
+  groupBy
+} = _lodash.default;
+const {
+  pascal,
+  camel
+} = _case.default;
+const IdentifierRegexp = /^[a-zA-Z_$][a-zA-Z0-9_$]*$/;
+/**
+ * Return every params in a path
+ */
+
+const getParamsInPath = path => {
+  let n;
+  const output = [];
+  const templatePathRegex = /\{(\w+)}/g;
+
+  while ((n = templatePathRegex.exec(path)) !== null) {
+    output.push(n[1]);
+  }
+
+  return output;
+};
+/**
+ * Generate a react-query component from openapi operation specs
+ */
+
+
+const createHook = _ref => {
+  let {
+    operation,
+    verb,
+    route,
+    operationIds,
+    parameters,
+    schemasComponents,
+    headerFilters,
+    overrides
+  } = _ref;
+  const {
+    operationId = route.replace('/', '')
+  } = operation;
+
+  if (operationId === '*') {
+    throw new Error(`Invalid operationId/Route set for ${verb} ${route}`);
+  }
+
+  if (operationIds.includes(operationId)) {
+    return {
+      implementation: '',
+      imports: [],
+      queryImports: []
+    };
+  }
+
+  operationIds.push(operationId);
+  route = route.replace(/\{/g, '${').replace('//', '/'); // `/pet/{id}` => `/pet/${id}`
+  // Remove the last param of the route if we are in the DELETE case
+
+  let lastParamInTheRoute = null;
+  const componentName = pascal(operationId);
+
+  const isOk = _ref2 => {
+    let [statusCode] = _ref2;
+    return statusCode.toString().startsWith('2');
+  };
+
+  const responseTypes = (0, _utils.getResReqTypes)(Object.entries(operation.responses).filter(isOk)) || 'void';
+  const requestBodyTypes = (0, _utils.getResReqTypes)([['body', operation.requestBody]]);
+  let imports = [responseTypes];
+  let queryImports = [];
+  const paramsInPath = getParamsInPath(route).filter(param => !(verb === 'delete' && param === lastParamInTheRoute));
+  const {
+    query: queryParams = [],
+    path: pathParams = [],
+    header = []
+  } = groupBy([...(parameters || []), ...(operation.parameters || [])].map(p => {
+    if ((0, _utils.isReference)(p)) {
+      return get(schemasComponents, p.$ref.replace('#/components/', '').replace('/', '.'));
+    } else {
+      return p;
+    }
+  }), 'in');
+  const headerParams = header.filter(p => !(headerFilters !== null && headerFilters !== void 0 && headerFilters.includes(p.name)));
+  let enabled = []; // TODO: extract all requestBody or remove useQuery variants
+
+  let enabledParam = '!!params';
+  [...queryParams, ...pathParams, ...headerParams].forEach(item => {
+    if (item.required) {
+      enabled.push(`["${item.name}"]`);
+
+      if (enabledParam && enabledParam !== '!!params') {
+        enabledParam += `&& params['${item.name}'] != null`;
+      } else {
+        enabledParam = `params['${item.name}'] != null`;
+      }
+    }
+  }); // `!props${enabled.join('== null && !props')}`;
+
+  const paramsTypes = paramsInPath.map(p => {
+    try {
+      const {
+        name,
+        required,
+        schema
+      } = pathParams.find(i => i.name === p);
+      return `${name}${required ? '' : '?'}: ${(0, _utils.resolveValue)(schema)}`;
+    } catch (err) {
+      throw new Error(`The path params ${p} can't be found in parameters (${operationId})`);
+    }
+  }).join('; ');
+  const queryParamsType = queryParams.map(p => {
+    const processedName = IdentifierRegexp.test(p.name) ? p.name : `"${p.name}"`;
+    return `${(0, _utils.formatDescription)(p.description)}
+      ${processedName}${p.required ? '' : '?'}: ${(0, _utils.resolveValue)(p.schema)}`;
+  }).join(';\n  ');
+  const headerType = headerParams.map(p => {
+    try {
+      const {
+        name,
+        required,
+        schema
+      } = headerParams.find(i => i.name === p.name);
+      return `"${name}"${required ? '' : '?'}: ${(0, _utils.resolveValue)(schema)}`;
+    } catch (err) {
+      throw new Error(`The path params ${p} can't be found in parameters (${operationId})`);
+    }
+  }).join('; '); // Retrieve the type of the param for delete verb
+
+  const lastParamInTheRouteDefinition = operation.parameters && lastParamInTheRoute ? operation.parameters.find(p => {
+    if ((0, _utils.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 (${operationId})`);
+  }
+
+  const defaultDescription = `type: ${verb}\noperationId: ${operationId}\nurl: ${route}`;
+  const description = (0, _utils.formatDescription)(operation.summary && operation.description ? `${defaultDescription}\n\n${operation.summary}\n\n${operation.description}` : `${defaultDescription}`);
+  let output = `\n\n${description}`;
+  const headerParam = headerType && headerType !== 'void' ? `${headerType};` : '';
+  const queryParam = queryParamsType && queryParamsType !== 'void' ? `${queryParamsType}` : '';
+  const requestBodyComponent = requestBodyTypes && requestBodyTypes !== 'void' ? `${requestBodyTypes}` : '';
+
+  if (requestBodyComponent) {
+    imports.push(requestBodyComponent);
+  }
+
+  const isUpdateRequest = ['post', 'patch', 'put'].includes(verb);
+
+  const generateProps = props => {
+    return props.map(item => `["${item.name}"]: props["${item.name}"]`).join(',');
+  };
+
+  const generateBodyProps = () => {
+    const definitionKey = Object.keys((schemasComponents === null || schemasComponents === void 0 ? void 0 : schemasComponents.schemas) || {}).find(key => pascal(key) === requestBodyComponent);
+
+    if (definitionKey) {
+      var _schemasComponents$sc;
+
+      const scheme = schemasComponents === null || schemasComponents === void 0 ? void 0 : (_schemasComponents$sc = schemasComponents.schemas) === null || _schemasComponents$sc === void 0 ? void 0 : _schemasComponents$sc[definitionKey];
+      return Object.keys(scheme.properties).map(item => `["${item}"]: props["${item}"]`).join(',');
+    }
+  };
+
+  const fetchName = camel(componentName);
+
+  const createQueryHooks = emptyParams => {
+    const params = emptyParams ? '' : `params: ${componentName}Params,`;
+    const key = emptyParams ? '' : `params`;
+    const mutationParams = emptyParams ? 'void' : `${componentName}Params`;
+    const queryParamType = emptyParams ? '' : `${componentName}Params &`;
+    const filterParams = emptyParams ? '{ filters }: { filters?: QueryFilters }' : `{ params, filters }: { params: ${componentName}Params, filters?: QueryFilters }`;
+    const cacheParams = emptyParams ? `{updater, options}: {updater: Updater<${responseTypes} | undefined, ${responseTypes} | undefined>, options?: SetDataOptions | undefined}` : `{params, updater, options}: {params: ${componentName}Params, updater: Updater<${responseTypes} | undefined, ${responseTypes} | undefined>, options?: SetDataOptions | undefined}`;
+    const queryKey = emptyParams ? `use${componentName}Query.baseKey()` : `[...use${componentName}Query.baseKey(), params]`;
+
+    const createQuery = () => `
+    type ${componentName}QueryProps<T = ${responseTypes}> = ${queryParamType} {
+      options?: UseQueryOptions<${responseTypes}, AxiosError, T, any> 
+    }
+    export function use${componentName}Query<T = ${responseTypes}>({ options = {}, ...params }: ${componentName}QueryProps<T>) { 
+      return useQuery(use${componentName}Query.queryKey(${key}), async () => ${fetchName}(${key}), { enabled: ${enabledParam}, ...options });
+    }
+
+    use${componentName}Query.baseKey = (): QueryKey => ["${componentName.toLowerCase()}"];
+  
+    use${componentName}Query.queryKey = (${params}): QueryKey => ${queryKey};
+  
+    use${componentName}Query.updateCache = (${cacheParams}) => queryClient.setQueryData<${responseTypes}>(use${componentName}Query.queryKey(${key}), updater, options);
+    
+    use${componentName}Query.getQueryState = (${filterParams})=> queryClient.getQueryState<${responseTypes}>(use${componentName}Query.queryKey(${key}), filters);
+    
+    use${componentName}Query.getQueryData = (${filterParams})=> queryClient.getQueryData<${responseTypes}>(use${componentName}Query.queryKey(${key}), filters);
+    
+    use${componentName}Query.prefetch = (${params}) => queryClient.prefetchQuery<${responseTypes}>(use${componentName}Query.queryKey(${key}), ()=> ${fetchName}(${key}));
+  
+    use${componentName}Query.cancelQueries = (${params}) => queryClient.cancelQueries(use${componentName}Query.queryKey(${key}))
+  
+    use${componentName}Query.invalidate = (${params}) => queryClient.invalidateQueries<${responseTypes}>(use${componentName}Query.queryKey(${key}));
+  
+    use${componentName}Query.refetchStale = (${params}) => queryClient.refetchQueries<${responseTypes}>(use${componentName}Query.queryKey(${key}), { stale: true });
+  `;
+
+    const getInfiniteQuery = _ref3 => {
+      let {
+        pageParam
+      } = _ref3;
+      return `
+    type ${componentName}QueryProps<T = ${responseTypes}> = ${queryParamType} {
+      options: UseInfiniteQueryOptions<${responseTypes}, AxiosError, T, any> 
+    }
+    export function use${componentName}Query<T = ${responseTypes}>({ options = {}, ...params }: ${componentName}QueryProps<T>) { 
+      return useInfiniteQuery(use${componentName}Query.queryKey(${key}), async ({ pageParam = 0 }) => ${fetchName}({${pageParam}: pageParam, ...params}), { enabled: ${enabledParam}, ...options });
+    }
+
+    use${componentName}Query.baseKey = (): QueryKey => ["${componentName.toLowerCase()}"];
+  
+    use${componentName}Query.queryKey = (${params}): QueryKey => ${queryKey};
+  
+  `;
+    };
+
+    const createMutation = () => `
+    type ${componentName}MutationProps<T> = {
+      options?: UseMutationOptions<${responseTypes}, AxiosError, ${mutationParams}, T> 
+    }
+    export function use${componentName}Mutation<T = ${responseTypes}>(props?: ${componentName}MutationProps<T>) { 
+      return useMutation(async (${key}) => ${fetchName}(${key}), props?.options)
+    };
+    `;
+
+    const override = overrides === null || overrides === void 0 ? void 0 : overrides[operationId];
+
+    if ((override === null || override === void 0 ? void 0 : override.type) === 'query') {
+      console.log(_chalk.default.blue(`⚙️  [${operationId}] has been changed to a useQuery hook`));
+      queryImports.push('query');
+      return createQuery();
+    }
+
+    if ((override === null || override === void 0 ? void 0 : override.type) === 'mutation') {
+      queryImports.push('mutation');
+      console.log(_chalk.default.blue(`⚙️  [${operationId}] has been changed to a useMutation hook`));
+      return createMutation();
+    }
+
+    if ((override === null || override === void 0 ? void 0 : override.type) === 'infiniteQuery') {
+      console.log(_chalk.default.blue(`⚙️  [${operationId}] has been changed to a useInfiniteQuery hook`));
+      queryImports.push('infiniteQuery');
+      return getInfiniteQuery({
+        pageParam: override.infiniteQueryParm
+      });
+    }
+
+    if (verb === 'get') {
+      queryImports.push('query');
+      return createQuery();
+    }
+
+    queryImports.push('mutation');
+    return createMutation();
+  };
+
+  output += createQueryHooks(!requestBodyComponent && !paramsInPath.length && !queryParam && !headerParam);
+
+  if (!requestBodyComponent && !paramsInPath.length && !queryParam && !headerParam) {
+    output += `
+    const ${fetchName} = async () => {
+      const result = await api.${verb}<${responseTypes}>(\`${route}\`);
+      return result.data;
+    }
+    `;
+  }
+
+  if (!requestBodyComponent && paramsInPath.length && queryParam && !headerParam) {
+    const config = isUpdateRequest ? 'body,{params}' : '{params}';
+    output += `
+    type ${componentName}Params = {
+      ${paramsTypes}
+      ${queryParamsType}; 
+    }
+
+     const ${fetchName} = async (props:${componentName}Params) => {
+      const {${paramsInPath.join(', ')}, ...params} = props
+      const result = await api.${verb}<${responseTypes}>(\`${route}\`, ${config})
+      return result.data;
+    }`;
+  }
+
+  if (!requestBodyComponent && paramsInPath.length && !queryParam && !headerParam) {
+    output += `
+    type ${componentName}Params = {
+      ${paramsTypes}
+    }
+
+    const ${fetchName} = async (props: ${componentName}Params ) => {
+      const result = await api.${verb}<${responseTypes}>(\`${route.replace(/\{/g, '{props.')}\`);
+      return result.data;
+    }
+    `;
+  }
+
+  if (!requestBodyComponent && !paramsInPath.length && queryParam && !headerParam) {
+    const config = isUpdateRequest ? 'null,{params}' : '{params}';
+    output += `
+    type ${componentName}Params = { 
+      ${queryParamsType} 
+    }
+
+    const ${fetchName} = async (params: ${componentName}Params) => {
+      const result = await api.${verb}<${responseTypes}>(\`${route}\`, ${config})
+      return result.data;
+    }
+    `;
+  }
+
+  if (!requestBodyComponent && !paramsInPath.length && queryParam && headerParam) {
+    const config = isUpdateRequest ? 'null,{headers, params: queryParams}' : '{headers, params: queryParams}';
+    output += `
+      type ${componentName}Params = {
+        ${headerParam}
+        ${queryParamsType}
+      }
+      const ${fetchName} = async (props: ${componentName}Params) => {
+        const headers = {${generateProps(header)}}
+        const queryParams = {${generateProps(queryParams)}}
+        const result = await api.${verb}<${responseTypes}>(\`${route}\`, ${config})
+        return result.data
+      }`;
+  }
+
+  if (!requestBodyComponent && !paramsInPath.length && !queryParam && headerParam) {
+    const config = isUpdateRequest ? 'null,{headers}' : '{headers}';
+    output += `
+      type ${componentName}Params = {
+        ${headerParam}
+      };
+  
+      const ${fetchName} = async (headers: ${componentName}Params) => {
+        const result = await api.${verb}<${responseTypes}>(\`${route}\`, ${config});
+        return result.data;
+      }
+      `;
+  }
+
+  if (requestBodyComponent && !paramsInPath.length && !queryParam && !headerParam) {
+    output += `
+    type ${componentName}Params = ${requestBodyComponent}
+
+    const ${fetchName} = async (body: ${componentName}Params) => {
+      const result = await api.${verb}<${responseTypes}>(\`${route}\`, body)
+      return result.data
+    } 
+      `;
+  }
+
+  if (requestBodyComponent && !paramsInPath.length && queryParam && !headerParam) {
+    const config = isUpdateRequest ? 'null,{headers, params: queryParams}' : '{headers, params: queryParams}';
+    const queryParamsProps = queryParams.map(item => `["${item.name}"]: props["${item.name}"]`);
+    output += `
+    type ${componentName}Params = ${requestBodyComponent}  & {
+      ${queryParamsType}
+    }
+
+    type ${componentName}QueryProps<T = ${responseTypes}> = ${componentName}Params & {
+      const body =  {${generateBodyProps()}}
+      const params =  {${generateProps(queryParams)}}
+      options?: UseQueryOptions<${responseTypes}, AxiosError, T, any> 
+    }
+
+     const ${fetchName} = async ({body, params}: ${componentName}Params) => {   
+      const queryParams = {${queryParamsProps.join(',')}}
+      const result = await api.${verb}<${responseTypes}>(\`${route}\`, ${config})
+      return result.data
+    }
+    `;
+  }
+
+  if (requestBodyComponent && !paramsInPath.length && !queryParam && headerParam) {
+    output += `
+    type ${componentName}Params =  ${requestBodyComponent} & {
+      ${headerParam}
+    };
+
+    const ${fetchName} = async (props: ${componentName}Params) => {
+      const headers = {${generateProps(header)}}
+      const body =  {${generateBodyProps()}}
+      const result = await api.${verb}<${responseTypes}>(\`${route}\`, body, {headers})
+      return result.data
+    }
+    `;
+  }
+
+  if (requestBodyComponent && !paramsInPath.length && queryParam && headerParam) {
+    output += `
+    type ${componentName}Params = ${requestBodyComponent} & {
+      ${headerParam}
+      ${paramsTypes}
+    };
+
+    const ${fetchName} = async (props: ${componentName}Params) => {
+      const body =  {${generateBodyProps()}}
+      const headers = {${generateProps(header)}}
+      const params =  {${generateProps(queryParams)}}
+      const result = await api.${verb}<${responseTypes}>(\`${route}\`, body, {headers, params})
+      return result.data
+    }
+    `;
+  }
+
+  if (requestBodyComponent && paramsInPath.length && !queryParam && !headerParam) {
+    output += `
+    type ${componentName}Params = ${requestBodyComponent} & {
+      ${headerParam}
+      ${paramsTypes}
+    };
+
+    const ${fetchName} = async (props: ${componentName}Params) => {
+      const body =  {${generateBodyProps()}}
+      const result = await api.${verb}<${responseTypes}>(\`${route.replace(/\{/g, '{props.')}\`, body)
+      return result.data
+    }
+    `;
+  }
+
+  if (requestBodyComponent && paramsInPath.length && queryParam && !headerParam) {
+    output += `// TODO: NOT SUPPORTED requestBodyComponent && paramsInPath && queryParam)`;
+  }
+
+  if (requestBodyComponent && paramsInPath.length && queryParam && headerParam) {
+    output += `// TODO: NOT SUPPORTED requestBodyComponent && paramsInPath && queryParam && headerParam)`;
+  }
+
+  if (!requestBodyComponent && paramsInPath.length && !queryParam && headerParam) {
+    const config = isUpdateRequest ? 'null,{headers}' : '{headers}';
+    output += `
+    type ${componentName}Params = {
+      ${headerParam}
+      ${paramsTypes}
+    };
+
+    const ${fetchName} = async (props: ${componentName}Params) => {
+      const headers = {${generateProps(header)}}
+      const result = await api.${verb}<${responseTypes}>(\`${route.replace(/\{/g, '{props.')}\`, ${config})
+      return result.data
+    }
+    `;
+  }
+
+  if (!requestBodyComponent && paramsInPath.length && queryParam && headerParam) {
+    output += `// TODO: NOT SUPPORTED (paramsInPath && queryParam && headerParam)`;
+  }
+
+  if (requestBodyComponent && paramsInPath.length && !queryParam && headerParam) {
+    output += `// TODO: NOT SUPPORTED (requestBodyComponent && paramsInPath && headerParam)`;
+  }
+
+  return {
+    implementation: output,
+    imports,
+    queryImports
+  };
+};
+
+exports.createHook = createHook;
+//# sourceMappingURL=generateHooks.js.map