GraphiQL Modernization

[trevor-scheer]

The GraphQL Foundation is running a Call for Projects. For my submission, I'm proposing a modernization of GraphiQL. This "modernization" is two-pronged: bringing feature parity with other popular IDEs as well as overhauling the appearance. with the intention of modernizing the feel and making things a bit more dense on screen. This brings a more familiar feel to today's popular IDEs.

I'm posting here seeking feedback from anyone who'd like to share their opinions 😄

Additional features

I'd like to introduce a couple "new" features which other IDEs already implement. These could just as well be added to the current major version and ported forward, as the existing plugin API should provide the necessary affordances for these.

Query Builder (GraphiQL Explorer)

This already exists as a plugin in the community and was just never pulled in as a first party, though there was intention to.
#734

Operation Collections

Redesign mockup

The redesign intends to bring a more familiar IDE-like feel with a lot less padding and more information density.

[martinbonnin]

Love it! Love the collections and query builder and how the whole thing looks. Feels a lot more modern±

Something else that I've been missing is the ability to switch between GET/POST/persisted queries. Would be very useful while woking on the graphql-over-http spec.

[trevor-scheer]

GET/POST switcher seems like a trivial addition. For PQs, I think that's a bit too platform-centric but should be fairly easily built as a community plugin! I've implemented something similar with an operation manifest at Vanta that lets you choose from a list of known operations.

[martinbonnin]

a bit too platform-centric but should be fairly easily built as a community plugin!

Plan would to get GraphiQL to dogfood the community approved version (was planning to link to the PR but GitHub decided otherwise as those PRs are not showing right now 😱 ...). We need a standard for PQs/Trusted Documents badly.

[trevor-scheer]

Oooh I didn't know there was one, sounds awesome! I was also seeing some spooky PRs missing earlier.

[jerelmiller]

@trevor-scheer love the direction! Are you thinking this would need a new major version to accomodate some of the new features? For example, GET/POST is something that the fetcher determines, but right now thats just a function so we'd need to get creative to pull that information from the fetcher (I have some ideas that I plan to open a PR for). That said, perhaps it might be time to revisit the public API to better support all of these things?

[jerelmiller]

That said... new features !== redesign. A redesign (new colors, button styles, etc) can happen before the new features are added so perhaps my question more comes from the perspective of how those new features correlate to the new design and how they are sequenced by release.

[martinbonnin]

Another quality of life improvement I'd love to see: being able to link tp a Type/field (schema coordinate) directly so I can send links to colleagues, or put in GitHub descriptions.

[benjie]

I'd love to see operation expressions used for this - they can be a very concise way to represent a navigation stack through the GraphQL schema.