Create toast provider

This commit is contained in:
Takeshi Kimata
2024-05-27 23:15:30 +09:00
parent 5ae4417c23
commit cfd6a9b339
10 changed files with 132 additions and 31 deletions

View File

@@ -4,6 +4,7 @@ import { Providers } from './providers';
import Header from './Header';
import clsx from 'clsx';
import { getTranslations } from 'next-intl/server';
import { useTranslations } from 'next-intl';
export async function generateMetadata({ params: { locale } }) {
const t = await getTranslations({ locale, namespace: 'Header' });
@@ -25,11 +26,20 @@ export default function RootLayout({
children: React.ReactNode;
params: { locale: string };
}) {
const t = useTranslations('Toast');
const toastMessages = {
needSignedIn: t('need_signed_in'),
sessionExpired: t('session_expired'),
};
return (
<html lang={locale} suppressHydrationWarning>
<head />
<body className={clsx('min-h-[calc(100vh-64px)] bg-background font-sans antialiased', fontSans.variable)}>
<Providers themeProps={{ attribute: 'class', defaultTheme: 'light' }} tokenProps={{ locale: locale }}>
<Providers
themeProps={{ attribute: 'class', defaultTheme: 'light' }}
tokenProps={{ toastMessages: toastMessages, locale: locale }}
>
<div className="relative flex flex-col min-h-screen light:bg-neutral-50 dark:bg-neutral-800">
<Header locale={locale} />
<main>{children}</main>

View File

@@ -5,22 +5,27 @@ import { NextUIProvider } from '@nextui-org/react';
import { useRouter } from 'next/navigation';
import { ThemeProvider as NextThemesProvider } from 'next-themes';
import { ThemeProviderProps } from 'next-themes/dist/types';
import ToastProvider from '@/utils/ToastProvider';
import { ToastProps } from '@/types/toast';
import TokenProvider from '@/utils/TokenProvider';
import { TokenProps } from '@/types/user';
export interface ProvidersProps {
children: React.ReactNode;
themeProps?: ThemeProviderProps;
toastProps?: ToastProps;
tokenProps?: TokenProps;
}
export function Providers({ children, themeProps, tokenProps }: ProvidersProps) {
export function Providers({ children, themeProps, toastProps, tokenProps }: ProvidersProps) {
const router = useRouter();
return (
<NextUIProvider navigate={router.push}>
<NextThemesProvider {...themeProps}>
<TokenProvider {...tokenProps}>{children}</TokenProvider>
<ToastProvider {...toastProps}>
<TokenProvider {...tokenProps}>{children}</TokenProvider>
</ToastProvider>
</NextThemesProvider>
</NextUIProvider>
);