feat: Allow Users to Save Tour Pipelines

[camielvs]

Description

Adds a Save this pipeline affordance at the end of every tour. Curious users who want to keep poking at the pipeline they just walked through (or use it as a starting point) can convert the ephemeral tour pipeline into a real, durable one.

Surfaces only on the last tour step, as a small link-style button below the primary Done action, under a "Continue exploring:" label. Clicking it:

1. Closes the tour popover (so the mask doesn't interfere with the dialog),
2. Opens a name-picker dialog,
3. On submit, serializes the current spec with the new name, writes it to the durable IndexedDB store, and navigates the user into the regular /editor/$name route with the new file open.

If the user just clicks Done, behavior is unchanged: tour ends, temp pipeline stays in session storage until the next tour starts (which resets it).

Architecture

TourCompletionActions extension (src/providers/TourProvider/tourPopover.tsx)

• The existing Done button (from the framework PR) is now joined by a conditional "Save this pipeline" button when saveExploreHandler is registered. Both render in the last step's content area.
• A module-level saveExploreHandler slot + registerSaveExploreHandler(cb) API bridges the React tree gap between the reactour popover (rendered above TourModeProvider in the tree, no access to it) and the dialog host (rendered below SharedStoreProvider, has the spec access we need). The popover only knows "is something registered? if so, call it". The dialog host is what registers itself.

TourSaveExploreDialog (src/providers/TourProvider/TourSaveExploreDialog.tsx, mounted inside EditorV2Content)

• Owns the dialog open/close state.
• Registers a setOpen(true) handler with registerSaveExploreHandler on mount when tourMode is active; clears it on unmount.
• On submit: reads the current root spec from useSharedStores().navigation, renames it in-memory via usePipelineActions().renamePipeline, serializes to YAML, and calls tourMode.promoteToPipeline(name, yaml).

promoteToPipeline (src/providers/TourProvider/TourModeContext.tsx + Tour.tsx)

• New field on the TourModeContext value. The implementation lives in TourPage (above the storage override) where usePipelineStorage() resolves to the durable IndexedDB service.
• Creates a new file in the durable store with the provided name and YAML, then navigates to /editor/$name. Errors surface via useToastNotification.

Why the indirection through a module-level handler

The natural place to render the dialog is inside EditorV2, where SharedStoreProvider exposes the live spec. The natural place to render the trigger button is the popover, which reactour mounts above our TourModeProvider. React Context can't bridge that gap (the popover renders outside the provider's subtree). The module-level slot is the smallest possible bridge: one writer, one reader, scoped by lifecycle of the dialog host.

Related Issue and Pull requests

Progresses https://github.com/Shopify/oasis-frontend/issues/583

Type of Change

• New feature

Checklist

• I have tested this does not break current pipelines / runs functionality
• I have tested the changes on staging

Screenshots

Test Instructions

Pre-req: a registered tour (use this branch with #2306 on top).

Happy path

• Start a tour and step through to the final step.
• Confirm the popover footer shows Done (primary) and, below it, Save this pipeline (small link).
• Click Save this pipeline. The popover closes, a name dialog opens.
• Enter a unique name and submit. You should land in /editor/<name> with the pipeline open and editable. The file appears in the regular pipelines list.
• The original tour pipeline (__tour__<slug>) remains in session storage; it'll be reset on the next tour start.

Cancel / dismiss

• Reach the last step again. Click Save this pipeline, then Close the name dialog without submitting.
• You're now in the tour route with no popover. The Exit Tour button in the nav bar still works.

Name collision

• Save the tour pipeline as some name. Reach the last step of any tour again and try to save with the same name. The dialog should flag "Name already exists".

Regression

• Click Done on the last step (don't touch Save). The tour ends, you land on /learn/tours, nothing is added to the pipelines list.
• Tours other than the last step show no Save button. ESC, the mask, and the (hidden) close button still don't dismiss the popover.

Additional Comments

The "Continue exploring:" framing is intentional — users who walk through a guided tour and walk away should not feel obligated to save anything. Save is opt-in for the curious.

[github-actions]

🎩 Preview

A preview build has been created at: 05-28-feat_save_and_resume_paused_tours/e8f940e

[camielvs]

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.
Learn more

• feat: Guided Tour - Navigating the Editor #2306 : 2 dependent PRs (#2307 , #2312 )
• feat: Allow Users to Save Tour Pipelines #2339 👈 (View in Graphite)
• feat: Guided Tours Ephemeral Pipelines #2334
• feat: Learning Hub Tour Framework #2299
• feat: Learning Hub Guided Tours #2297
• feat: Learning Hub Tip of the Day #2292
• feat: Learning Hub Tip Browser #2291
• feat: Learning Hub Example Pipelines #2283
• feat: Learning Hub Documentation & FAQ #2282
• feat: Learning Hub Dashboard #2281
• master

This stack of pull requests is managed by Graphite. Learn more about stacking.