v6: Add TopBar layout component#4288
Merged
Merged
Conversation
🦋 Changeset detectedLatest commit: 11d6996 The changes in this PR will be included in the next version bump. Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
Contributor
|
The latest changes of this PR are not available as canary, since there are no linked |
A new top-of-app bar with the GraphiQL brand, an endpoint URL display, a command palette button, and a Run button. Run wires to `useGraphiQLActions().run` and disables while a fetch is in flight. The endpoint URL and command palette button are intentional placeholders; their behavior fills in once transport and command-palette work land.
`wordmark` is a real term for the GraphiQL logotype next to the brand mark in the top bar. oxfmt also collapses the now-shorter destructured props onto a single line.
Splits the connected `TopBar` from a pure `TopBarView`. The unit tests now render `TopBarView` directly, sidestepping the monaco teardown errors that `GraphiQLProvider` triggers in jsdom.
`defaults to the built-in default query` was timing out on its 15s `waitFor`; the added `TopBar` shifts the layout enough that the cold Monaco boot exceeds that budget on CI's forks pool. Bumped to 25s. Switched `onRun` in `TopBarView` test defaults to method shorthand to satisfy `object-shorthand`.
trevor-scheer
force-pushed
the
trevor/topbar-component
branch
from
d40da52 to
11d6996
Compare
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
This PR introduces the top bar that anchors the new GraphiQL v6 layout. It renders the brand, an endpoint URL display, a command palette button, and a primary Run button across the top of the app. The endpoint URL and command palette are intentional placeholders; their behavior will fill in once the transport and command palette work land.
Test plan
Refs: #4219