feat(client): add vue-query

OliverDudgeon · Jul 16, 2021 · 5c22c25 · 5c22c25
1 parent cd76cdd
commit 5c22c25
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 3 deletions.
diff --git a/src/core/generators/client.ts b/src/core/generators/client.ts
@@ -34,6 +34,7 @@ import {
  generateQueryTitle,
  getReactQueryDependencies,
  getSvelteQueryDependencies,
+ getVueQueryDependencies,
 } from './query';
 
 const DEFAULT_CLIENT = OutputClient.AXIOS;
@@ -85,6 +86,13 @@ export const GENERATOR_CLIENT: GeneratorClients = {
  footer: generateQueryFooter,
  title: generateQueryTitle,
  },
+ 'vue-query': {
+ client: generateQuery,
+ header: generateQueryHeader,
+ dependencies: getVueQueryDependencies,
+ footer: generateQueryFooter,
+ title: generateQueryTitle,
+ },
 };
 
 const getGeneratorClient = (outputClient: OutputClient | OutputClientFunc) => {

diff --git a/src/core/generators/query.ts b/src/core/generators/query.ts
@@ -64,6 +64,27 @@ const REACT_QUERY_DEPENDENCIES: GeneratorDependency[] = [
 ];
 
 export const getReactQueryDependencies = () => REACT_QUERY_DEPENDENCIES;
+const VUE_QUERY_DEPENDENCIES: GeneratorDependency[] = [
+ ...AXIOS_DEPENDENCIES,
+ {
+ exports: [
+ { name: 'useQuery', values: true },
+ { name: 'useInfiniteQuery', values: true },
+ { name: 'useMutation', values: true },
+ ],
+ dependency: 'vue-query',
+ },
+ {
+ exports: [
+ { name: 'UseQueryOptions' },
+ { name: 'UseInfiniteQueryOptions' },
+ { name: 'UseMutationOptions' },
+ ],
+ dependency: 'vue-query/types',
+ },
+];
+
+export const getVueQueryDependencies = () => VUE_QUERY_DEPENDENCIES;
 
 const generateQueryRequestFunction = (
  {
@@ -80,7 +101,7 @@ const generateQueryRequestFunction = (
 ) => {
  const isRequestOptions = override?.requestOptions !== false;
  const isFormData = override?.formData !== false;
- 
+
  if (mutator) {
  const mutatorConfig = generateMutatorConfig({
  route,
@@ -120,7 +141,7 @@ const generateQueryRequestFunction = (
  response,
  verb,
  requestOptions: override?.requestOptions,
- isFormData
+ isFormData,
  });
 
  return `export const ${operationName} = <TData = AxiosResponse<${

diff --git a/src/types/index.ts b/src/types/index.ts
@@ -39,7 +39,8 @@ export type OutputClient =
  | 'axios-functions'
  | 'angular'
  | 'react-query'
- | 'svelte-query';
+ | 'svelte-query'
+ | 'vue-query';
 
 export const OutputClient = {
  ANGULAR: 'angular' as OutputClient,