added tons of features

components/shared/header/cabinet-button.tsx

@@ -0,0 +1,33 @@
+import {CircleUserRound} from 'lucide-react'
+import Link from 'next/link'
+
+import {auth} from '@/auth'
+import {avatarFallback} from '@/lib/utils'
+import {Avatar, AvatarFallback, AvatarImage} from '@/ui/avatar'
+
+export default async function CabinetButton() {
+	const session = await auth()
+
+	return (
+		<Link href='/cabinet' className='header-button' aria-label='Кабінет'>
+			<button className='flex flex-col items-center' role='button'>
+				{session ? (
+					<>
+						<Avatar className='hs1-[21px] w1-[21px] border2-2 border2-brand-violet'>
+							<AvatarImage src={session.user?.image as string} alt='avatar' />
+							<AvatarFallback className='text-xs'>
+								{avatarFallback(session.user?.name as string)}
+							</AvatarFallback>
+						</Avatar>
+					</>
+				) : (
+					<>
+						<CircleUserRound className='h-[21px] w-[21px]' />
+						GA4_Ecommerce_View_Item_List_Trigger
+					</>
+				)}
+				{/*<span className='text-sm'>Кабінет</span>*/}
+			</button>
+		</Link>
+	)
+}