GraphiQL Explorer authorization visualization with colors

[anasbarg]

GraphiQL Explorer authorization visualization with colors

This can be done by coloring possible selections with green (checked and allowed), red (checked but not allowed), grey (unchecked but not allowed), and light green (unchecked and allowed).

Why

This is a good idea because users can write valid queries, and debug auth rules in real-time without having to run every single possible query/mutation to see if it's valid or not.

Limitation

This will allow users to visualize selections (read/inner reads) in a given operation but not it's inputs. This can be solved by highlighting the input JSON values.