feat: Guided Tours Foundation#2348
Draft
camielvs wants to merge 2 commits into
Draft
Conversation
🎩 PreviewA preview build has been created at: |
This was referenced Jun 2, 2026
This was referenced Jun 2, 2026
Collaborator
Author
|
Warning This pull request is not mergeable via GitHub because a downstack PR is open. Once all requirements are satisfied, merge this PR as a stack on Graphite.
This stack of pull requests is managed by Graphite. Learn more about stacking. |
3 tasks
5699235 to
607e516
Compare
This was referenced Jun 3, 2026
9db5395 to
07b002a
Compare
2f49ef0 to
451d5ed
Compare
07b002a to
2262436
Compare
451d5ed to
b1c08c3
Compare
2262436 to
d83a715
Compare
b1c08c3 to
a5670ee
Compare
d83a715 to
dd40a33
Compare
a5670ee to
aaff170
Compare
dd40a33 to
47cfe52
Compare
aaff170 to
c3ae9d0
Compare
47cfe52 to
606887b
Compare
67bc062 to
ab32946
Compare
4be9597 to
28c63d6
Compare
ab32946 to
20d59a5
Compare
28c63d6 to
8e58bee
Compare
20d59a5 to
7980a3d
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
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.

Description
The reactour-based guided tour engine, wired into the dashboard's
/learn/tourshub and the v2 editor. Foundation only — the tour registry ships empty, so no tour can run yet. Subsequent PRs in the stack add interaction primitives (#2299), a custom navigation UI (#2340), ephemeral pipelines (#2334), an end-screen (#2339), and the first two registered tours (#2306, #2312).While the registry is empty, every tour card on the Learning Hub says "Coming soon" and the framework merge is invisible to users.
Architecture
Route (
src/routes/Dashboard/Learn/Tour.tsx)/tour/$tourId— refreshable, shareable, owns its own lifecycle.tourIdagainst the registry; redirects to/learn/toursif unknown.<TourModeProvider>+<EditorV2>from the first frame; the editor body shows a skeleton while the tour pipeline resolves, so the menu bar stays mounted (no flicker on entry).?step=N↔ reactour'scurrentStepso browser back/forward navigates steps.Reactour wrapper (
src/providers/TourProvider/TourProvider.tsx)showCloseButton={false},onClickMask={() => undefined},disableKeyboardNavigation={["esc"]}. The only exits are the explicit Exit Tour button or the Done button on the final step.renderNextButton; popover viewport clamping viaPopoverClampBridgekeeps the step-number badge from being clipped near screen edges.Tour-mode context (
src/providers/TourProvider/TourModeContext.tsx)useTourMode()exposes{ tour, tempPipelineName }to editor components.EditorMenuBarreads this to render a Tour badge next to the pipeline name and the central Exit Tour button; destructive file-menu actions (rename / delete) are hidden in tour mode.EditorV2Contentreads it too: whenpipelineRefis null and we're in tour mode, it showsPipelineEditorSkeletoninstead ofEmptyEditorState.Editor bridge stub (
src/routes/v2/pages/Editor/components/EditorTourBridge.tsx)EditorV2.tsxcan import it.Layout snapshot (
src/routes/v2/shared/windows/windowPersistence.ts)snapshotLayout/restoreLayoutstash the editor's persisted window arrangement so a tour can mutate it freely and roll back on exit.Registry types (
src/components/Learn/tours/registry.ts)TourDefinition+TourStep(extends reactour'sStepType). Emptytours: TourDefinition[] = []array — tours register themselves in their own PRs.How tours get added
src/components/Learn/tours/<yourTour>.tour.jsonmatchingTourDefinition.toursarray inregistry.ts.data-*anchors on the UI elements your steps target. Already available:data-tour="..."— panels and barsdata-dock-area,data-dock-window,data-dock-window-content,data-window-id— dock/window systemdata-tour-anchor="no-spotlight"— center a popover with no highlightRelated Issue and Pull requests
Progresses https://github.com/Shopify/oasis-frontend/issues/583
Type of Change
Checklist
Test Instructions
The framework is invisible to users until a tour registers, so the only thing to verify is no-regression:
/learn/toursand the dashboard Featured Tours tile render every tour card as "Coming soon"./tour/anythingredirects to/learn/tours.Additional Comments
The remainder of the stack lands the interaction primitives and the first two tours. Once #2306 and #2312 are merged, the Learning Hub has actual tours to walk through.