Files
bewell-in-ua/components/cabinet/index.tsx
2025-02-05 08:01:14 +02:00

61 lines
1.7 KiB
TypeScript

import {useTranslations} from 'next-intl'
import {SignOutButton} from '@/components/auth/forms/sign-out-button'
import CabinetButton from '@/components/shared/header/cabinet-button'
import {type SingedInSession} from '@/lib/permission'
import {dump} from '@/lib/utils'
import {
Collapsible,
CollapsibleContent,
CollapsibleTrigger
} from '@/ui/collapsible'
import {Separator} from '@/ui/separator'
export default function CabinetIndex({
slug,
session
}: {
slug: string[] | undefined
session: SingedInSession | null
}) {
const t = useTranslations('cabinet')
return (
<div className='my-8'>
<div className='container flex flex-col sm:flex-row'>
<section className='bw-layout-col-left bw-border-color border-r pt-3'>
<div className='flex items-center justify-between pr-4'>
<CabinetButton />
<div>
<p className='text-sm'>{session?.user?.name}</p>
<p className='text-xs'>{session?.user?.email}</p>
</div>
</div>
<Separator className='bw-separator-color my-4' />
<SignOutButton />
</section>
<div className='bw-layout-col-right pt-3'>
<section className='w-full'>
<h1 className='text-3xl font-extrabold'>
{t('personal-information.title')}
</h1>
<Separator className='my-4' />
{/*<BasicEditor placeholder={'type something'} />*/}
{/*<Separator className='my-4' />*/}
{slug ? <code>{slug[0]}</code> : <pre>{dump(session)}</pre>}
<Collapsible>
<CollapsibleTrigger>
Can I use this in my project?
</CollapsibleTrigger>
<CollapsibleContent>
Yes. Free to use for personal and commercial projects. No
attribution required.
</CollapsibleContent>
</Collapsible>
</section>
</div>
</div>
</div>
)
}