Skip to content

Modernize React Router template runtime - #3965

Draft
fredericoo wants to merge 3 commits into
previewfrom
fb-rr-template-runtime-foundation
Draft

Modernize React Router template runtime#3965
fredericoo wants to merge 3 commits into
previewfrom
fb-rr-template-runtime-foundation

Conversation

@fredericoo

@fredericoo fredericoo commented Aug 20, 2026

Copy link
Copy Markdown
Contributor

TL;DR: Establishes the current Oxygen and React Router runtime foundation before the discovery and purchase-flow template updates. This follows #3961.

Before

The template mixed legacy context fields with Router Context, did not provide Oxygen cache/waitUntil to the Storefront client, used static shop identity, and had no Customer Account route or persistent account session.

After

Middleware owns the Hydrogen request lifecycle using request-scoped Storefront and Customer Account clients, typed Worker contexts, Oxygen cache, encrypted account sessions, dynamic shop identity, and buyer-safe error handling.

What this changes

  • Wires Worker env, cache, and waitUntil through Router Context.
  • Adds fail-closed real-store configuration with zero-config mock.shop fallback.
  • Adds Customer Account OAuth handlers, encrypted sessions, and /account.
  • Sources the shop name from Storefront API data and uses one static Collections navigation link.
  • Keeps Shopify Scripts, consent, and global analytics identity aligned with the active store.
  • Uses Hydrogen's automatic local HTTPS certificate provisioning for Customer Account development.
  • Updates the template README and Oxygen-template maintainer guidance.

Developer impact

No changeset. This updates the standalone React Router template and repo-local maintainer guidance without changing a published package API.

UX impact

The storefront displays its real shop name, provides a working Account destination, and retains the existing visual system. Customer Accounts remain disabled with setup guidance in mock mode.

Out of scope

  • Collection, search, or predictive-search modernisation.
  • Cart and product-detail modernisation.
  • Visual-system replacement and SEO resource routes.

Risk

  • Middleware response finalisation and request-body handling affect every route.
  • Customer Account OAuth depends on exact HTTPS callback configuration.
  • Real-store identity now fails closed instead of mixing configured credentials with demo defaults.

How to Test

  1. Run pnpm --filter @shopify/hydrogen build.
  2. Run pnpm --filter @shopify/hydrogen-template-react-router dev.
  3. Open /, /collections, /search, /cart, and /account with no .env; confirm mock.shop content renders.
  4. Run pnpm --filter @shopify/hydrogen-template-react-router preview and repeat the route checks.
  5. Configure the real-store and Customer Account values from .env.example, then run npm run https:dev and accept the first-run certificate prompt.
  6. Register the printed callback, JavaScript-origin, and logout values in Shopify admin; verify login and logout.

@fredericoo
fredericoo marked this pull request as ready for review August 21, 2026 11:53
@fredericoo
fredericoo requested a review from a team as a code owner August 21, 2026 11:53
Assisted-By: devx/46c44251-bc51-4b95-afdc-6afd5afa0f89
Assisted-By: devx/9ef896b5-6509-4da0-8c15-a4b7db693ff2
@fredericoo
fredericoo marked this pull request as draft August 21, 2026 13:14
@fredericoo
fredericoo force-pushed the fb-rr-template-runtime-foundation branch from 5909cab to a444250 Compare August 21, 2026 13:27
Assisted-By: devx/9ef896b5-6509-4da0-8c15-a4b7db693ff2
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant