Switch from apollo to graphql-codegen

[louischan-oursky]

I spent some time on studying on how to migrate from apollo to graphql-codegen seamlessly. Unfortunately graphql-codegen does not provide no-brainer way to migrate. It is possible to mimic the behavior of generating multiple files next to the source file in __generated__/[OperationName].ts. However, The [OperationName_Type_fieldName] naming convention cannot be achieved. Therefore, migration requires us to adopt the convention of graphql-codegen, which requires significant code change on how our hand-written code interacts with the generated code.

[louischan-oursky]

Goals

• Use graphql-codegen to generate codes

Requirements

• Place graphql queries and mutations in .graphql, as opposed to our current convention of gql call in .ts files
• Each .graphql contains either ONE query or ONE mutation
• The name of the query or mutation is in lowercase.
• The name of the .graphql follows the query or the mutation it contains
• Install necessary plugins so that the generated code exports the following
  • The gql call
  • The relevant types
  • The useXXX query hook or mutation hook