[graphiql] Keep open the graphiql Explorer open when the page load

[yravelom]

Is there an existing issue for this?

• I have searched the existing issues

Current Behavior

I cant keep the graphiql explorer open from the first time, the left side bar it show always collapse. Im using the explorerIsOpen: true on the useExplorerPlugin({ explorerIsOpen: true, query, onEdit: setQuery }). If i set this property to true or false when the page load the first time explorer is collapse. When you click on the Graphiql explorer icon it will expand. If the explorerIsOpen is set to false non content will shown.

Expected Behavior

I want that the graphiql explorer remain open/visible from the first load. How can i do that?

Steps To Reproduce

I have this code so far,
const ExplorerView: FunctionComponent<ListViewProps> = () => {
	const classes = useStyles();
	const { setTheme } = useTheme();
	const [query, setQuery] = useState("");
	const explorerPlugin = useExplorerPlugin({ explorerIsOpen: true, query, onEdit: setQuery });

	return (
		<div className={classes.root}>
			<GraphiQL
				fetcher={fetcher}
				defaultEditorToolsVisibility={true}
				query={query}
				onEditQuery={setQuery}
				plugins={[explorerPlugin]}
			/>
		</div>
	);
};
export default ExplorerView;

Module pattern

• graphiql-umd
• graphiql-esm
• graphiql-commonjs

Environment

- GraphiQL Version:2.2.0
- OS:Windows 10 Pro
- Browser: Chrome
- Bundler:
- `react` Version:17.0.2
- `graphql` Version:16.0.1
- `@graphiql/plugin-explorer`: 0.1.12

Anything else?

No response

[jonathanawesome]

This prop comes from the source package and doesn't do what it says on the tin in the context of GraphiQL.

Have a look at the visiblePlugin prop.

[Godspeed-exe]

@jonathanawesome sorry for the noobie question, but I'm also looking for this and it doesn't seem to be as easy/clearly documented as you would expect.

I've also created a question on StackOverflow about this: https://stackoverflow.com/questions/75791142/how-to-show-graphiql-explorer-by-default

[jonathanawesome]

looks like you got it resolved, which is great!