Remove Suspense from root-providers and refine route checks
The Suspense wrapper was removed from root-providers.tsx to simplify code. For the Privacy Path Checking, a property was added to 'AuthRedirectListener' to allow customization of 'privatePathPrefixes', and the prefixes list was moved to the top. Also, explicit constant assertions were added in 'create-i18n-settings.ts' to ensure the types correctness.
This commit is contained in:
@@ -1,7 +1,5 @@
|
||||
'use client';
|
||||
|
||||
import { Suspense } from 'react';
|
||||
|
||||
import dynamic from 'next/dynamic';
|
||||
|
||||
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
|
||||
@@ -46,25 +44,23 @@ export function RootProviders({
|
||||
return (
|
||||
<QueryClientProvider client={queryClient}>
|
||||
<ReactQueryStreamedHydration>
|
||||
<Suspense fallback={null}>
|
||||
<I18nProvider settings={i18nSettings} resolver={i18nResolver}>
|
||||
<CaptchaProvider>
|
||||
<CaptchaTokenSetter siteKey={captchaSiteKey} />
|
||||
<I18nProvider settings={i18nSettings} resolver={i18nResolver}>
|
||||
<CaptchaProvider>
|
||||
<CaptchaTokenSetter siteKey={captchaSiteKey} />
|
||||
|
||||
<AuthChangeListener appHomePath={pathsConfig.app.home}>
|
||||
<ThemeProvider
|
||||
attribute="class"
|
||||
enableSystem
|
||||
disableTransitionOnChange
|
||||
defaultTheme={theme}
|
||||
enableColorScheme={false}
|
||||
>
|
||||
{children}
|
||||
</ThemeProvider>
|
||||
</AuthChangeListener>
|
||||
</CaptchaProvider>
|
||||
</I18nProvider>
|
||||
</Suspense>
|
||||
<AuthChangeListener appHomePath={pathsConfig.app.home}>
|
||||
<ThemeProvider
|
||||
attribute="class"
|
||||
enableSystem
|
||||
disableTransitionOnChange
|
||||
defaultTheme={theme}
|
||||
enableColorScheme={false}
|
||||
>
|
||||
{children}
|
||||
</ThemeProvider>
|
||||
</AuthChangeListener>
|
||||
</CaptchaProvider>
|
||||
</I18nProvider>
|
||||
</ReactQueryStreamedHydration>
|
||||
</QueryClientProvider>
|
||||
);
|
||||
|
||||
@@ -21,9 +21,9 @@ export function createI18nSettings({
|
||||
fallbackLng: languages[0],
|
||||
detection: undefined,
|
||||
lng,
|
||||
load: 'languageOnly',
|
||||
preload: false,
|
||||
lowerCaseLng: true,
|
||||
load: 'languageOnly' as const,
|
||||
preload: false as const,
|
||||
lowerCaseLng: true as const,
|
||||
fallbackNS: ns,
|
||||
ns,
|
||||
react: {
|
||||
|
||||
@@ -12,11 +12,15 @@ import {
|
||||
useUserSession,
|
||||
} from '../hooks/use-user-session';
|
||||
|
||||
const PRIVATE_PATH_PREFIXES = ['/home', '/admin', '/join', '/update-password'];
|
||||
|
||||
function AuthRedirectListener({
|
||||
children,
|
||||
privatePathPrefixes = PRIVATE_PATH_PREFIXES,
|
||||
appHomePath,
|
||||
}: React.PropsWithChildren<{
|
||||
appHomePath: string;
|
||||
privatePathPrefixes?: string[];
|
||||
}>) {
|
||||
const client = useSupabase();
|
||||
const pathName = usePathname();
|
||||
@@ -30,7 +34,8 @@ function AuthRedirectListener({
|
||||
const listener = client.auth.onAuthStateChange((_, user) => {
|
||||
// log user out if user is falsy
|
||||
// and if the current path is a private route
|
||||
const shouldRedirectUser = !user && isPrivateRoute(pathName);
|
||||
const shouldRedirectUser =
|
||||
!user && isPrivateRoute(pathName, privatePathPrefixes);
|
||||
|
||||
if (shouldRedirectUser) {
|
||||
// send user away when signed out
|
||||
@@ -86,11 +91,7 @@ export function AuthChangeListener({
|
||||
|
||||
/**
|
||||
* Determines if a given path is a private route.
|
||||
*
|
||||
* @param {string} path - The path to check.
|
||||
*/
|
||||
function isPrivateRoute(path: string) {
|
||||
const prefixes = ['/home', '/admin', '/join', '/update-password'];
|
||||
|
||||
return prefixes.some((prefix) => path.startsWith(prefix));
|
||||
function isPrivateRoute(path: string, privatePathPrefixes: string[]) {
|
||||
return privatePathPrefixes.some((prefix) => path.startsWith(prefix));
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user