Header Menu Button

1"use client";
2 
3import Link from "next/link";
4import type { HeaderMenuButtonBlock } from "~/payload-types";
5import { useSession } from "~/auth/client";
6import { cn } from "@/registry/deafult/utils";
7import UserAvatar from "@/registry/default/components/UserAvatar";
8 
9export default function MenuButton({
10	mobileView = false,
11	label,
12	href = "",
13	targetBlank,
14	alignment,
15	auth,
16}: { mobileView?: boolean } & HeaderMenuButtonBlock) {
17	const { data: session } = useSession();
18	if (auth) {
19		if (!session?.user) {
20			return (
21				<div
22					className={cn(
23						alignment === "left"
24							? "self-start"
25							: alignment === "right"
26								? "self-end"
27								: "self-center",
28						mobileView === true && "hidden",
29					)}
30				>
31					<Link href="/auth/sign-in" className="cursor-pointer">
32						{label}
33					</Link>
34				</div>
35			);
36		}
37 
38		return (
39			<div className="flex">
40				<UserAvatar />
41			</div>
42		);
43	}
44 
45	return (
46		<div
47			className={cn(
48				alignment === "left"
49					? "self-start"
50					: alignment === "right"
51						? "self-end"
52						: "self-center",
53				mobileView === true && "hidden",
54			)}
55		>
56			<Link
57				target={targetBlank ? "_blank" : "_self"}
58				href={href ?? "/home"}
59				className="cursor-pointer"
60			>
61				{label}
62			</Link>
63		</div>
64	);
65}