fix: get data from the client

7nohe · Jun 13, 2024 · a341432 · a341432
1 parent d34e761
commit a341432
Show file tree

Hide file tree

Showing 7 changed files with 83 additions and 51 deletions.
diff --git a/examples/react-app/src/App.tsx b/examples/react-app/src/App.tsx
@@ -1,6 +1,7 @@
 import "./App.css";
 import { useState } from "react";
 
+import { createClient } from "@hey-api/client-fetch";
 import {
   UseFindPetsKeyFn,
   useAddPet,
@@ -12,10 +13,12 @@ import { SuspenseParent } from "./components/SuspenseParent";
 import { queryClient } from "./queryClient";
 
 function App() {
+  createClient({ baseUrl: "http://localhost:4010" });
+
   const [tags, _setTags] = useState<string[]>([]);
   const [limit, _setLimit] = useState<number>(10);
 
-  const { data, error, refetch } = useFindPets({ tags, limit });
+  const { data, error, refetch } = useFindPets({ query: { tags, limit } });
   // This is an example of using a hook that has all parameters optional;
   // Here we do not have to pass in an object
   const { data: _ } = useFindPets();
@@ -42,8 +45,8 @@ function App() {
     <div className="App">
       <h1>Pet List</h1>
       <ul>
-        {Array.isArray(data?.data) &&
-          data?.data.map((pet, index) => (
+        {Array.isArray(data) &&
+          data?.map((pet, index) => (
             <li key={`${pet.id}-${index}`}>{pet.name}</li>
           ))}
       </ul>
@@ -52,12 +55,12 @@ function App() {
         onClick={() => {
           addPet(
             {
-              requestBody: { name: "Duggy" },
+              body: { name: "Duggy" },
             },
             {
               onSuccess: () => {
                 queryClient.invalidateQueries({
-                  queryKey: UseFindPetsKeyFn(),
+                  queryKey: UseFindPetsKeyFn({ query: { tags, limit } }),
                 });
                 console.log("success");
               },

diff --git a/examples/react-app/src/components/SuspenseChild.tsx b/examples/react-app/src/components/SuspenseChild.tsx
@@ -1,15 +1,17 @@
 import { useFindPetsSuspense } from "../../openapi/queries/suspense";
 
 export const SuspenseChild = () => {
-  const { data } = useFindPetsSuspense({ tags: [], limit: 10 });
-
-  if (!Array.isArray(data.data)) {
+  const { data, error } = useFindPetsSuspense({
+    query: { tags: [], limit: 10 },
+  });
+  console.log({ error });
+  if (!Array.isArray(data)) {
     return <div>Error!</div>;
   }
 
   return (
     <ul>
-      {data?.data.map((pet, index) => (
+      {data?.map((pet) => (
         <li key={pet.id}>{pet.name}</li>
       ))}
     </ul>

diff --git a/examples/react-app/src/main.tsx b/examples/react-app/src/main.tsx
@@ -1,5 +1,3 @@
-createClient({ baseUrl: "http://localhost:4010" });
-import { createClient } from "@hey-api/client-fetch";
 import React from "react";
 import ReactDOM from "react-dom/client";
 import App from "./App";

diff --git a/src/createUseQuery.mts b/src/createUseQuery.mts
@@ -23,9 +23,8 @@ export const createApiResponseType = ({
   methodName: string;
 }) => {
   /** Awaited<ReturnType<typeof myClass.myMethod>> */
-  const awaitedResponseDataType = ts.factory.createTypeReferenceNode(
-    ts.factory.createIdentifier("Awaited"),
-    [
+  const awaitedResponseDataType = ts.factory.createIndexedAccessTypeNode(
+    ts.factory.createTypeReferenceNode(ts.factory.createIdentifier("Awaited"), [
       ts.factory.createTypeReferenceNode(
         ts.factory.createIdentifier("ReturnType"),
         [
@@ -35,7 +34,8 @@ export const createApiResponseType = ({
           ),
         ],
       ),
-    ],
+    ]),
+    ts.factory.createLiteralTypeNode(ts.factory.createStringLiteral("data")),
   );
   /** DefaultResponseDataType
    * export type MyClassMethodDefaultResponse = Awaited<ReturnType<typeof myClass.myMethod>>
@@ -312,7 +312,6 @@ export function createQueryHook({
                     ts.factory.createCallExpression(
                       BuildCommonTypeName(getQueryKeyFnName(queryKey)),
                       undefined,
-
                       getVariableArrowFunctionParameters(method).length
                         ? [
                             ts.factory.createObjectLiteralExpression(
@@ -342,24 +341,56 @@ export function createQueryHook({
                       EqualsOrGreaterThanToken,
                       ts.factory.createAsExpression(
                         ts.factory.createCallExpression(
-                          ts.factory.createIdentifier(methodName),
-                          undefined,
-                          getVariableArrowFunctionParameters(method).length
-                            ? [
-                                ts.factory.createObjectLiteralExpression(
-                                  getVariableArrowFunctionParameters(
-                                    method,
-                                  ).flatMap((param) =>
-                                    extractPropertiesFromObjectParam(param).map(
-                                      (p) =>
-                                        ts.factory.createShorthandPropertyAssignment(
-                                          ts.factory.createIdentifier(p.name),
+                          ts.factory.createPropertyAccessExpression(
+                            ts.factory.createCallExpression(
+                              ts.factory.createIdentifier(methodName),
+                              undefined,
+                              getVariableArrowFunctionParameters(method).length
+                                ? [
+                                    ts.factory.createObjectLiteralExpression(
+                                      getVariableArrowFunctionParameters(
+                                        method,
+                                      ).flatMap((param) =>
+                                        extractPropertiesFromObjectParam(
+                                          param,
+                                        ).map((p) =>
+                                          ts.factory.createShorthandPropertyAssignment(
+                                            ts.factory.createIdentifier(p.name),
+                                          ),
                                         ),
+                                      ),
                                     ),
-                                  ),
+                                  ]
+                                : undefined,
+                            ),
+                            ts.factory.createIdentifier("then"),
+                          ),
+                          undefined,
+                          [
+                            ts.factory.createArrowFunction(
+                              undefined,
+                              undefined,
+                              [
+                                ts.factory.createParameterDeclaration(
+                                  undefined,
+                                  undefined,
+                                  ts.factory.createIdentifier("response"),
+                                  undefined,
+                                  undefined,
+                                  undefined,
+                                ),
+                              ],
+                              undefined,
+                              EqualsOrGreaterThanToken,
+                              ts.factory.createAsExpression(
+                                ts.factory.createPropertyAccessExpression(
+                                  ts.factory.createIdentifier("response"),
+                                  ts.factory.createIdentifier("data"),
                                 ),
-                              ]
-                            : undefined,
+                                ts.factory.createTypeReferenceNode(TData),
+                              ),
+                            ),
+                          ],
                         ),
                         ts.factory.createTypeReferenceNode(TData),
                       ),

diff --git a/tests/__snapshots__/createSource.test.ts.snap b/tests/__snapshots__/createSource.test.ts.snap
@@ -14,15 +14,15 @@ exports[`createSource > createSource 2`] = `
 import { type QueryClient, useQuery, useSuspenseQuery, useMutation, UseQueryResult, UseQueryOptions, UseMutationOptions, UseMutationResult } from "@tanstack/react-query";
 import { findPets, addPet, getNotDefined, postNotDefined, findPetById, deletePet } from "../requests/services.gen";
 import { Pet, NewPet, Error, FindPetsData, FindPetsResponse, FindPetsError, AddPetData, AddPetResponse, AddPetError, GetNotDefinedResponse, GetNotDefinedError, PostNotDefinedResponse, PostNotDefinedError, FindPetByIdData, FindPetByIdResponse, FindPetByIdError, DeletePetData, DeletePetResponse, DeletePetError, $OpenApiTs } from "../requests/types.gen";
-export type FindPetsDefaultResponse = Awaited<ReturnType<typeof findPets>>;
+export type FindPetsDefaultResponse = Awaited<ReturnType<typeof findPets>>["data"];
 export type FindPetsQueryResult<TData = FindPetsDefaultResponse, TError = unknown> = UseQueryResult<TData, TError>;
 export const useFindPetsKey = "FindPets";
 export const UseFindPetsKeyFn = ({}: {} = {}, queryKey?: Array<unknown>) => [useFindPetsKey, ...(queryKey ?? [{}])];
-export type GetNotDefinedDefaultResponse = Awaited<ReturnType<typeof getNotDefined>>;
+export type GetNotDefinedDefaultResponse = Awaited<ReturnType<typeof getNotDefined>>["data"];
 export type GetNotDefinedQueryResult<TData = GetNotDefinedDefaultResponse, TError = unknown> = UseQueryResult<TData, TError>;
 export const useGetNotDefinedKey = "GetNotDefined";
 export const UseGetNotDefinedKeyFn = ({}: {} = {}, queryKey?: Array<unknown>) => [useGetNotDefinedKey, ...(queryKey ?? [{}])];
-export type FindPetByIdDefaultResponse = Awaited<ReturnType<typeof findPetById>>;
+export type FindPetByIdDefaultResponse = Awaited<ReturnType<typeof findPetById>>["data"];
 export type FindPetByIdQueryResult<TData = FindPetByIdDefaultResponse, TError = unknown> = UseQueryResult<TData, TError>;
 export const useFindPetByIdKey = "FindPetById";
 export const UseFindPetByIdKeyFn = ({}: {} = {}, queryKey?: Array<unknown>) => [useFindPetByIdKey, ...(queryKey ?? [{}])];
@@ -39,9 +39,9 @@ import * as Common from "./common";
 import { type QueryClient, useQuery, useSuspenseQuery, useMutation, UseQueryResult, UseQueryOptions, UseMutationOptions, UseMutationResult } from "@tanstack/react-query";
 import { findPets, addPet, getNotDefined, postNotDefined, findPetById, deletePet } from "../requests/services.gen";
 import { Pet, NewPet, Error, FindPetsData, FindPetsResponse, FindPetsError, AddPetData, AddPetResponse, AddPetError, GetNotDefinedResponse, GetNotDefinedError, PostNotDefinedResponse, PostNotDefinedError, FindPetByIdData, FindPetByIdResponse, FindPetByIdError, DeletePetData, DeletePetResponse, DeletePetError, $OpenApiTs } from "../requests/types.gen";
-export const useFindPets = <TData = Common.FindPetsDefaultResponse, TError = unknown, TQueryKey extends Array<unknown> = unknown[]>({}: {} = {}, queryKey?: TQueryKey, options?: Omit<UseQueryOptions<TData, TError>, "queryKey" | "queryFn">) => useQuery<TData, TError>({ queryKey: Common.UseFindPetsKeyFn({}, queryKey), queryFn: () => findPets({}) as TData, ...options });
-export const useGetNotDefined = <TData = Common.GetNotDefinedDefaultResponse, TError = unknown, TQueryKey extends Array<unknown> = unknown[]>({}: {} = {}, queryKey?: TQueryKey, options?: Omit<UseQueryOptions<TData, TError>, "queryKey" | "queryFn">) => useQuery<TData, TError>({ queryKey: Common.UseGetNotDefinedKeyFn({}, queryKey), queryFn: () => getNotDefined({}) as TData, ...options });
-export const useFindPetById = <TData = Common.FindPetByIdDefaultResponse, TError = unknown, TQueryKey extends Array<unknown> = unknown[]>({}: {} = {}, queryKey?: TQueryKey, options?: Omit<UseQueryOptions<TData, TError>, "queryKey" | "queryFn">) => useQuery<TData, TError>({ queryKey: Common.UseFindPetByIdKeyFn({}, queryKey), queryFn: () => findPetById({}) as TData, ...options });
+export const useFindPets = <TData = Common.FindPetsDefaultResponse, TError = unknown, TQueryKey extends Array<unknown> = unknown[]>({}: {} = {}, queryKey?: TQueryKey, options?: Omit<UseQueryOptions<TData, TError>, "queryKey" | "queryFn">) => useQuery<TData, TError>({ queryKey: Common.UseFindPetsKeyFn({}, queryKey), queryFn: () => findPets({}).then(response => response.data as TData) as TData, ...options });
+export const useGetNotDefined = <TData = Common.GetNotDefinedDefaultResponse, TError = unknown, TQueryKey extends Array<unknown> = unknown[]>({}: {} = {}, queryKey?: TQueryKey, options?: Omit<UseQueryOptions<TData, TError>, "queryKey" | "queryFn">) => useQuery<TData, TError>({ queryKey: Common.UseGetNotDefinedKeyFn({}, queryKey), queryFn: () => getNotDefined({}).then(response => response.data as TData) as TData, ...options });
+export const useFindPetById = <TData = Common.FindPetByIdDefaultResponse, TError = unknown, TQueryKey extends Array<unknown> = unknown[]>({}: {} = {}, queryKey?: TQueryKey, options?: Omit<UseQueryOptions<TData, TError>, "queryKey" | "queryFn">) => useQuery<TData, TError>({ queryKey: Common.UseFindPetByIdKeyFn({}, queryKey), queryFn: () => findPetById({}).then(response => response.data as TData) as TData, ...options });
 export const useAddPet = <TData = Common.AddPetMutationResult, TError = unknown, TContext = unknown>(options?: Omit<UseMutationOptions<TData, TError, {}, TContext>, "mutationFn">) => useMutation<TData, TError, {}, TContext>({ mutationFn: ({}) => addPet({}) as unknown as Promise<TData>, ...options });
 export const usePostNotDefined = <TData = Common.PostNotDefinedMutationResult, TError = unknown, TContext = unknown>(options?: Omit<UseMutationOptions<TData, TError, {}, TContext>, "mutationFn">) => useMutation<TData, TError, {}, TContext>({ mutationFn: ({}) => postNotDefined({}) as unknown as Promise<TData>, ...options });
 export const useDeletePet = <TData = Common.DeletePetMutationResult, TError = unknown, TContext = unknown>(options?: Omit<UseMutationOptions<TData, TError, {}, TContext>, "mutationFn">) => useMutation<TData, TError, {}, TContext>({ mutationFn: ({}) => deletePet({}) as unknown as Promise<TData>, ...options });
@@ -55,9 +55,9 @@ import * as Common from "./common";
 import { type QueryClient, useQuery, useSuspenseQuery, useMutation, UseQueryResult, UseQueryOptions, UseMutationOptions, UseMutationResult } from "@tanstack/react-query";
 import { findPets, addPet, getNotDefined, postNotDefined, findPetById, deletePet } from "../requests/services.gen";
 import { Pet, NewPet, Error, FindPetsData, FindPetsResponse, FindPetsError, AddPetData, AddPetResponse, AddPetError, GetNotDefinedResponse, GetNotDefinedError, PostNotDefinedResponse, PostNotDefinedError, FindPetByIdData, FindPetByIdResponse, FindPetByIdError, DeletePetData, DeletePetResponse, DeletePetError, $OpenApiTs } from "../requests/types.gen";
-export const useFindPetsSuspense = <TData = Common.FindPetsDefaultResponse, TError = unknown, TQueryKey extends Array<unknown> = unknown[]>({}: {} = {}, queryKey?: TQueryKey, options?: Omit<UseQueryOptions<TData, TError>, "queryKey" | "queryFn">) => useSuspenseQuery<TData, TError>({ queryKey: Common.UseFindPetsKeyFn({}, queryKey), queryFn: () => findPets({}) as TData, ...options });
-export const useGetNotDefinedSuspense = <TData = Common.GetNotDefinedDefaultResponse, TError = unknown, TQueryKey extends Array<unknown> = unknown[]>({}: {} = {}, queryKey?: TQueryKey, options?: Omit<UseQueryOptions<TData, TError>, "queryKey" | "queryFn">) => useSuspenseQuery<TData, TError>({ queryKey: Common.UseGetNotDefinedKeyFn({}, queryKey), queryFn: () => getNotDefined({}) as TData, ...options });
-export const useFindPetByIdSuspense = <TData = Common.FindPetByIdDefaultResponse, TError = unknown, TQueryKey extends Array<unknown> = unknown[]>({}: {} = {}, queryKey?: TQueryKey, options?: Omit<UseQueryOptions<TData, TError>, "queryKey" | "queryFn">) => useSuspenseQuery<TData, TError>({ queryKey: Common.UseFindPetByIdKeyFn({}, queryKey), queryFn: () => findPetById({}) as TData, ...options });
+export const useFindPetsSuspense = <TData = Common.FindPetsDefaultResponse, TError = unknown, TQueryKey extends Array<unknown> = unknown[]>({}: {} = {}, queryKey?: TQueryKey, options?: Omit<UseQueryOptions<TData, TError>, "queryKey" | "queryFn">) => useSuspenseQuery<TData, TError>({ queryKey: Common.UseFindPetsKeyFn({}, queryKey), queryFn: () => findPets({}).then(response => response.data as TData) as TData, ...options });
+export const useGetNotDefinedSuspense = <TData = Common.GetNotDefinedDefaultResponse, TError = unknown, TQueryKey extends Array<unknown> = unknown[]>({}: {} = {}, queryKey?: TQueryKey, options?: Omit<UseQueryOptions<TData, TError>, "queryKey" | "queryFn">) => useSuspenseQuery<TData, TError>({ queryKey: Common.UseGetNotDefinedKeyFn({}, queryKey), queryFn: () => getNotDefined({}).then(response => response.data as TData) as TData, ...options });
+export const useFindPetByIdSuspense = <TData = Common.FindPetByIdDefaultResponse, TError = unknown, TQueryKey extends Array<unknown> = unknown[]>({}: {} = {}, queryKey?: TQueryKey, options?: Omit<UseQueryOptions<TData, TError>, "queryKey" | "queryFn">) => useSuspenseQuery<TData, TError>({ queryKey: Common.UseFindPetByIdKeyFn({}, queryKey), queryFn: () => findPetById({}).then(response => response.data as TData) as TData, ...options });
 "
 `;