Upgrade/replace `@apollo/client`

[andrew8er]

Describe the Problem

While investigating what it needs to upgrade to React 19, I notices that @apollo/client and apollo-upload-client are dragging in React 18 as dependencies, which creates non-obvious runtime errors.

Upgrading to the current @apollo/client version 4.1.3 and apollo-upload-client 19.0.0 would fix this but needs a bit more refactoring: https://www.apollographql.com/docs/react/migrating/apollo-client-4-migration. This particularly affects our error handling.

Another major change is that latest @apollo/client is not compatible with they way we generate our query/mutation hooks, and in fact, it is also not recommended anymore: https://www.apollographql.com/docs/react/development-testing/graphql-codegen#a-note-about-the-client-preset. An AI code agent could be of help here.

Since we need to upgrade @apollo/client/apollo-upload-client with some larger changes, this would also open the possibility to replace those packages with a more compact alternative, like urql:

• urql natively implements the GraphQL Multipart Request spec: https://nearform.com/open-source/urql/docs/advanced/persistence-and-uploads/#file-uploads
• Is considerably smaller: https://pkg-size.dev/urql vs https://pkg-size.dev/@apollo%2Fclient (rxjs contributes significantly to apollos size here).
• Has good integration with the GraphQL codegen package: https://the-guild.dev/graphql/codegen/docs/getting-started#from-the-frontend

I use urql in a personal project and can attest that it is pretty easy to set up and works without any problems so far.

We should also upgrade our current graphql-codegen.yml to codegen.ts, which is now the recommended config format. We still need a minimal graphql-codegen.yml, since this is the file most IDEs (at least VS Code and IntelliJ) use to configure their GraphQL support.

Describe Your Preferred Solution

• Provide codegen.ts, adjust package.json scripts.
• Provide minimal graphql-codegen.yml for IDEs.
• Replace @apollo/client/apollo-upload-client with urql.
• Replace generated React hooks with urql hook call and generated request objects.

Describe Possible Alternatives

• Provide codegen.ts, adjust package.json scripts.
• Provide minimal graphql-codegen.yml for IDEs.
• Upgrade @apollo/client/apollo-upload-client to latest version
• Replace generated React hooks with apollo-client hook call and generated request objects.

Related Issues

• Update to React 19 #2693
• What do we cache and where does it get cached? #2696