Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Custom Apollo landingspage setup in config.graphql.apolloConfig gives error #9014

Open
remihuigen opened this issue Feb 9, 2024 · 0 comments

Comments

@remihuigen
Copy link

  1. Set up a keystone app with the following graphql config
import { BaseKeystoneTypeInfo } from '@keystone-6/core/types'
import { GraphQLConfig } from '@keystone-6/core/types'
import { ApolloServerPluginLandingPageLocalDefault, ApolloServerPluginLandingPageProductionDefault } from '@apollo/server/plugin/landingPage/default';

const playgroundOptions = {
  embed: {
      endpointIsEditable: false,
      footer: false,
      initialState: {
          pollForSchemaUpdates: false,
          headers: {
              "api-key": process.env.SUPER_SECRET,
              "graphql-client-name": "playground",
              "graphql-client-version": process.env.npm_package_version,
          },
      }
  }
}

// See https://keystonejs.com/docs/config/config#server
const graphql: GraphQLConfig<BaseKeystoneTypeInfo> = {
  debug: process.env.NODE_ENV !== 'production',
  path: '/api/v2/private/graphql',
  playground: 'apollo',
  apolloConfig: {
    includeStacktraceInErrorResponses: process.env.NODE_ENV !== 'production',
    plugins: [
      process.env.NODE_ENV === 'production'
        ? ApolloServerPluginLandingPageProductionDefault({
          footer: false,
        })
        : ApolloServerPluginLandingPageLocalDefault(playgroundOptions),
    ]
  }
}

export { graphql };
// in ./keystone.ts
import { config } from '@keystone-6/core';

// to keep this file tidy, we define our config in seperate files
import { lists } from './schema/schema';
import { withAuth, session } from './config/auth';
import { ui } from './config/ui';
import { db } from './config/db';
import { server } from './config/server';
import { graphql } from './config/graphql';


export default withAuth(
  config({
    db,
    lists,
    session,
    ui,
    server,
    graphql
  })
);
  1. npm run dev

You'll get this error

✨ Starting Keystone
⭐️ Server listening on :4000 (http://localhost:4000/)
⭐️ GraphQL API available at /api/v2/private/graphql
unhandledRejection Error: Only one plugin can implement renderLandingPage.
    at ApolloServer._start (/Users/remihuigen/local-projects/my-project/node_modules/@apollo/server/dist/cjs/ApolloServer.js:213:23)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async ApolloServer.start (/Users/remihuigen/local-projects/my-project/node_modules/@apollo/server/dist/cjs/ApolloServer.js:143:16)
    at async startApolloServer (/Users/remihuigen/local-projects/my-project/.keystone/config.js:10961:3)

I want to change the default behavior of the Apollo playground, and according to the docs (here and here and here), this is the way to go about it.

I expected that setting the config.graphql.playground to "apollo" would disable all default plugins, so I could use my own.

I think (but I'm not sure) is has something to do with line 102 and 106 in this file. At 102 it spreads the supplied apolloConfig (which contains a plugin array), and at 106 it also spreads the plugins from apolloConfig.plugins

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant