cloudflare-next-intl 0.10.16 → 0.10.18

package/README.md

@@ -409,7 +409,7 @@ export default async function RootLayout({ children, params }) {
     return (
         <html lang={locale}>
             <head>
-                <IntlHelperScript />
+                <IntlHelperScript locale={locale} />
             </head>
             <body>
                 <IntlProvider language={locale}>{children}</IntlProvider>
@@ -512,10 +512,11 @@ Features include:
 - `whiteListPaths`: Array of paths exempt from auth redirects (matches exact path or path-segment prefix, e.g. `/bonds` matches `/bonds/some-slug`).
 - `protectedPaths`: `(path) => boolean` gate that inverts `whiteListPaths` — when set, every path passes through unless `protectedPaths` (or `isAuthPath`) returns true, so unrecognised URLs reach the app's own routing instead of being redirected to `redirectAuthPath`. Preferred over `whiteListPaths` for apps where most pages are public: both the middleware and `AuthUserProvider` (client) derive their whitelist from it directly, so you don't maintain two separate path lists that can drift out of sync. `whiteListPaths` is only consulted when `protectedPaths` isn't set.
 - `actionLinkPath`: Pinned route for handling Firebase action links (e.g. `/auth/action`), prioritized during cross-origin action link redirects.
+- `skipPopupRedirectResolver`: Skips the Auth SDK's default `browserPopupRedirectResolver`, which proactively opens the `<authDomain>/__/auth/iframe.js` relay iframe on every page load on mobile/Safari/iOS user agents. Safe even with Google/Apple/social sign-in — pass `browserPopupRedirectResolver` as the last argument to `signInWithPopup`/`signInWithRedirect`/`getRedirectResult`/`linkWithPopup`/`reauthenticateWithPopup` at the call site instead, so the iframe only loads on the click. Also skips the Auth emulator auto-connect and the experimental `authTokenSyncURL` cookie exchange that `getAuth` does — see the JSDoc on this option before enabling it against an emulator.
 - `createForgotPasswordAction(locale, actionCodeSettings?)`: Accepts optional Firebase `AuthActionCodeSettings` (e.g. `url` redirect link).
 - `sendVerificationEmail(actionCodeSettings?)` on `useAuthUser()`: Custom action email settings when resending email verification.
 - `followSameOriginContinueUrl`: Automatically forwards emailed action links with `continueUrl` to the specified path (or external URL) directly from `intlMiddleware` (default `true`; set `false` on `firebaseAuth` config to disable). If `continueUrl` points to home root (`/`), it resolves to `actionLinkPath` (if set) or the mode target path (e.g. `/reset-password`).
-- `appCheck`: Firebase App Check integration supporting reCAPTCHA Enterprise (`recaptchaEnterpriseSiteKey`) and reCAPTCHA v3 (`recaptchaV3SiteKey`). For reCAPTCHA v3, defaults to a `CustomProvider` using `IntlHelperScript`'s explicit script tag to avoid iframe/webworker CDN integrity issues in private windows (`useExplicitRecaptchaScript: false` to opt out). Supports server-side token minting via service accounts.
+- `appCheck`: Firebase App Check integration supporting reCAPTCHA Enterprise (`recaptchaEnterpriseSiteKey`) and reCAPTCHA v3 (`recaptchaV3SiteKey`). For reCAPTCHA v3, defaults to a `CustomProvider` using an explicit `render=explicit` script tag to avoid iframe/webworker CDN integrity issues in private windows (`useExplicitRecaptchaScript: false` to opt out). Both the script and App Check's own initialization are always deferred to first actual need (the first `getAppCheckToken()`/token mint) rather than run as part of every `getFirebaseAuthClient()` call, so a page that never mints a token never pays reCAPTCHA's ~345KB cost. **Note:** because of that deferral, a request made through `getFirebaseAuthClient()`'s `auth` before anything has called `getAppCheckToken()` (e.g. a sign-in call) goes out without an `X-Firebase-AppCheck` header — only a concern if App Check enforcement is on for Auth/Firestore/Functions. Supports server-side token minting via service accounts.
 - `resolveOptionalAuthUser()` (`cloudflare-next-intl/resolveOptionalAuthUser`): best-effort variant of `getAuthUser()` for callers that want to *attach* the current user when one happens to be known — error/telemetry reporting, analytics, logging — without failing or changing behavior when no request/session context is available. Swallows every failure and resolves `{ user: null }` instead of throwing. Use `getAuthUser()` (not this) whenever your own output actually depends on who's signed in — `checkDynamicPages` (below) treats `getAuthUser()`/`useAuthUser()`/`withUserDb()` as page-blocking dynamic-API signals but does not follow into this helper, so it's also the way to read "whoever's signed in, if anyone" from a page or a module it imports without forcing that page dynamic.
 - `resolveErrorReportingUser(useAuthUser?)` (same subpath): gated form of `resolveOptionalAuthUser()` for an `onError` sink — pass `ErrorHandlingParams.useAuthUser` straight through. Defaults to `false`: when not `true`, resolves `{ user: null }` immediately without calling `getAuthUser()` at all, so a page reached only through your `onError` sink's default path stays static-eligible. A specific `reportError({ ..., useAuthUser: true })` call site opts in per-call when it actually wants the user on that report.
 

package/dist/src/client/components/client_provider.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { setLocaleCache, setMessageForLocaleCache } from "../../general/cache_variables.js";
-import { createContext, useMemo, Suspense } from "react";
+import { createContext, useEffect, useMemo, Suspense } from "react";
 import dynamic from "next/dynamic.js";
 import useLazyWrappingProvider from "./use_lazy_wrapping_provider.js";
 import config from "@intl-config";
@@ -14,7 +14,8 @@ const AutoFirebasePerformanceEvents = dynamic(() => import("../../firebase_auth/
 const loadCookieConsentProvider = () => import("../../cookie_consent/client/cookie_consent_provider.js");
 const CookieConsentAnalytics = dynamic(() => import("../../cookie_consent/client/components/cookie_consent_analytics.js"));
 const AutoAnalyticsEvents = dynamic(() => import("../../cookie_consent/client/components/auto_analytics_events.js"));
-const CookieConsentDialog = dynamic(() => import("../../cookie_consent/client/components/cookie_consent_dialog.js"));
+const loadCookieConsentDialog = () => import("../../cookie_consent/client/components/cookie_consent_dialog.js");
+const CookieConsentDialog = dynamic(loadCookieConsentDialog);
 const PrivacyPolicyUpdateDialog = dynamic(() => import("../../cookie_consent/client/components/privacy_policy_update_dialog.js"));
 export default function LocationzationClientProvider({ language, messages, initialAuthUser = null, skipAuthProvider = false, analyticsConfig, autoAnalyticsEventsConfig, requiresConsent = true, autoWireDialogs = true, dialogProps, updateDialogProps, children }) {
     setLocaleCache(language);
@@ -23,6 +24,11 @@ export default function LocationzationClientProvider({ language, messages, initi
     installGlobalErrorOverride(config);
     const { Provider: AuthUserProvider } = useLazyWrappingProvider(loadAuthUserProvider);
     const { Provider: CookieConsentProvider, isReady: cookieConsentReady } = useLazyWrappingProvider(loadCookieConsentProvider);
+    useEffect(() => {
+        if (!config.cookieConsent || !autoWireDialogs)
+            return;
+        loadCookieConsentDialog().catch(() => undefined);
+    }, [autoWireDialogs]);
     let providedChildren = children;
     if (config.firebaseAuth && !skipAuthProvider) {
         providedChildren = _jsx(AuthUserPendingProvider, { initialUser: initialAuthUser, children: _jsxs(AuthUserProvider, { initialUser: initialAuthUser, children: [children, config.firebaseAuth.performance !== false && (_jsx(Suspense, { fallback: null, children: _jsx(AutoFirebasePerformanceEvents, {}) }))] }) });

package/dist/src/cookie_consent/client/components/clarity_script.js

@@ -10,16 +10,34 @@ function getClarityModule() {
 }
 export default function ClarityScript({ projectId }) {
     useEffect(() => {
-        getClarityModule()
-            .then(({ default: Clarity }) => {
-            Clarity.init(projectId);
-            Clarity.consent();
-        })
-            .catch((error) => void reportError(undefined, {
-            error,
-            classOrMethodName: 'ClarityScript',
-            isClient: true,
-        }));
+        let handle;
+        let timeout;
+        const init = () => {
+            getClarityModule()
+                .then(({ default: Clarity }) => {
+                Clarity.init(projectId);
+                Clarity.consent();
+            })
+                .catch((error) => void reportError(undefined, {
+                error,
+                classOrMethodName: 'ClarityScript',
+                isClient: true,
+            }));
+        };
+        if (typeof window !== 'undefined' && 'requestIdleCallback' in window) {
+            handle = window.requestIdleCallback(init, { timeout: 3000 });
+        }
+        else {
+            timeout = setTimeout(init, 1500);
+        }
+        return () => {
+            if (handle !== undefined && typeof window !== 'undefined' && 'cancelIdleCallback' in window) {
+                window.cancelIdleCallback(handle);
+            }
+            if (timeout !== undefined) {
+                clearTimeout(timeout);
+            }
+        };
     }, [projectId]);
     return null;
 }

package/dist/src/firebase_auth/client/auth_user_provider.js

@@ -15,6 +15,8 @@ import setCookie from '../../client/functions/set_cookie.js';
 import getCookie from '../../client/functions/get_cookie.js';
 import clearSessionAction from '../server/clear_session_action.js';
 import { AuthUserContext } from './auth_user_context.js';
+const AUTH_SUBSCRIBE_IDLE_TIMEOUT_MS = 3000;
+const AUTH_SUBSCRIBE_FALLBACK_DELAY_MS = 1500;
 export { AuthUserContext };
 function writeSessionCookie(sessionCookieName, idToken, maxAge) {
     setCookie({ name: sessionCookieName, value: idToken, maxAge });
@@ -96,6 +98,7 @@ export default function AuthUserProvider({ initialUser = null, children }) {
     const signInCallbackFired = useRef(initialUser !== null);
     const signOutCallbackFired = useRef(initialUser === null);
     const emailVerifiedRef = useRef(initialUser?.emailVerified ?? false);
+    const deferAuthSubscribe = initialUser === null && isWhiteListed && !isAuthPage && typeof window !== 'undefined';
     useEffect(() => {
         const { user, loading } = state;
         if (loading || isWhiteListed)
@@ -114,7 +117,9 @@ export default function AuthUserProvider({ initialUser = null, children }) {
     useEffect(() => {
         let unsubscribe;
         let cancelled = false;
-        getFirebaseAuthClient().then(async ({ auth }) => {
+        let idleHandle;
+        let timeoutHandle;
+        const subscribe = () => getFirebaseAuthClient().then(async ({ auth }) => {
             if (cancelled)
                 return;
             const { onIdTokenChanged } = await getFirebaseAuthModule();
@@ -185,11 +190,28 @@ export default function AuthUserProvider({ initialUser = null, children }) {
                 }
             });
         });
+        if (deferAuthSubscribe) {
+            setState(current => (current.loading ? { ...current, loading: false } : current));
+            const idle = window.requestIdleCallback;
+            if (idle)
+                idleHandle = idle(() => { if (!cancelled)
+                    subscribe(); }, { timeout: AUTH_SUBSCRIBE_IDLE_TIMEOUT_MS });
+            else
+                timeoutHandle = setTimeout(() => { if (!cancelled)
+                    subscribe(); }, AUTH_SUBSCRIBE_FALLBACK_DELAY_MS);
+        }
+        else {
+            subscribe();
+        }
         return () => {
             cancelled = true;
+            if (idleHandle !== undefined)
+                window.cancelIdleCallback?.(idleHandle);
+            if (timeoutHandle !== undefined)
+                clearTimeout(timeoutHandle);
             unsubscribe?.();
         };
-    }, [router, isAuthPage, isWhiteListed, maxAge, sessionCookieName, refreshTokenMaxAge, refreshTokenCookieName, emailVerifiedHintCookieName, appCheckTokenCookieName, appCheckTokenMaxAge, fa]);
+    }, [deferAuthSubscribe, router, isAuthPage, isWhiteListed, maxAge, sessionCookieName, refreshTokenMaxAge, refreshTokenCookieName, emailVerifiedHintCookieName, appCheckTokenCookieName, appCheckTokenMaxAge, fa]);
     const reloadUser = useCallback(async () => {
         const { auth } = await getFirebaseAuthClient();
         const user = auth.currentUser;

package/dist/src/firebase_auth/client/firebase_client.js

@@ -5,9 +5,22 @@ let cachedAppCheck;
 let cachedPerformance;
 const GRECAPTCHA_LOAD_TIMEOUT_MS = 15000;
 const GRECAPTCHA_POLL_INTERVAL_MS = 50;
+const RECAPTCHA_SCRIPT_SRC = 'https://www.google.com/recaptcha/api.js?render=explicit';
+let recaptchaScriptFailed = false;
+function ensureRecaptchaScript() {
+    if (document.querySelector(`script[src="${RECAPTCHA_SCRIPT_SRC}"]`))
+        return;
+    const script = document.createElement('script');
+    script.src = RECAPTCHA_SCRIPT_SRC;
+    script.async = true;
+    script.defer = true;
+    script.onerror = () => { recaptchaScriptFailed = true; };
+    document.head.appendChild(script);
+}
 function waitForGrecaptcha() {
     if (window.grecaptcha)
         return Promise.resolve(window.grecaptcha);
+    ensureRecaptchaScript();
     return new Promise((resolve, reject) => {
         const startedAt = Date.now();
         const timer = setInterval(() => {
@@ -15,9 +28,9 @@ function waitForGrecaptcha() {
                 clearInterval(timer);
                 resolve(window.grecaptcha);
             }
-            else if (Date.now() - startedAt >= GRECAPTCHA_LOAD_TIMEOUT_MS) {
+            else if (recaptchaScriptFailed || Date.now() - startedAt >= GRECAPTCHA_LOAD_TIMEOUT_MS) {
                 clearInterval(timer);
-                reject(new Error('window.grecaptcha never loaded; ensure the reCAPTCHA <script src="https://www.google.com/recaptcha/api.js?render=explicit"> tag is present'));
+                reject(new Error(`window.grecaptcha never loaded; ${RECAPTCHA_SCRIPT_SRC} failed to load or was blocked`));
             }
         }, GRECAPTCHA_POLL_INTERVAL_MS);
     });
@@ -108,7 +121,28 @@ async function initializeFirebaseAppCheck(app, appCheckConfig) {
     });
 }
 const APP_CHECK_TOKEN_TIMEOUT_MS = 10000;
+let appCheckInitPromise;
+async function ensureAppCheck() {
+    if (appCheckInitPromise)
+        return appCheckInitPromise;
+    const appCheckConfig = config.firebaseAuth?.appCheck;
+    if (!appCheckConfig || typeof window === 'undefined')
+        return;
+    const { app } = await getFirebaseAuthClient();
+    if (appCheckInitPromise)
+        return appCheckInitPromise;
+    appCheckInitPromise = (async () => {
+        try {
+            cachedAppCheck = await initializeFirebaseAppCheck(app, appCheckConfig);
+        }
+        catch (error) {
+            console.warn('App Check initialization failed, continuing without it', error);
+        }
+    })();
+    return appCheckInitPromise;
+}
 export async function getAppCheckToken() {
+    await ensureAppCheck().catch(() => undefined);
     if (!cachedAppCheck)
         return undefined;
     const { getToken } = await import('@firebase/app-check');
@@ -137,7 +171,8 @@ export async function getFirebaseAuthClient() {
             import('@firebase/app'),
             import('@firebase/auth'),
             isPerformanceEnabled ? import('@firebase/performance') : Promise.resolve(null),
-        ]).then(async ([{ getApp, getApps, initializeApp }, { getAuth }, perfModule]) => {
+        ]).then(async ([{ getApp, getApps, initializeApp }, authModule, perfModule]) => {
+            const { getAuth, initializeAuth, indexedDBLocalPersistence, browserLocalPersistence, browserSessionPersistence } = authModule;
             const firebaseConfig = {
                 apiKey: fa.apiKey,
                 authDomain: fa.authDomain,
@@ -148,18 +183,21 @@ export async function getFirebaseAuthClient() {
                 measurementId: fa.measurementId,
             };
             const app = getApps().length ? getApp() : initializeApp(firebaseConfig);
-            if (fa.appCheck && typeof window !== 'undefined') {
+            if (perfModule) {
+                cachedPerformance = perfModule.initializePerformance(app, { instrumentationEnabled: false });
+            }
+            let auth;
+            if (fa.skipPopupRedirectResolver) {
                 try {
-                    cachedAppCheck = await initializeFirebaseAppCheck(app, fa.appCheck);
+                    auth = initializeAuth(app, { persistence: [indexedDBLocalPersistence, browserLocalPersistence, browserSessionPersistence] });
                 }
-                catch (error) {
-                    console.warn('App Check initialization failed, continuing without it', error);
+                catch {
+                    auth = getAuth(app);
                 }
             }
-            if (perfModule) {
-                cachedPerformance = perfModule.initializePerformance(app, { instrumentationEnabled: false });
+            else {
+                auth = getAuth(app);
             }
-            const auth = getAuth(app);
             cached = { app, auth };
             return cached;
         });

package/dist/src/server/components/helper_script.d.ts

@@ -1,2 +1,4 @@
 export declare const defaultReloadHtml = "<div style=\"position:fixed;inset:0;background:#ffffff;display:flex;align-items:center;justify-content:center;z-index:9999999;\"><div style=\"width:36px;height:36px;border:3px solid #e5e7eb;border-top-color:#17181b;border-radius:50%;animation:cfni-spin 0.8s linear infinite;\"></div><style>@keyframes cfni-spin{to{transform:rotate(360deg)}}</style></div>";
-export default function HelperScript(): Component | null;
+export default function HelperScript({ locale }: {
+    locale?: string;
+}): Component | null;

package/dist/src/server/components/helper_script.js

@@ -5,13 +5,14 @@ import ClientHelperScript from "../../client/components/client_helper_script.js"
 import { defaultStaleDeployPatterns } from "../../error_handling/is_stale_deploy_error.js";
 const isDev = process.env.NODE_ENV === 'development';
 export const defaultReloadHtml = '<div style="position:fixed;inset:0;background:#ffffff;display:flex;align-items:center;justify-content:center;z-index:9999999;"><div style="width:36px;height:36px;border:3px solid #e5e7eb;border-top-color:#17181b;border-radius:50%;animation:cfni-spin 0.8s linear infinite;"></div><style>@keyframes cfni-spin{to{transform:rotate(360deg)}}</style></div>';
-const appCheck = config.firebaseAuth?.appCheck;
-const shouldLoadExplicitRecaptchaScript = !!appCheck?.recaptchaV3SiteKey && appCheck.useExplicitRecaptchaScript !== false;
 const secureCookieAttribute = isDev ? '+ " Secure;"' : '';
-export default function HelperScript() {
+export default function HelperScript({ locale }) {
     const reloadHtml = config.errorHandling?.staleDeployReloadHtml ?? defaultReloadHtml;
-    return _jsxs(_Fragment, { children: [shouldLoadExplicitRecaptchaScript &&
-                _jsx("script", { src: "https://www.google.com/recaptcha/api.js?render=explicit", async: true, defer: true }), !isDev &&
+    const analytics = config.cookieConsent?.analytics;
+    const hasGoogle = !!(analytics?.googleAnalyticsId || analytics?.googleAdsId || analytics?.googleAdSenseId);
+    const hasClarity = !!analytics?.clarityProjectId;
+    const hasFirebase = !!config.firebaseAuth;
+    return _jsxs(_Fragment, { children: [locale && _jsx("meta", { httpEquiv: "Content-Language", content: locale }), hasGoogle && _jsx("link", { rel: "dns-prefetch", href: "https://www.googletagmanager.com" }), hasClarity && _jsx("link", { rel: "dns-prefetch", href: "https://www.clarity.ms" }), hasClarity && _jsx("link", { rel: "dns-prefetch", href: "https://scripts.clarity.ms" }), hasFirebase && _jsx("link", { rel: "dns-prefetch", href: "https://firebaseinstallations.googleapis.com" }), !isDev &&
                 _jsx("script", { id: "stale-deploy-early-catch", dangerouslySetInnerHTML: {
                         __html: `(function() {
                 try {

package/dist/src/types/types.d.ts

@@ -134,6 +134,7 @@ export interface FirebaseAuthRoutingConfig {
     measurementId?: string;
     performance?: boolean;
     appCheck?: FirebaseAppCheckConfig;
+    skipPopupRedirectResolver?: boolean;
     redirectAuthPath: string;
     homePath: string;
     verifyEmailPath?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cloudflare-next-intl",
-  "version": "0.10.16",
+  "version": "0.10.18",
   "description": "Optimized Next Intl Package Special for App Router and Cloudflare",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",