"use client";
/**
 * ChatHeader 顶部栏
 *
 * 图标：lucide-react <Lock />（游客 banner）+ <Menu />（菜单按钮）
 *   tree-shakable，currentColor 继承父 color
 */
import { Lock, Menu } from "lucide-react";
import { useRouter } from "next/navigation";

import { ROUTES } from "@/router/routes";

import styles from "./chat-header.module.css";

export interface ChatHeaderProps {
  isGuest: boolean;
}

export function ChatHeader({ isGuest }: ChatHeaderProps) {
  const router = useRouter();

  if (isGuest) {
    return (
      <header className={styles.header}>
        <button
          type="button"
          className={styles.guestBanner}
          onClick={() => router.push(ROUTES.auth)}
          aria-label="Sign up to unlock more features"
        >
          <Lock className={styles.guestBannerIcon} size={16} aria-hidden="true" />
          <span>Sign up to unlock more features</span>
        </button>
      </header>
    );
  }

  return (
    <header className={styles.header}>
      <div className={styles.headerRow}>
        {/* 菜单按钮（点击 → push 到 /sidebar，与 Dart MenuButton 一致） */}
        <button
          type="button"
          className={styles.menuButton}
          onClick={() => router.push(ROUTES.sidebar)}
          aria-label="Menu"
        >
          <Menu className={styles.menuIcon} size={24} aria-hidden="true" />
        </button>
      </div>
    </header>
  );
}
