bbuddy-ui/src/app/[locale]/[userId]/layout.tsx

65 lines
1.8 KiB
TypeScript

import React, { ReactNode } from 'react';
import { Metadata } from 'next';
import { notFound } from 'next/navigation';
import { useTranslations } from 'next-intl';
import { AccountMenu } from '../../../components/Account';
type AccountLayoutProps = {
children: ReactNode;
params: Record<string, string>;
};
export const metadata: Metadata = {
title: 'Bbuddy User Account'
};
export function generateStaticParams({
params: { locale },
}: { params: { locale: string } }) {
const result: { locale: string, userId: string }[] = [];
const users = [{ userId: '1' }, { userId: '2' }];
users.forEach(({ userId }) => {
result.push({ locale, userId });
});
return result;
}
const ROUTES = ['sessions', 'notifications', 'support', 'information', 'settings', 'messages', 'work-with-us'];
const COUNTS: Record<string, number> = {
sessions: 12,
notifications: 5,
messages: 113
};
export default function AccountLayout({ children, params }: AccountLayoutProps) {
if (!params?.userId || isNaN(Number(params?.userId))) notFound();
const t = useTranslations('Account');
const getMenuConfig = () => ROUTES.map((path) => ({
path,
title: t(`menu.${path}`),
count: COUNTS[path] || undefined
}));
return (
<div className="page-account">
<div className="b-inner">
<div className="row">
<div className="col-xl-3 col-lg-4 d-none d-lg-block">
<AccountMenu userId={params.userId} menu={getMenuConfig()} />
</div>
<div className="col-xl-9 col-lg-8 ">
<div className="page-account__inner">
{children}
</div>
</div>
</div>
</div>
</div>
);
};