# GraphQL queries

All API requests made to the backend are done as GraphQL requests.

React query is used to actually execute queries and handle pagination, optimistic updates, etc. The src/frontend/hooks/api.ts file contains wrapper hooks for queries/mutations that need to be made in the dapp. It is recommended that you stick to this convention when adding new queries.

The src/shared/graphql/schema.ts file contains all the queries and mutations available. Adding a new query or mutation involves the following:

Update schema.ts.
Update one or more of fragments.ts, queries.ts, mutations.ts.
Update the backend resolvers.ts to ensure the query gets handled in the backend.

In dev mode a code generator watches for changes to schema.ts, generating updated Typescript bindings on-the-fly. These bindings are used by the backend resolvers to accurately resolve query and parameter names.

# Authenticated queries

It's useful to be able to have certain queries and mutations only be callable by authenticated users. This is easily accomplished through the use of the @auth directive in the schema definition:

Example:

type Query {
  # this query will fail if the user isn't authenticated
  getMyNotifications(pageParam: PageParam!): MyNotifications! @auth
  # this query will work for all users, even unauthenticated ones
  getLatestNews(): [NewsItem]!
}

If the user isn't authenticated (i.e. logged in) then the above getMyNotifications query will fail.

Authenticated queries/mutations automatically have a variable set within their corresponding backend resolver contexts, e.g:

return {
  Query: {
    getMyNotifications: async (_, { pageParam }, ctx: Context) => {
      console.log(ctx.user!.name) // wallet address
    }
  }
}

# Sandbox GUI

When the dev server is run, accessing the /api/graphql path in the browser will bring up the Apollo Sandbox. Through this GUI you can enumerate and test all the GraphQL schema definitions, including queries and mutations.