Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Installing Zeus with React Query: Missing reactQuery.ts and Type Safety #384

Open
mrigankdoshy opened this issue Nov 6, 2023 · 2 comments

Comments

@mrigankdoshy
Copy link

Hello :)

I'm running into two issues when trying to use Zeus with React Query and TypeScript in a React Native mobile app

Problem 1

When running zeus schema.graphql ./ --reactQuery (from the directory where the schema.graphql exists) , according to the documentation, it should generate a reactQuery.ts file from which we can import useTypedQuery. However, when I run that command, it does not seem to generate that file

image

I have "graphql-zeus": "^5.3.2", as a dependency in my package.json file

Am I missing something?

Problem 2

With the generated files (index.ts and const.ts), I'm unable to receive strong type safety.

For example, here's a simple schema (schema.graphql):

type Todo {
    id: ID!
    text: String!
    completed: Boolean!
}

type Query {
    todos: [Todo!]!
    todo(id: ID!): Todo
    getTodo(id: ID!): Todo
}

type Mutation {
    addTodo(text: String!): Todo
    updateTodo(id: ID!, text: String, completed: Boolean): Todo
    deleteTodo(id: ID!): Boolean
}

Using useQuery from react-query, this works well:

    const chain = Chain(
        'https://api.example.com',
        {
            headers: {
                'x-api-key': 'key-here',
            },
        }
    );

    const { data } = useQuery('todos-data', {
        queryFn: () =>
            chain('query')({
                todos: {
                    id: true,
                    text: true,
                    completed: true,
                },
            }),
    });

However, with the below, I don't get type safety (i.e. it does not complain that thisIsAnInvalidProp is not a valid parameter for the query)

image

Is there a way to enable strong type safety?


Note: This is a quick code sample and is not the actual schema I'm working with. Truly appreciate any help here, happy to answer any questions :)

@hendrik244
Copy link

hendrik244 commented Jan 9, 2024

Same for me, I don't get reactQuery.ts generated either...
@mrigankdoshy did you make it work?

@rhkdgns95
Copy link

Same for me, I don't get reactQuery.ts generated either...
@hendrik244 did you make it work?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants