Next.js Supabase V3 (#463)

Version 3 of the kit:
- Radix UI replaced with Base UI (using the Shadcn UI patterns)
- next-intl replaces react-i18next
- enhanceAction deprecated; usage moved to next-safe-action
- main layout now wrapped with [locale] path segment
- Teams only mode
- Layout updates
- Zod v4
- Next.js 16.2
- Typescript 6
- All other dependencies updated
- Removed deprecated Edge CSRF
- Dynamic Github Action runner

apps/web/components/root-providers.tsx

@@ -1,12 +1,12 @@
 'use client';
 
-import { useMemo } from 'react';
-
+import type { AbstractIntlMessages } from 'next-intl';
 import { ThemeProvider } from 'next-themes';
 
-import { I18nProvider } from '@kit/i18n/provider';
+import { I18nClientProvider } from '@kit/i18n/provider';
 import { MonitoringProvider } from '@kit/monitoring/components';
 import { AppEventsProvider } from '@kit/shared/events';
+import { CSPProvider } from '@kit/ui/csp-provider';
 import { If } from '@kit/ui/if';
 import { VersionUpdater } from '@kit/ui/version-updater';
 
@@ -14,52 +14,52 @@ import { AnalyticsProvider } from '~/components/analytics-provider';
 import { AuthProvider } from '~/components/auth-provider';
 import appConfig from '~/config/app.config';
 import featuresFlagConfig from '~/config/feature-flags.config';
-import { i18nResolver } from '~/lib/i18n/i18n.resolver';
-import { getI18nSettings } from '~/lib/i18n/i18n.settings';
 
 import { ReactQueryProvider } from './react-query-provider';
 
 type RootProvidersProps = React.PropsWithChildren<{
   // The language to use for the app (optional)
-  lang?: string;
+  locale?: string;
   // The theme (light or dark or system) (optional)
   theme?: string;
   // The CSP nonce to pass to scripts (optional)
   nonce?: string;
+  messages: AbstractIntlMessages;
 }>;
 
 export function RootProviders({
-  lang,
+  locale = 'en',
+  messages,
   theme = appConfig.theme,
   nonce,
   children,
 }: RootProvidersProps) {
-  const i18nSettings = useMemo(() => getI18nSettings(lang), [lang]);
-
   return (
     <MonitoringProvider>
       <AppEventsProvider>
         <AnalyticsProvider>
-          <ReactQueryProvider>
-            <I18nProvider settings={i18nSettings} resolver={i18nResolver}>
-              <AuthProvider>
-                <ThemeProvider
-                  attribute="class"
-                  enableSystem
-                  disableTransitionOnChange
-                  defaultTheme={theme}
-                  enableColorScheme={false}
-                  nonce={nonce}
-                >
-                  {children}
-                </ThemeProvider>
-              </AuthProvider>
+          <CSPProvider nonce={nonce}>
+            <ReactQueryProvider>
+              <I18nClientProvider locale={locale!} messages={messages}>
+                <AuthProvider>
+                  <ThemeProvider
+                    attribute="class"
+                    enableSystem
+                    disableTransitionOnChange
+                    defaultTheme={theme}
+                    enableColorScheme={false}
+                    nonce={nonce}
+                  >
+                    {children}
+                  </ThemeProvider>
+                </AuthProvider>
 
-              <If condition={featuresFlagConfig.enableVersionUpdater}>
-                <VersionUpdater />
-              </If>
-            </I18nProvider>
-          </ReactQueryProvider>
+                <If condition={featuresFlagConfig.enableVersionUpdater}>
+                  <VersionUpdater />
+                </If>
+              </I18nClientProvider>
+            </ReactQueryProvider>
+          </CSPProvider>
         </AnalyticsProvider>
       </AppEventsProvider>
     </MonitoringProvider>