UNPKG

@graphql-codegen/typescript-react-query

Version:

GraphQL Code Generator plugin for generating a ready-to-use React-Query Hooks based on GraphQL operations

97 lines (92 loc) 5.12 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.FetchFetcher = void 0; const variables_generator_js_1 = require("./variables-generator.js"); class FetchFetcher { constructor(visitor) { this.visitor = visitor; } generateFetcherImplementaion() { return ` function fetcher<TData, TVariables>(endpoint: string, requestInit: RequestInit, query: string, variables?: TVariables) { return async (): Promise<TData> => { const res = await fetch(endpoint, { method: 'POST', ...requestInit, body: JSON.stringify({ query, variables }), }); const json = await res.json(); if (json.errors) { const { message } = json.errors[0]; throw new Error(message); } return json.data; } }`; } generateInfiniteQueryHook(node, documentVariableName, operationName, operationResultType, operationVariablesTypes, hasRequiredVariables) { const variables = (0, variables_generator_js_1.generateQueryVariablesSignature)(hasRequiredVariables, operationVariablesTypes); const hookConfig = this.visitor.queryMethodMap; this.visitor.reactQueryHookIdentifiersInUse.add(hookConfig.infiniteQuery.hook); this.visitor.reactQueryOptionsIdentifiersInUse.add(hookConfig.infiniteQuery.options); const options = `options?: ${hookConfig.infiniteQuery.options}<${operationResultType}, TError, TData>`; return `export const useInfinite${operationName} = < TData = ${operationResultType}, TError = ${this.visitor.config.errorType} >( dataSource: { endpoint: string, fetchParams?: RequestInit }, pageParamKey: keyof ${operationVariablesTypes}, ${variables}, ${options} ) => ${hookConfig.infiniteQuery.hook}<${operationResultType}, TError, TData>( ${(0, variables_generator_js_1.generateInfiniteQueryKey)(node, hasRequiredVariables)}, (metaData) => fetcher<${operationResultType}, ${operationVariablesTypes}>(dataSource.endpoint, dataSource.fetchParams || {}, ${documentVariableName}, {...variables, [pageParamKey]: metaData.pageParam })(), options );`; } generateQueryHook(node, documentVariableName, operationName, operationResultType, operationVariablesTypes, hasRequiredVariables) { const variables = (0, variables_generator_js_1.generateQueryVariablesSignature)(hasRequiredVariables, operationVariablesTypes); const hookConfig = this.visitor.queryMethodMap; this.visitor.reactQueryHookIdentifiersInUse.add(hookConfig.query.hook); this.visitor.reactQueryOptionsIdentifiersInUse.add(hookConfig.query.options); const options = `options?: ${hookConfig.query.options}<${operationResultType}, TError, TData>`; return `export const use${operationName} = < TData = ${operationResultType}, TError = ${this.visitor.config.errorType} >( dataSource: { endpoint: string, fetchParams?: RequestInit }, ${variables}, ${options} ) => ${hookConfig.query.hook}<${operationResultType}, TError, TData>( ${(0, variables_generator_js_1.generateQueryKey)(node, hasRequiredVariables)}, fetcher<${operationResultType}, ${operationVariablesTypes}>(dataSource.endpoint, dataSource.fetchParams || {}, ${documentVariableName}, variables), options );`; } generateMutationHook(node, documentVariableName, operationName, operationResultType, operationVariablesTypes, hasRequiredVariables) { const variables = `variables?: ${operationVariablesTypes}`; const hookConfig = this.visitor.queryMethodMap; this.visitor.reactQueryHookIdentifiersInUse.add(hookConfig.mutation.hook); this.visitor.reactQueryOptionsIdentifiersInUse.add(hookConfig.mutation.options); const options = `options?: ${hookConfig.mutation.options}<${operationResultType}, TError, ${operationVariablesTypes}, TContext>`; return `export const use${operationName} = < TError = ${this.visitor.config.errorType}, TContext = unknown >( dataSource: { endpoint: string, fetchParams?: RequestInit }, ${options} ) => ${hookConfig.mutation.hook}<${operationResultType}, TError, ${operationVariablesTypes}, TContext>( ${(0, variables_generator_js_1.generateMutationKey)(node)}, (${variables}) => fetcher<${operationResultType}, ${operationVariablesTypes}>(dataSource.endpoint, dataSource.fetchParams || {}, ${documentVariableName}, variables)(), options );`; } generateFetcherFetch(node, documentVariableName, operationName, operationResultType, operationVariablesTypes, hasRequiredVariables) { const variables = (0, variables_generator_js_1.generateQueryVariablesSignature)(hasRequiredVariables, operationVariablesTypes); return `\nuse${operationName}.fetcher = (dataSource: { endpoint: string, fetchParams?: RequestInit }, ${variables}) => fetcher<${operationResultType}, ${operationVariablesTypes}>(dataSource.endpoint, dataSource.fetchParams || {}, ${documentVariableName}, variables);`; } } exports.FetchFetcher = FetchFetcher;