Include example queries in the welcome text of the query page

[proehlen]

Current welcome text displayed on the Query page in GraphiQL is a generic introduction to graphql queries. We could enhance this to display examples using overnode api queries.

[proehlen]

Looked into this some time ago and I think the answer is providing the graphiql react component wrapped in a vuejs component. There are options for setting the welcome text and other things like styling etc. Can be done as a lazy / dynamic import so that webpack code splits it and it isn't sent to the browser unless the user requests it.

[proehlen]

This page explains how to import it and set the "query" parameter (the welcome text):
https://github.com/graphql/graphiql

Only difference is that we'd want to:

• use --save-dev instead of --save since webpack builds it from the dev dependencies.
• import it and all the react modules dynamically so webpack can code-split it per something like this article https://medium.com/@codetheorist/using-vuejs-computed-properties-for-dynamic-module-imports-2046743afcaf