How to show GraphiQL Explorer by default?

Question

I'm deploying a GraphiQL instance (in Laravel with https://github.com/mll-lab/laravel-graphiql) and it's working so far, but I want to show the GraphiQL Explorer by default to the users.

Any idea how to do this with below code?

` function GraphiQLWithExplorer() { const [query, setQuery] = React.useState('');

    return React.createElement(GraphiQL, {
        fetcher: fetcher,
        query: query,
        onEditQuery: setQuery,
        defaultEditorToolsVisibility: true,
        plugins: [
            GraphiQLPluginExplorer.useExplorerPlugin({
                query: query,
                onEdit: setQuery
            })
        ],
    });
}`

Thanks in advance!

I tried some options like: isVisible: true, visibility: true, showExplorerContext: true

Been going through the repo looking for something that would work, but it seems to be very hard to find

score 0 · Answer 1 · answered Mar 20 '23 at 14:51

Always keep trying to solve your own problems! :)

const Explorer = GraphiQLPluginExplorer.useExplorerPlugin({
            query: query,
            onEdit: setQuery,
            explorerIsOpen: true
        });

return React.createElement(GraphiQL, {
    fetcher: fetcher,
    query: query,
    onEditQuery: setQuery,
    defaultEditorToolsVisibility: true,
    explorerIsOpen: true,
    plugins: [
        Explorer
    ],
    visiblePlugin: Explorer            
});

How to show GraphiQL Explorer by default?

1 Answers1