"use client";

import { Bell } from "lucide-react";
import Link from "next/link";
import { type ReactElement } from "react";

import { cn } from "@/lib/utils";

type PlayerNotificationBellProps = {
  className?: string;
};

/** 顶栏铃铛：跳转通知页（完整通知中心待后续接入） */
export function PlayerNotificationBell({
  className,
}: PlayerNotificationBellProps): ReactElement {
  return (
    <Link
      href="/notifications"
      className={cn("relative text-[#0b3f96]", className)}
      aria-label="Notifications"
    >
      <Bell className="size-[1.125rem]" aria-hidden />
      <span
        className="absolute right-1 top-1 size-2 rounded-full bg-[#f10b32] ring-2 ring-white"
        aria-hidden
      />
    </Link>
  );
}