fix: fix ssr window

This commit is contained in:
SD 2024-06-22 20:03:56 +04:00
parent 6c875cdf39
commit 5303bb895d
7 changed files with 50 additions and 29 deletions

View File

@ -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 (
<>
<ol className="breadcrumb">

View File

@ -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 (
<Account>
{children}
</Account>
);
};

View File

@ -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 (
<html lang={locale} className={`${comfortaa.variable} ${inter.variable}`}>

View File

@ -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;

View File

@ -14,10 +14,10 @@ type HeaderAuthLinksProps = {
separatorClass?: string;
};
export const HeaderAuthLinks: FC<HeaderAuthLinksProps> = ({
function HeaderAuthLinks ({
locale,
separatorClass = 'b-header__nav__list__line'
}) => {
}: HeaderAuthLinksProps) {
const [isOpenModal, setIsOpenModal] = useState<boolean>(false);
const [mode, setMode] = useState<'enter' | 'register' | 'reset' | 'finish'>('enter');
const selectedLayoutSegment = useSelectedLayoutSegment();
@ -75,4 +75,6 @@ export const HeaderAuthLinks: FC<HeaderAuthLinksProps> = ({
/>
</>
);
};
}
export default HeaderAuthLinks;

View File

@ -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 = ({
<Link href={`/${path}` as any} className={pathname === path ? 'active' : ''}>{title}</Link>
</li>
))}
<HeaderAuthLinks locale={locale} />
<AuthLinks locale={locale} />
</ul>
</nav>
</div>

View File

@ -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<HeaderMenuMobileProps> = ({
locale,
linkConfig
@ -35,7 +37,7 @@ export const HeaderMobileMenu: FC<HeaderMenuMobileProps> = ({
<img className="img-default" src="/images/avatar.png" alt=""/>
</div>
<ul className="menu-mobile__header__nav">
<HeaderAuthLinks
<AuthLinks
separatorClass="menu-mobile__header__nav__line"
locale={locale}
/>