Support providers for the GraphQL server: Gato GraphQL in addition to WPGraphQL

[leoloso]

The starter now accepts defining the "provider" for the GraphQL server for WordPress, between these 2 providers:

• WPGraphQL (this was the only one until now)
• Gato GraphQL (this is the new addition)

By default, WPGraphQL is used. To use Gato GraphQL instead, we must add to .env.local:

WORDPRESS_GRAPHQL_PROVIDER="gatographql"

How does it work?

@colbyfayock's next-wordpress-starter project has a clear-cut architecture, neatly divided into logic and data layers.

To add support for another GraphQL server, only the data layer needed to be adapted; the logic layer remains as it was.

The strategy is to have the GraphQL query adapted using aliases, as to always produce the same response, independently of the server.

(In other words: even though WPGraphQL and Gato GraphQL offer slightly different schemas, they can still produce the same response).

For instance, the following query for WPGraphQL:

query AllCategories {
  categories(first: 10000) {
    edges {
      node {
        databaseId
        description
        id
        name
        slug
      }
    }
  }
}

...is adapted for Gato GraphQL like this:

query AllCategories {
  id
  categories: self {
    id
    edges: postCategories(pagination: { limit: -1 }) {
      node: self {
        databaseId: id
        description
        id
        name
        slug
      }
    }
  }
}

Since the response is the same, the logic layer doesn't need any adaptation at all.

Changes applied

Here is a description of all the changes applied over the upstream colbyfayock/next-wordpress-starter project:

Moved all data files under a providers subfolder

The data folder contains all .gql files with the GraphQL queries, originally corresponding to WPGraphQL. These files have now been moved under a corresponding "provider" subfolder:

• data/categories.js => data/providers/wpgraphql/categories.js
• data/menus.js => data/providers/wpgraphql/menus.js
• data/pages.js => data/providers/wpgraphql/pages.js
• data/posts.js => data/providers/wpgraphql/posts.js
• data/site.js => data/providers/wpgraphql/site.js
• data/users.js => data/providers/wpgraphql/users.js

And likewise, the corresponding files have been created for Gato GraphQL:

• data/providers/gatographql/categories.js
• data/providers/gatographql/menus.js
• data/providers/gatographql/pages.js
• data/providers/gatographql/posts.js
• data/providers/gatographql/site.js
• data/providers/gatographql/users.js

Depending on the selected provider, either the .gql files from WPGraphQL or from Gato GraphQL are exported.

Extracted queries from plugins/util.js

File plugins/util.js also contains a handful of GraphQL queries, to generate the metadata.

These queries have been extracted and placed under a .gql files under the corresponding "provider" subfolder:

• plugins/providers/wpgraphql/util.js
• plugins/providers/gatographql/util.js

Added env var WORDPRESS_GRAPHQL_PROVIDER

To select which GraphQL server to use. The default value is wpgraphql.