diff --git a/src/app/[locale]/account/(account)/messages/page.tsx b/src/app/[locale]/account/(account)/messages/page.tsx index 56b40d6..746df4e 100644 --- a/src/app/[locale]/account/(account)/messages/page.tsx +++ b/src/app/[locale]/account/(account)/messages/page.tsx @@ -1,18 +1,11 @@ +'use client' + import React, { Suspense } from 'react'; -import type { Metadata } from 'next'; -import { useTranslations } from 'next-intl'; import { Link } from '../../../../../navigation'; import { CustomInput } from '../../../../../components/view/CustomInput'; import { i18nText } from '../../../../../i18nKeys'; -export const metadata: Metadata = { - title: 'Bbuddy - Account - Messages', - description: 'Bbuddy desc messages' -}; - export default function Messages({ params: { locale } }: { params: { locale: string } }) { - const t = useTranslations('Account.Messages'); - return ( <>
    diff --git a/src/app/[locale]/account/layout.tsx b/src/app/[locale]/account/layout.tsx index f9f0410..bb642a6 100644 --- a/src/app/[locale]/account/layout.tsx +++ b/src/app/[locale]/account/layout.tsx @@ -1,18 +1,14 @@ 'use client'; -import { ReactNode, useEffect } from 'react'; -import { redirect, notFound } from 'next/navigation'; -import { useLocalStorage } from '../../../hooks/useLocalStorage'; -import { AUTH_TOKEN_KEY } from '../../../constants/common'; +import { ReactNode } from 'react'; +import dynamic from 'next/dynamic'; -export default function AccountLayout({ children }: { children: ReactNode }) { - const [token] = useLocalStorage(AUTH_TOKEN_KEY, ''); +const Account = dynamic(() => import('../../../components/Account/AccountWrapper'), { ssr: false }); - useEffect(() => { - if(!token){ - notFound(); - } - }, []); - - return children; +export default function AccountBaseLayout({ children }: { children: ReactNode }) { + return ( + + {children} + + ); }; diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 06f7fdd..742fee4 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,4 +1,5 @@ import React, { ReactNode } from 'react'; +import type { Metadata } from 'next'; import { comfortaa, inter } from './fonts'; import '../styles/style.scss'; @@ -7,6 +8,11 @@ type RootLayoutProps = { params: { locale: string }; }; +export const metadata: Metadata = { + title: 'Bbuddy', + description: 'Bbuddy' +}; + export default function RootLayout({ children, params: { locale } }: RootLayoutProps) { return ( diff --git a/src/components/Account/AccountWrapper.tsx b/src/components/Account/AccountWrapper.tsx new file mode 100644 index 0000000..57270cd --- /dev/null +++ b/src/components/Account/AccountWrapper.tsx @@ -0,0 +1,20 @@ +'use client' + +import { ReactNode, useEffect } from 'react'; +import { notFound } from 'next/navigation'; +import { AUTH_TOKEN_KEY } from '../../constants/common'; +import { useLocalStorage } from '../../hooks/useLocalStorage'; + +function AccountWrapper ({ children }: { children: ReactNode }) { + const [token] = useLocalStorage(AUTH_TOKEN_KEY, ''); + + useEffect(() => { + if(!token){ + return notFound(); + } + }, []); + + return children; +} + +export default AccountWrapper; diff --git a/src/components/Page/Header/HeaderAuthLinks.tsx b/src/components/Page/Header/HeaderAuthLinks.tsx index e891919..362dfbe 100644 --- a/src/components/Page/Header/HeaderAuthLinks.tsx +++ b/src/components/Page/Header/HeaderAuthLinks.tsx @@ -14,10 +14,10 @@ type HeaderAuthLinksProps = { separatorClass?: string; }; -export const HeaderAuthLinks: FC = ({ +function HeaderAuthLinks ({ locale, separatorClass = 'b-header__nav__list__line' -}) => { +}: HeaderAuthLinksProps) { const [isOpenModal, setIsOpenModal] = useState(false); const [mode, setMode] = useState<'enter' | 'register' | 'reset' | 'finish'>('enter'); const selectedLayoutSegment = useSelectedLayoutSegment(); @@ -75,4 +75,6 @@ export const HeaderAuthLinks: FC = ({ /> ); -}; +} + +export default HeaderAuthLinks; diff --git a/src/components/Page/Header/HeaderMenu.tsx b/src/components/Page/Header/HeaderMenu.tsx index ced0dd4..62eae81 100644 --- a/src/components/Page/Header/HeaderMenu.tsx +++ b/src/components/Page/Header/HeaderMenu.tsx @@ -2,14 +2,16 @@ import React from 'react'; import { useSelectedLayoutSegment } from 'next/navigation'; +import dynamic from 'next/dynamic'; import { Link } from '../../../navigation'; -import { HeaderAuthLinks } from './HeaderAuthLinks'; type HeaderMenuProps = { locale: string; linkConfig: { path: string, title: string }[]; }; +const AuthLinks = dynamic(() => import('./HeaderAuthLinks'), { ssr: false }); + export const HeaderMenu = ({ locale, linkConfig @@ -26,7 +28,7 @@ export const HeaderMenu = ({ {title} ))} - + diff --git a/src/components/Page/Header/HeaderMobileMenu.tsx b/src/components/Page/Header/HeaderMobileMenu.tsx index cd888f9..461ea62 100644 --- a/src/components/Page/Header/HeaderMobileMenu.tsx +++ b/src/components/Page/Header/HeaderMobileMenu.tsx @@ -1,8 +1,8 @@ 'use client' import React, { FC, useState } from 'react'; +import dynamic from 'next/dynamic'; import { useSelectedLayoutSegment } from 'next/navigation'; -import { HeaderAuthLinks } from './HeaderAuthLinks'; import { Link } from '../../../navigation'; type HeaderMenuMobileProps = { @@ -10,6 +10,8 @@ type HeaderMenuMobileProps = { linkConfig: { path: string, title: string }[]; }; +const AuthLinks = dynamic(() => import('./HeaderAuthLinks'), { ssr: false }); + export const HeaderMobileMenu: FC = ({ locale, linkConfig @@ -35,7 +37,7 @@ export const HeaderMobileMenu: FC = ({
      -