Links prefetching (#225)

1. Marketing Layout: speed up rendering by retrieving user session from cookies instead of using server side request 2. Use "redirecting" state when signing in to keep displaying a loading state while Next.js redirects to home page 3. Use "useCallback" to prevent double tracking when switching pages 4. Add links pre-fetching in marketing navigation 5. Add new pending state to MFA verification form 6. Pre-fetch sign-in/sign-up pages 7. Fix i18n when using regional languages 8. currency formatter should default to the region if it exists 9. Update packages
2025-03-31 10:06:37 +07:00
parent 7c4dd23e5d
commit 7a1903d0c2
35 changed files with 1685 additions and 1667 deletions
--- a/apps/dev-tool/package.json
+++ b/apps/dev-tool/package.json
@@ -9,12 +9,12 @@
  },
  "dependencies": {
    "@hookform/resolvers": "^4.1.3",
-    "@tanstack/react-query": "5.69.2",
-    "lucide-react": "^0.484.0",
+    "@tanstack/react-query": "5.70.0",
+    "lucide-react": "^0.485.0",
    "next": "15.2.4",
    "nodemailer": "^6.10.0",
-    "react": "19.0.0",
-    "react-dom": "19.0.0"
+    "react": "19.1.0",
+    "react-dom": "19.1.0"
  },
  "devDependencies": {
    "@kit/email-templates": "workspace:*",
@@ -29,7 +29,7 @@
    "@types/react-dom": "19.0.4",
    "babel-plugin-react-compiler": "19.0.0-beta-e1e972c-20250221",
    "pino-pretty": "^13.0.0",
-    "react-hook-form": "^7.54.2",
+    "react-hook-form": "^7.55.0",
    "tailwindcss": "4.0.17",
    "tailwindcss-animate": "^1.0.7",
    "typescript": "^5.8.2",
--- a/apps/web/app/(marketing)/_components/site-header-account-section.tsx
+++ b/apps/web/app/(marketing)/_components/site-header-account-section.tsx
@@ -3,11 +3,11 @@
 import dynamic from 'next/dynamic';
 import Link from 'next/link';

-import type { User } from '@supabase/supabase-js';
+import { useQuery } from '@tanstack/react-query';

 import { PersonalAccountDropdown } from '@kit/accounts/personal-account-dropdown';
 import { useSignOut } from '@kit/supabase/hooks/use-sign-out';
-import { useUser } from '@kit/supabase/hooks/use-user';
+import { useSupabase } from '@kit/supabase/hooks/use-supabase';
 import { Button } from '@kit/ui/button';
 import { If } from '@kit/ui/if';
 import { Trans } from '@kit/ui/trans';
@@ -29,30 +29,17 @@ const features = {
  enableThemeToggle: featuresFlagConfig.enableThemeToggle,
 };

-export function SiteHeaderAccountSection({
-  user,
-}: React.PropsWithChildren<{
-  user: User | null;
-}>) {
-  if (!user) {
-    return <AuthButtons />;
-  }
-
-  return <SuspendedPersonalAccountDropdown user={user} />;
-}
-
-function SuspendedPersonalAccountDropdown(props: { user: User | null }) {
+export function SiteHeaderAccountSection() {
+  const session = useSession();
  const signOut = useSignOut();
-  const user = useUser(props.user);
-  const userData = user.data ?? props.user ?? null;

-  if (userData) {
+  if (session.data) {
    return (
      <PersonalAccountDropdown
        showProfileName={false}
        paths={paths}
        features={features}
-        user={userData}
+        user={session.data.user}
        signOutRequested={() => signOut.mutateAsync()}
      />
    );
@@ -63,7 +50,7 @@ function SuspendedPersonalAccountDropdown(props: { user: User | null }) {

 function AuthButtons() {
  return (
-    <div className={'flex gap-x-2.5'}>
+    <div className={'flex gap-x-2.5 animate-in fade-in duration-500'}>
      <div className={'hidden md:flex'}>
        <If condition={features.enableThemeToggle}>
          <ModeToggle />
@@ -86,3 +73,16 @@ function AuthButtons() {
    </div>
  );
 }
+
+function useSession() {
+  const client = useSupabase();
+
+  return useQuery({
+    queryKey: ['session'],
+    queryFn: async () => {
+      const { data } = await client.auth.getSession();
+
+      return data.session;
+    },
+  });
+}
--- a/apps/web/app/(marketing)/_components/site-header.tsx
+++ b/apps/web/app/(marketing)/_components/site-header.tsx
@@ -1,5 +1,3 @@
-import type { User } from '@supabase/supabase-js';
-
 import { Header } from '@kit/ui/marketing';

 import { AppLogo } from '~/components/app-logo';
@@ -7,12 +5,12 @@ import { AppLogo } from '~/components/app-logo';
 import { SiteHeaderAccountSection } from './site-header-account-section';
 import { SiteNavigation } from './site-navigation';

-export function SiteHeader(props: { user?: User | null }) {
+export function SiteHeader() {
  return (
    <Header
      logo={<AppLogo />}
      navigation={<SiteNavigation />}
-      actions={<SiteHeaderAccountSection user={props.user ?? null} />}
+      actions={<SiteHeaderAccountSection />}
    />
  );
 }
--- a/apps/web/app/(marketing)/_components/site-navigation-item.tsx
+++ b/apps/web/app/(marketing)/_components/site-navigation-item.tsx
@@ -29,7 +29,7 @@ export function SiteNavigationItem({

  return (
    <NavigationMenuItem key={path}>
-      <Link className={className} href={path}>
+      <Link className={className} href={path} as={path} prefetch={true}>
        {children}
      </Link>
    </NavigationMenuItem>
--- a/apps/web/app/(marketing)/layout.tsx
+++ b/apps/web/app/(marketing)/layout.tsx
@@ -1,19 +1,11 @@
-import { getSupabaseServerClient } from '@kit/supabase/server-client';
-
 import { SiteFooter } from '~/(marketing)/_components/site-footer';
 import { SiteHeader } from '~/(marketing)/_components/site-header';
 import { withI18n } from '~/lib/i18n/with-i18n';

-async function SiteLayout(props: React.PropsWithChildren) {
-  const client = getSupabaseServerClient();
-
-  const {
-    data: { user },
-  } = await client.auth.getUser();
-
+function SiteLayout(props: React.PropsWithChildren) {
  return (
    <div className={'flex min-h-[100vh] flex-col'}>
-      <SiteHeader user={user} />
+      <SiteHeader />

      {props.children}

@@ -22,4 +14,4 @@ async function SiteLayout(props: React.PropsWithChildren) {
  );
 }

-export default withI18n(SiteLayout);
+export default withI18n(SiteLayout);
--- a/apps/web/app/auth/sign-in/page.tsx
+++ b/apps/web/app/auth/sign-in/page.tsx
@@ -58,7 +58,7 @@ async function SignInPage({ searchParams }: SignInPageProps) {

      <div className={'flex justify-center'}>
        <Button asChild variant={'link'} size={'sm'}>
-          <Link href={signUpPath}>
+          <Link href={signUpPath} prefetch={true}>
            <Trans i18nKey={'auth:doNotHaveAccountYet'} />
          </Link>
        </Button>
--- a/apps/web/app/auth/sign-up/page.tsx
+++ b/apps/web/app/auth/sign-up/page.tsx
@@ -57,7 +57,7 @@ async function SignUpPage({ searchParams }: Props) {

      <div className={'flex justify-center'}>
        <Button asChild variant={'link'} size={'sm'}>
-          <Link href={signInPath}>
+          <Link href={signInPath} prefetch={true}>
            <Trans i18nKey={'auth:alreadyHaveAnAccount'} />
          </Link>
        </Button>
--- a/apps/web/app/not-found.tsx
+++ b/apps/web/app/not-found.tsx
@@ -2,7 +2,6 @@ import Link from 'next/link';

 import { ArrowLeft } from 'lucide-react';

-import { getSupabaseServerClient } from '@kit/supabase/server-client';
 import { Button } from '@kit/ui/button';
 import { Heading } from '@kit/ui/heading';
 import { Trans } from '@kit/ui/trans';
@@ -21,15 +20,9 @@ export const generateMetadata = async () => {
 };

 const NotFoundPage = async () => {
-  const client = getSupabaseServerClient();
-
-  const {
-    data: { user },
-  } = await client.auth.getUser();
-
  return (
    <div className={'flex h-screen flex-1 flex-col'}>
-      <SiteHeader user={user} />
+      <SiteHeader />

      <div
        className={
--- a/apps/web/components/analytics-provider.tsx
+++ b/apps/web/components/analytics-provider.tsx
@@ -1,6 +1,6 @@
 'use client';

-import { useEffect } from 'react';
+import { useCallback, useEffect } from 'react';

 import { usePathname, useSearchParams } from 'next/navigation';

@@ -71,7 +71,7 @@ function AnalyticsProviderBrowser(props: React.PropsWithChildren) {
  useAnalyticsMapping(analyticsMapping);

  // Report page views to the analytics service
-  useReportPageView((url) => analytics.trackPageView(url));
+  useReportPageView(useCallback((url) => analytics.trackPageView(url), []));

  // Render children
  return props.children;
--- a/apps/web/components/app-logo.tsx
+++ b/apps/web/components/app-logo.tsx
@@ -40,7 +40,7 @@ export function AppLogo({
  }

  return (
-    <Link aria-label={label ?? 'Home Page'} href={href ?? '/'}>
+    <Link aria-label={label ?? 'Home Page'} href={href ?? '/'} prefetch={true}>
      <LogoImage className={className} />
    </Link>
  );
--- a/apps/web/package.json
+++ b/apps/web/package.json
@@ -55,16 +55,16 @@
    "@marsidev/react-turnstile": "^1.1.0",
    "@radix-ui/react-icons": "^1.3.2",
    "@supabase/supabase-js": "2.49.3",
-    "@tanstack/react-query": "5.69.2",
+    "@tanstack/react-query": "5.70.0",
    "@tanstack/react-table": "^8.21.2",
    "date-fns": "^4.1.0",
-    "lucide-react": "^0.484.0",
+    "lucide-react": "^0.485.0",
    "next": "15.2.4",
    "next-sitemap": "^4.2.3",
    "next-themes": "0.4.6",
-    "react": "19.0.0",
-    "react-dom": "19.0.0",
-    "react-hook-form": "^7.54.2",
+    "react": "19.1.0",
+    "react-dom": "19.1.0",
+    "react-hook-form": "^7.55.0",
    "react-i18next": "^15.4.1",
    "recharts": "2.15.1",
    "sonner": "^2.0.2",
--- a/apps/web/public/locales/en/auth.json
+++ b/apps/web/public/locales/en/auth.json
@@ -69,6 +69,7 @@
  "termsOfService": "Terms of Service",
  "privacyPolicy": "Privacy Policy",
  "orContinueWith": "Or continue with",
+  "redirecting": "You're in! Please wait...",
  "errors": {
    "Invalid login credentials": "The credentials entered are invalid",
    "User already registered": "This credential is already in use. Please try with another one.",
--- a/packages/billing/gateway/package.json
+++ b/packages/billing/gateway/package.json
@@ -29,10 +29,10 @@
    "@supabase/supabase-js": "2.49.3",
    "@types/react": "19.0.12",
    "date-fns": "^4.1.0",
-    "lucide-react": "^0.484.0",
+    "lucide-react": "^0.485.0",
    "next": "15.2.4",
-    "react": "19.0.0",
-    "react-hook-form": "^7.54.2",
+    "react": "19.1.0",
+    "react-hook-form": "^7.55.0",
    "react-i18next": "^15.4.1",
    "zod": "^3.24.2"
  },
--- a/packages/billing/lemon-squeezy/package.json
+++ b/packages/billing/lemon-squeezy/package.json
@@ -26,7 +26,7 @@
    "@kit/ui": "workspace:*",
    "@types/react": "19.0.12",
    "next": "15.2.4",
-    "react": "19.0.0",
+    "react": "19.1.0",
    "zod": "^3.24.2"
  },
  "typesVersions": {
--- a/packages/billing/stripe/package.json
+++ b/packages/billing/stripe/package.json
@@ -30,7 +30,7 @@
    "@types/react": "19.0.12",
    "date-fns": "^4.1.0",
    "next": "15.2.4",
-    "react": "19.0.0",
+    "react": "19.1.0",
    "zod": "^3.24.2"
  },
  "typesVersions": {
--- a/packages/cms/keystatic/package.json
+++ b/packages/cms/keystatic/package.json
@@ -28,7 +28,7 @@
    "@kit/ui": "workspace:*",
    "@types/node": "^22.13.14",
    "@types/react": "19.0.12",
-    "react": "19.0.0",
+    "react": "19.1.0",
    "zod": "^3.24.2"
  },
  "typesVersions": {
--- a/packages/features/accounts/package.json
+++ b/packages/features/accounts/package.json
@@ -35,15 +35,15 @@
    "@kit/ui": "workspace:*",
    "@radix-ui/react-icons": "^1.3.2",
    "@supabase/supabase-js": "2.49.3",
-    "@tanstack/react-query": "5.69.2",
+    "@tanstack/react-query": "5.70.0",
    "@types/react": "19.0.12",
    "@types/react-dom": "19.0.4",
-    "lucide-react": "^0.484.0",
+    "lucide-react": "^0.485.0",
    "next": "15.2.4",
    "next-themes": "0.4.6",
-    "react": "19.0.0",
-    "react-dom": "19.0.0",
-    "react-hook-form": "^7.54.2",
+    "react": "19.1.0",
+    "react-dom": "19.1.0",
+    "react-hook-form": "^7.55.0",
    "react-i18next": "^15.4.1",
    "sonner": "^2.0.2",
    "zod": "^3.24.2"
--- a/packages/features/admin/package.json
+++ b/packages/features/admin/package.json
@@ -21,14 +21,14 @@
    "@makerkit/data-loader-supabase-core": "^0.0.10",
    "@makerkit/data-loader-supabase-nextjs": "^1.2.5",
    "@supabase/supabase-js": "2.49.3",
-    "@tanstack/react-query": "5.69.2",
+    "@tanstack/react-query": "5.70.0",
    "@tanstack/react-table": "^8.21.2",
    "@types/react": "19.0.12",
-    "lucide-react": "^0.484.0",
+    "lucide-react": "^0.485.0",
    "next": "15.2.4",
-    "react": "19.0.0",
-    "react-dom": "19.0.0",
-    "react-hook-form": "^7.54.2",
+    "react": "19.1.0",
+    "react-dom": "19.1.0",
+    "react-hook-form": "^7.55.0",
    "zod": "^3.24.2"
  },
  "exports": {
--- a/packages/features/auth/package.json
+++ b/packages/features/auth/package.json
@@ -29,11 +29,11 @@
    "@marsidev/react-turnstile": "^1.1.0",
    "@radix-ui/react-icons": "^1.3.2",
    "@supabase/supabase-js": "2.49.3",
-    "@tanstack/react-query": "5.69.2",
+    "@tanstack/react-query": "5.70.0",
    "@types/react": "19.0.12",
-    "lucide-react": "^0.484.0",
+    "lucide-react": "^0.485.0",
    "next": "15.2.4",
-    "react-hook-form": "^7.54.2",
+    "react-hook-form": "^7.55.0",
    "react-i18next": "^15.4.1",
    "sonner": "^2.0.2",
    "zod": "^3.24.2"
--- a/packages/features/auth/src/components/multi-factor-challenge-container.tsx
+++ b/packages/features/auth/src/components/multi-factor-challenge-container.tsx
@@ -2,6 +2,8 @@

 import { useEffect } from 'react';

+import { useRouter } from 'next/navigation';
+
 import { zodResolver } from '@hookform/resolvers/zod';
 import { ExclamationTriangleIcon } from '@radix-ui/react-icons';
 import { useMutation } from '@tanstack/react-query';
@@ -41,9 +43,11 @@ export function MultiFactorChallengeContainer({
    redirectPath: string;
  };
 }>) {
+  const router = useRouter();
+
  const verifyMFAChallenge = useVerifyMFAChallenge({
    onSuccess: () => {
-      window.location.replace(paths.redirectPath);
+      router.replace(paths.redirectPath);
    },
  });

@@ -156,14 +160,29 @@ export function MultiFactorChallengeContainer({
            data-test={'submit-mfa-button'}
            disabled={
              verifyMFAChallenge.isPending ||
+              verifyMFAChallenge.isSuccess ||
              !verificationCodeForm.formState.isValid
            }
          >
-            {verifyMFAChallenge.isPending ? (
-              <Trans i18nKey={'account:verifyingCode'} />
-            ) : (
+            <If condition={verifyMFAChallenge.isPending}>
+              <span className={'animate-in fade-in slide-in-from-bottom-24'}>
+                <Trans i18nKey={'account:verifyingCode'} />
+              </span>
+            </If>
+
+            <If condition={verifyMFAChallenge.isSuccess}>
+              <span className={'animate-in fade-in slide-in-from-bottom-24'}>
+                <Trans i18nKey={'auth:redirecting'} />
+              </span>
+            </If>
+
+            <If
+              condition={
+                !verifyMFAChallenge.isPending && !verifyMFAChallenge.isSuccess
+              }
+            >
              <Trans i18nKey={'account:submitVerificationCode'} />
-            )}
+            </If>
          </Button>
        </div>
      </form>
@@ -231,7 +250,7 @@ function FactorsListContainer({
      <div className={'flex flex-col items-center space-y-4 py-8'}>
        <Spinner />

-        <div>
+        <div className={'text-sm'}>
          <Trans i18nKey={'account:loadingFactors'} />
        </div>
      </div>
@@ -259,7 +278,7 @@ function FactorsListContainer({
  const verifiedFactors = factors?.totp ?? [];

  return (
-    <div className={'flex flex-col space-y-4'}>
+    <div className={'flex flex-col space-y-4 animate-in fade-in duration-500'}>
      <div>
        <span className={'font-medium'}>
          <Trans i18nKey={'account:selectFactor'} />
--- a/packages/features/auth/src/components/password-sign-in-container.tsx
+++ b/packages/features/auth/src/components/password-sign-in-container.tsx
@@ -19,6 +19,7 @@ export function PasswordSignInContainer({
  const { captchaToken, resetCaptchaToken } = useCaptchaToken();
  const signInMutation = useSignInWithEmailPassword();
  const isLoading = signInMutation.isPending;
+  const isRedirecting = signInMutation.isSuccess;

  const onSubmit = useCallback(
    async (credentials: z.infer<typeof PasswordSignInSchema>) => {
@@ -46,7 +47,11 @@ export function PasswordSignInContainer({
    <>
      <AuthErrorAlert error={signInMutation.error} />

-      <PasswordSignInForm onSubmit={onSubmit} loading={isLoading} />
+      <PasswordSignInForm
+        onSubmit={onSubmit}
+        loading={isLoading}
+        redirecting={isRedirecting}
+      />
    </>
  );
 }
--- a/packages/features/auth/src/components/password-sign-in-form.tsx
+++ b/packages/features/auth/src/components/password-sign-in-form.tsx
@@ -25,10 +25,12 @@ import { PasswordSignInSchema } from '../schemas/password-sign-in.schema';

 export function PasswordSignInForm({
  onSubmit,
-  loading,
+  loading = false,
+  redirecting = false,
 }: {
  onSubmit: (params: z.infer<typeof PasswordSignInSchema>) => unknown;
  loading: boolean;
+  redirecting: boolean;
 }) {
  const { t } = useTranslation('auth');

@@ -112,23 +114,30 @@ export function PasswordSignInForm({
          data-test="auth-submit-button"
          className={'group w-full'}
          type="submit"
-          disabled={loading}
+          disabled={loading || redirecting}
        >
-          <If
-            condition={loading}
-            fallback={
-              <>
-                <Trans i18nKey={'auth:signInWithEmail'} />
+          <If condition={redirecting}>
+            <span className={'animate-in fade-in slide-in-from-bottom-24'}>
+              <Trans i18nKey={'auth:redirecting'} />
+            </span>
+          </If>

-                <ArrowRight
-                  className={
-                    'zoom-in animate-in slide-in-from-left-2 fill-mode-both h-4 delay-500 duration-500'
-                  }
-                />
-              </>
-            }
-          >
-            <Trans i18nKey={'auth:signingIn'} />
+          <If condition={loading}>
+            <span className={'animate-in fade-in slide-in-from-bottom-24'}>
+              <Trans i18nKey={'auth:signingIn'} />
+            </span>
+          </If>
+
+          <If condition={!redirecting && !loading}>
+            <span className={'animate-out fade-out flex items-center'}>
+              <Trans i18nKey={'auth:signInWithEmail'} />
+
+              <ArrowRight
+                className={
+                  'zoom-in animate-in slide-in-from-left-2 fill-mode-both h-4 delay-500 duration-500'
+                }
+              />
+            </span>
          </If>
        </Button>
      </form>
--- a/packages/features/notifications/package.json
+++ b/packages/features/notifications/package.json
@@ -20,11 +20,11 @@
    "@kit/tsconfig": "workspace:*",
    "@kit/ui": "workspace:*",
    "@supabase/supabase-js": "2.49.3",
-    "@tanstack/react-query": "5.69.2",
+    "@tanstack/react-query": "5.70.0",
    "@types/react": "19.0.12",
-    "lucide-react": "^0.484.0",
-    "react": "19.0.0",
-    "react-dom": "19.0.0",
+    "lucide-react": "^0.485.0",
+    "react": "19.1.0",
+    "react-dom": "19.1.0",
    "react-i18next": "^15.4.1"
  },
  "prettier": "@kit/prettier-config",
--- a/packages/features/team-accounts/package.json
+++ b/packages/features/team-accounts/package.json
@@ -33,17 +33,17 @@
    "@kit/tsconfig": "workspace:*",
    "@kit/ui": "workspace:*",
    "@supabase/supabase-js": "2.49.3",
-    "@tanstack/react-query": "5.69.2",
+    "@tanstack/react-query": "5.70.0",
    "@tanstack/react-table": "^8.21.2",
    "@types/react": "19.0.12",
    "@types/react-dom": "19.0.4",
    "class-variance-authority": "^0.7.1",
    "date-fns": "^4.1.0",
-    "lucide-react": "^0.484.0",
+    "lucide-react": "^0.485.0",
    "next": "15.2.4",
-    "react": "19.0.0",
-    "react-dom": "19.0.0",
-    "react-hook-form": "^7.54.2",
+    "react": "19.1.0",
+    "react-dom": "19.1.0",
+    "react-hook-form": "^7.55.0",
    "react-i18next": "^15.4.1",
    "sonner": "^2.0.2",
    "zod": "^3.24.2"
--- a/packages/i18n/package.json
+++ b/packages/i18n/package.json
@@ -20,10 +20,10 @@
    "@kit/prettier-config": "workspace:*",
    "@kit/shared": "workspace:*",
    "@kit/tsconfig": "workspace:*",
-    "@tanstack/react-query": "5.69.2",
+    "@tanstack/react-query": "5.70.0",
    "next": "15.2.4",
-    "react": "19.0.0",
-    "react-dom": "19.0.0",
+    "react": "19.1.0",
+    "react-dom": "19.1.0",
    "react-i18next": "^15.4.1"
  },
  "dependencies": {
--- a/packages/i18n/src/create-i18n-settings.ts
+++ b/packages/i18n/src/create-i18n-settings.ts
@@ -23,7 +23,6 @@ export function createI18nSettings({
    fallbackLng: languages[0],
    detection: undefined,
    lng,
-    load: 'languageOnly' as const,
    preload: false as const,
    lowerCaseLng: true as const,
    fallbackNS: ns,
--- a/packages/monitoring/api/package.json
+++ b/packages/monitoring/api/package.json
@@ -25,7 +25,7 @@
    "@kit/shared": "workspace:*",
    "@kit/tsconfig": "workspace:*",
    "@types/react": "19.0.12",
-    "react": "19.0.0",
+    "react": "19.1.0",
    "zod": "^3.24.2"
  },
  "typesVersions": {
--- a/packages/monitoring/baselime/package.json
+++ b/packages/monitoring/baselime/package.json
@@ -25,7 +25,7 @@
    "@kit/prettier-config": "workspace:*",
    "@kit/tsconfig": "workspace:*",
    "@types/react": "19.0.12",
-    "react": "19.0.0",
+    "react": "19.1.0",
    "zod": "^3.24.2"
  },
  "typesVersions": {
--- a/packages/monitoring/core/package.json
+++ b/packages/monitoring/core/package.json
@@ -18,7 +18,7 @@
    "@kit/prettier-config": "workspace:*",
    "@kit/tsconfig": "workspace:*",
    "@types/react": "19.0.12",
-    "react": "19.0.0"
+    "react": "19.1.0"
  },
  "typesVersions": {
    "*": {
--- a/packages/monitoring/sentry/package.json
+++ b/packages/monitoring/sentry/package.json
@@ -16,7 +16,7 @@
    "./config/server": "./src/sentry.client.server.ts"
  },
  "dependencies": {
-    "@sentry/nextjs": "^9.10.0",
+    "@sentry/nextjs": "^9.10.1",
    "import-in-the-middle": "1.13.1"
  },
  "devDependencies": {
@@ -25,7 +25,7 @@
    "@kit/prettier-config": "workspace:*",
    "@kit/tsconfig": "workspace:*",
    "@types/react": "19.0.12",
-    "react": "19.0.0"
+    "react": "19.1.0"
  },
  "typesVersions": {
    "*": {
--- a/packages/otp/package.json
+++ b/packages/otp/package.json
@@ -28,9 +28,9 @@
    "@supabase/supabase-js": "2.49.3",
    "@types/react": "19.0.12",
    "@types/react-dom": "19.0.4",
-    "react": "19.0.0",
-    "react-dom": "19.0.0",
-    "react-hook-form": "^7.54.2",
+    "react": "19.1.0",
+    "react-dom": "19.1.0",
+    "react-hook-form": "^7.55.0",
    "zod": "^3.24.2"
  },
  "typesVersions": {
--- a/packages/shared/src/utils.ts
+++ b/packages/shared/src/utils.ts
@@ -14,7 +14,9 @@ export function formatCurrency(params: {
  locale: string;
  value: string | number;
 }) {
-  return new Intl.NumberFormat(params.locale, {
+  const [lang, region] = params.locale.split('-');
+
+  return new Intl.NumberFormat(region ?? lang, {
    style: 'currency',
    currency: params.currencyCode,
  }).format(Number(params.value));
--- a/packages/supabase/package.json
+++ b/packages/supabase/package.json
@@ -29,10 +29,10 @@
    "@kit/tsconfig": "workspace:*",
    "@supabase/ssr": "^0.6.1",
    "@supabase/supabase-js": "2.49.3",
-    "@tanstack/react-query": "5.69.2",
+    "@tanstack/react-query": "5.70.0",
    "@types/react": "19.0.12",
    "next": "15.2.4",
-    "react": "19.0.0",
+    "react": "19.1.0",
    "server-only": "^0.0.1",
    "zod": "^3.24.2"
  },
--- a/packages/ui/package.json
+++ b/packages/ui/package.json
@@ -33,7 +33,7 @@
    "clsx": "^2.1.1",
    "cmdk": "1.1.1",
    "input-otp": "1.4.2",
-    "lucide-react": "^0.484.0",
+    "lucide-react": "^0.485.0",
    "react-top-loading-bar": "3.0.2",
    "recharts": "2.15.1",
    "tailwind-merge": "^3.0.2"
@@ -43,7 +43,7 @@
    "@kit/prettier-config": "workspace:*",
    "@kit/tsconfig": "workspace:*",
    "@radix-ui/react-icons": "^1.3.2",
-    "@tanstack/react-query": "5.69.2",
+    "@tanstack/react-query": "5.70.0",
    "@tanstack/react-table": "^8.21.2",
    "@types/react": "19.0.12",
    "@types/react-dom": "19.0.4",
@@ -54,7 +54,7 @@
    "next-themes": "0.4.6",
    "prettier": "^3.5.3",
    "react-day-picker": "^8.10.1",
-    "react-hook-form": "^7.54.2",
+    "react-hook-form": "^7.55.0",
    "react-i18next": "^15.4.1",
    "sonner": "^2.0.2",
    "tailwindcss": "4.0.17",
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml