feat: Guided Tours Ephemeral Pipelines

[camielvs]

Description

Moves tour pipelines out of the durable IndexedDB store and into session storage, so they are truly ephemeral. Before this change, a tour-pipeline lived alongside the user's real pipelines: it showed up in the pipelines list, contended for unique names, and survived browser refresh — none of which is what we want from a guided demo.

The fix is a scoped storage override that only applies while the user is on /tour/$tourId. Inside the tour route, usePipelineStorage() returns a TourPipelineStorageService backed by sessionStorage; everywhere else, it still returns the durable IndexedDB service. The autosave path, the spec loader, and the editor's storage consumers don't need to know which one they're talking to.

What changed

New scoped storage layer (src/providers/TourProvider/tourPipelineStorage/)

• SessionStoragePipelineDriver.ts — driver that reads/writes pipeline YAML against sessionStorage keys, matching the shape the existing PipelineStorageService expects from a driver.
• TourPipelineFolder.ts — single root folder that holds the tour pipeline, with canMoveFilesOut: false etc. so the rest of the app can't accidentally relocate it.
• TourPipelineStorageService.ts — PipelineStorageService subclass whose rootFolder, resolvePipelineByName, etc. all go through the session-storage driver.
• TourPipelineStorageProvider.tsx — context override that the tour route wraps its body in. Inside, usePipelineStorage() resolves to the tour service.
• resetAllTourPipelineState.ts — clears every __tour__* key from session storage and evicts matching entries from the react-query spec cache. Called when starting any tour so each run begins clean.

Tour route plumbing (src/routes/Dashboard/Learn/Tour.tsx)

• TourPage is split into TourPage (resolves the tour, guards on !tour) and TourPageBody (does the pipeline resolution and rendering). The split exists so TourPipelineStorageProvider can wrap the body — usePipelineStorage() inside TourPageBody then resolves to the tour storage.
• createTourPipeline is renamed findOrCreateTourPipeline to reflect that browser refresh mid-tour reuses the existing session-storage file (so the tour resumes on the same step with edits intact). Re-entering the tour from the Learn page still starts fresh — FeaturedTours / ToursLibrary call resetAllTourPipelineState before navigating, which wipes session storage and the react-query spec cache.

Pipeline registry orphan fix (src/services/pipelineService.ts)

• Fixes a pre-existing bug surfaced by the storage change: deletePipeline removed the file from its folder driver but didn't delete the corresponding entry from the pipeline registry. The orphaned registry entry caused later "name already exists" errors for tour pipelines whose files had been cleared but whose registry rows lived on. Now both are deleted.

Name-dialog race fix (src/components/shared/Dialogs/PipelineNameDialog.tsx)

• The dialog's error state was computed via a separate setError effect that didn't always settle before the user clicked Submit, occasionally letting through a name that should have been rejected. Rewrote it as a useMemo so the error is always in sync with the current input. Also added excludeNames so a rename-to-self in the regular editor doesn't flag itself as a collision.

Why scoped override rather than a flag

Threading a isTour: true flag through every storage call would have leaked tour-awareness into a layer that doesn't need it. The provider override is opaque to consumers — same usePipelineStorage(), same PipelineFile shape, different backing store.

Related Issue and Pull requests

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

Type of Change

• Improvement
• Bug fix

Checklist

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

Test Instructions

Pre-req: at least one registered tour exists (so use this branch with #2306 / #2312 on top, or open a Storybook-style local entry).

Ephemerality

• Start a tour. Open DevTools → Application → Local Storage / IndexedDB. The tour pipeline should be in Session Storage, not IndexedDB. The pipelines list on the dashboard should not show it.
• Make an edit to the tour pipeline (e.g. drag a node).
• Refresh the browser tab. The tour resumes on the same step (URL ?step=N) and the edit you made is still there (session storage survives same-tab refresh, as intended).
• Close the tab, open a new one, return to the tour. The tour pipeline is gone — start fresh.

Name-collision regression

• In the regular editor, rename a pipeline to its current name (no change). The dialog should not flag it as "Name already exists" (this used to fail).
• Start a tour, then start the same tour again from /learn/tours. No "Name already exists" error — resetAllTourPipelineState clears the prior run.

Registry orphan regression

• Create a regular pipeline, delete it, then create a new pipeline with the same name. Should succeed (previously, the stale registry row blocked re-use of the name).

Regression

• Normal pipeline create / edit / autosave / delete still work end-to-end (no tour involved).

[github-actions]

🎩 Preview

A preview build has been created at: 05-27-fix_guided_tours_ephemeral_state/5f3b904

[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 , #2347 )
• feat: Guided Tours Framework (Navigating the Editor) #2299
• feat: Guided Tours End Screen #2339
• feat: Guided Tours Ephemeral Pipelines #2334 👈 (View in Graphite)
• feat: Guided Tours Custom Navigation #2340
• feat: Guided Tours Foundation #2348
• feat: Learning Hub Guided Tours #2297
• feat: Learning Hub - Milestone 1 #2341
• 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.

[maxy-shpfy]

🤖 This is an AI-generated code review comment.

Wrapping the entire tour editor in TourPipelineStorageProvider makes every existing File menu action use the new session-storage-backed service. Actions such as File → Save as and File → New pipeline create a sessionStorage-only PipelineFile and then navigate to APP_ROUTES.EDITOR_V2_PIPELINE. That route is outside this provider and resolves fileId through the normal IndexedDB-backed PipelineStorageProvider, where the session-only id has no registry entry, so the editor opens on a not-found/error path after showing a successful action.

Suggestion: Either hide/disable the normal File menu actions that leave tour mode while a tour is active, or route those actions through an explicit promotion path that writes to the normal pipeline storage before navigating (the same separation used for tour completion save/explore). Add a guard so session-storage ids are never passed to the normal editor route.

Rule: Tangle UI review checklist: General quality — proper error handling and holistic architecture; changed code must not introduce broken user flows.

[maxy-shpfy]

🤖 This is an AI-generated code review comment.

The dialog now removes excludeNames from the duplicate-name set using trimmed/lowercased values, but the rename callers still disable submit with raw equality checks such as name === pipelineNameFromSpec. Entering the current name with leading/trailing whitespace avoids the duplicate error, is not disabled, then handleSubmit trims it back to the existing name and the underlying rename path throws because that file already exists.

Suggestion: Normalize once inside PipelineNameDialog and pass the trimmed name into isSubmitDisabled, or make the callers compare name.trim().toLowerCase() against the excluded/current name. Keep the duplicate guard and submit-disabled logic aligned on the same normalized value.

Rule: Tangle UI review checklist: TypeScript/General quality — prefer type-safe validation over downstream runtime errors; user-facing dialogs should prevent invalid submissions before invoking storage mutations.