Skip to content

Add live GraphiQL playground page pointed at devnet #1198

@dkijania

Description

@dkijania

Part of #1195 (Track 2).

Goal

Embed a live, in-browser GraphQL explorer in docs2, pointed at a public Mina devnet endpoint. Read-only. Lets developers (and agents that drive a real browser) try queries against real chain data without spinning up a node or copying queries elsewhere.

Why live, not mocked

A live devnet endpoint is more useful than a mock and avoids the maintenance cost of keeping mocks aligned with the schema. The tradeoff is the playground breaking when devnet is down — acceptable for a dev tool. If devnet rate-limits or ToS become a problem, add a thin Cloudflare Worker proxy with caching as a follow-up.

Approach

  1. New page docs/integrate/graphql-api/playground.mdx.
  2. Use @graphiql/react (or graphql-playground-react if smaller bundle) inside an MDX page. Both are React, both work in Docusaurus.
  3. Default endpoint: a public devnet GraphQL URL (decide which one — there are a few; pick one operations is happy to keep up).
  4. Read-only: hide or disable the mutation tab, or proxy through a worker that rejects mutations. Simpler: client-side filter on the operation kind before the request fires.
  5. Pre-populate the query editor with a useful starter query (e.g. bestChain(maxLength: 1) { stateHash creator }).
  6. Pin a small CSS fix so the GraphiQL component plays nicely with Docusaurus's layout (full-height container).

Acceptance criteria

  • Page renders and connects to the chosen devnet endpoint.
  • Query / docs / schema-explorer panes work.
  • Mutations are blocked or hidden.
  • Works on the Vercel preview deployment.
  • Sidebar entry added under Integrate with Mina → GraphQL API.
  • Bundle size impact noted in PR description (GraphiQL pulls in a Monaco-ish editor — flag it).

Depends on

Endpoint decision — needs ops sign-off on which devnet host is OK to advertise as "the playground endpoint." Tag the relevant team in the PR.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions