import { TabLink } from '@/components/TabLink';
import { getScopedI18n } from '@/i18n/server';

export default async function Layout({
    children,
}: {
    children: React.ReactNode;
}) {
    const t = await getScopedI18n('pages.profile');

    return (
        <>
            <nav className="flex items-center gap-5 border-gray-300 border-b px-5">
                <TabLink data-testid="profile-tab" href="settings">
                    {t('tabs.profile')}
                </TabLink>
                <TabLink data-testid="subscriptions-tab" href="subscriptions">
                    {t('tabs.subscriptions')}
                </TabLink>
            </nav>
            <div className="relative min-h-10">{children}</div>
        </>
    );
}