@shopify/hydrogen 2026.4.3 → 2026.4.5

package/dist/development/index.js

@@ -437,7 +437,7 @@ function getPrivacyBanner() {
 }
 
 // package.json
-var version = "2026.4.3";
+var version = "2026.4.5";
 
 // src/analytics-manager/ShopifyAnalytics.tsx
 function getCustomerPrivacyRequired() {
@@ -846,7 +846,7 @@ function PerfKit({ shop }) {
       "data-storefront-id": shop.hydrogenSubchannelId,
       "data-monorail-region": "global",
       "data-spa-mode": "true",
-      "data-resource-timing-sampling-rate": "100"
+      "data-resource-timing-sampling-rate": "10"
     }
   });
   useEffect(() => {
@@ -1833,7 +1833,7 @@ function generateUUID() {
 }
 
 // src/version.ts
-var LIB_VERSION = "2026.4.3";
+var LIB_VERSION = "2026.4.5";
 
 // src/utils/graphql.ts
 function minifyQuery(string) {
@@ -3604,11 +3604,13 @@ async function refreshToken({
   const customerAccount = session.get(CUSTOMER_ACCOUNT_SESSION_KEY);
   const refreshToken2 = customerAccount?.refreshToken;
   const idToken = customerAccount?.idToken;
-  if (!refreshToken2)
+  if (!refreshToken2) {
+    clearSession(session);
     throw new BadRequest(
       "Unauthorized",
       "No refreshToken found in the session. Make sure your session is configured correctly and passed to `createCustomerAccountClient`."
     );
+  }
   newBody.append("grant_type", "refresh_token");
   newBody.append("refresh_token", refreshToken2);
   newBody.append("client_id", customerAccountId);
@@ -3633,6 +3635,9 @@ async function refreshToken({
   });
   if (!response.ok) {
     const text = await response.text();
+    if (getOAuthError(text) === "invalid_grant") {
+      clearSession(session);
+    }
     throw new Response(text, {
       status: response.status,
       headers: {
@@ -3643,9 +3648,13 @@ async function refreshToken({
   const {
     access_token,
     expires_in,
-    refresh_token
+    refresh_token,
+    error
   } = await response.json();
   if (!access_token || access_token.length === 0) {
+    if (error === "invalid_grant") {
+      clearSession(session);
+    }
     throw new BadRequest("Unauthorized", "Invalid access token received.");
   }
   session.set(CUSTOMER_ACCOUNT_SESSION_KEY, {
@@ -3682,7 +3691,6 @@ async function checkExpires({
       await locks.refresh;
       delete locks.refresh;
     } catch (error) {
-      clearSession(session);
       if (error && error.status !== 401) {
         throw error;
       } else {
@@ -3694,6 +3702,14 @@ async function checkExpires({
     }
   }
 }
+function getOAuthError(body) {
+  try {
+    const data = JSON.parse(body);
+    return typeof data?.error === "string" ? data.error : void 0;
+  } catch {
+    return void 0;
+  }
+}
 function generateCodeVerifier() {
   const rando = generateRandomCode();
   return base64UrlEncode(rando);
@@ -3721,9 +3737,7 @@ function convertBufferToString(hash) {
   return String.fromCharCode(...numberArray);
 }
 function generateState() {
-  const timestamp = Date.now().toString();
-  const randomString = Math.random().toString(36).substring(2);
-  return timestamp + randomString;
+  return base64UrlEncode(generateRandomCode());
 }
 async function exchangeAccessToken(authAccessToken, customerAccountId, customerAccountTokenExchangeUrl, httpsOrigin, debugInfo) {
   const clientId = customerAccountId;
@@ -3877,6 +3891,8 @@ function createCustomerAccountHelper(customerApiVersion, shopId) {
 
 // src/customer/customer.ts
 var HYDROGEN_TUNNEL_DOMAIN_SUFFIX = ".tryhydrogen.dev";
+var OAUTH_RECOVERY_PARAM = "oauth_recovery";
+var OAUTH_RECOVERY_STATE_PREFIX = "oauth-recovery.";
 function checkTunnelDomain(hostname, useCustomAuthDomain, redirectUri) {
   if (hostname.endsWith(HYDROGEN_TUNNEL_DOMAIN_SUFFIX)) return;
   if (useCustomAuthDomain) {
@@ -4108,7 +4124,8 @@ function createCustomerAccountClient({
       ensureTunnel(requestUrl.hostname);
       ifInvalidCredentialThrowError();
       const loginUrl = new URL(getCustomerAccountUrl("AUTH" /* AUTH */));
-      const state = generateState();
+      const isOAuthRecovery = requestUrl.searchParams.get(OAUTH_RECOVERY_PARAM) === "true";
+      const state = `${isOAuthRecovery ? OAUTH_RECOVERY_STATE_PREFIX : ""}${generateState()}`;
       const nonce = generateNonce();
       loginUrl.searchParams.set("client_id", customerAccountId);
       loginUrl.searchParams.set("scope", "openid email");
@@ -4197,17 +4214,30 @@ function createCustomerAccountClient({
       const code = requestUrl.searchParams.get("code");
       const state = requestUrl.searchParams.get("state");
       if (!code || !state) {
-        clearSession(session);
         throw new BadRequest(
           "Unauthorized",
           "No code or state parameter found in the redirect URL."
         );
       }
-      if (session.get(CUSTOMER_ACCOUNT_SESSION_KEY)?.state !== state) {
-        clearSession(session);
-        throw new BadRequest(
-          "Unauthorized",
-          "The session state does not match the state parameter. Make sure that the session is configured correctly and passed to `createCustomerAccountClient`."
+      const customerAccountSession = session.get(CUSTOMER_ACCOUNT_SESSION_KEY);
+      if (customerAccountSession?.state !== state) {
+        if (state.startsWith(OAUTH_RECOVERY_STATE_PREFIX)) {
+          throw new BadRequest(
+            "Unable to complete sign in. Please try again.",
+            "The session state does not match the state parameter. Make sure that the session is configured correctly and passed to `createCustomerAccountClient`."
+          );
+        }
+        warnOnce(
+          "[h2:warn:customerAccount] OAuth callback state mismatch. Restarting customer login once."
+        );
+        const recoveryLoginUrl = new URL(loginPath, request.url);
+        recoveryLoginUrl.searchParams.set(
+          "return_to",
+          customerAccountSession?.redirectPath ?? defaultRedirectPath
+        );
+        recoveryLoginUrl.searchParams.set(OAUTH_RECOVERY_PARAM, "true");
+        return redirect(
+          `${recoveryLoginUrl.pathname}${recoveryLoginUrl.search}`
         );
       }
       const clientId = customerAccountId;