From e5abb3aad6f359118d083858192f2f27cca0e4f6 Mon Sep 17 00:00:00 2001 From: toniocodo Date: Fri, 22 Sep 2023 09:45:15 +0200 Subject: [PATCH] docs: add gql readme instructions, move .env to oeth --- README.md | 17 +++++++++++++++++ libs/oeth/shared/.env | 1 + 2 files changed, 18 insertions(+) create mode 100644 libs/oeth/shared/.env diff --git a/README.md b/README.md index b0d6c7d50..139f5a454 100644 --- a/README.md +++ b/README.md @@ -44,3 +44,20 @@ pnpm nx run-many -t -p ``` Targets can be defined in the `package.json` or `projects.json`. Learn more [in the docs](https://nx.dev/core-features/run-tasks). + +## graphQl + +We use `react-query` in conjunction with `graphql-codegen` for interacting with graphQl endpoint. Here's how to use (this example is taken from oeth app): + +- write gql colocated to your components, in respective `queries|mutations|subscriptions|fragments.graphql` file +- you get graphql autocompletion based on the schema located in `.graphqlconfig` at the root of the repo +- run the graphql-codegen task with `pnpm nx run oeth-shared:codegen-graphql`, it will generate + - the global types in `libs/oeth/shared/src/generated/graphql.ts` and + - the generated hooks next to your graphql file (i.e. `/libs/oeth/history/src/queries.generated.tsx`) +- use the generated hooks in your component with fully typed args and results! + +Couple of things to note: +- generated hooks receives args as first param, second param exposes all react-query api for controlling execution +- react-query http client is automatically injected via codegen, it is defined here `libs/oeth/shared/src/clients/graphql.ts` +- autocompletion is ensured by `.graphqlconfig`, you'll probably need the proper IDE plugin to handle it +- there's a `--watch` flag that you can pass to the codegen if you want to autodetect changes diff --git a/libs/oeth/shared/.env b/libs/oeth/shared/.env new file mode 100644 index 000000000..edd2c958b --- /dev/null +++ b/libs/oeth/shared/.env @@ -0,0 +1 @@ +VITE_SUBSQUID_URL="https://squid.subsquid.io/origin-squid/v/v5/graphql"