"use client";

import Image from "next/image";
import Link from "next/link";

interface HeaderButtonsWidgetProps {
  variant?: "v1" | "v2";
  setIsSearchOpen: (isOpen: boolean) => void;
  setIsMenuOpen: (isOpen: boolean) => void;
}

export default function HeaderButtonsWidget({
  variant,
  setIsSearchOpen,
  setIsMenuOpen,
}: HeaderButtonsWidgetProps) {
  return (
    <div className="col-lg-3 col-md-6 col-sm-6">
      <div className="header-btn">
        <button
          type="button"
          className="search-btn"
          aria-label="Search"
          onClick={() => {
            setIsSearchOpen(true);
          }}
        >
          <Image
            src="/assets/images/icon/search.svg"
            alt="Search Icon"
            width={20}
            height={20}
          />
        </button>
        <Link
          href="/contact"
          className={
            variant === "v2" ? "btn-style1 v2" : "btn-style1"
          }
        >
          Sign In
          <span>
            <Image
              src="/assets/images/icon/arrow.svg"
              alt="Arrow Icon"
              width={16}
              height={16}
            />
          </span>
        </Link>
        <button
          className="hamburger-btn"
          aria-label="Toggle Menu"
          onClick={() => setIsMenuOpen(true)}
        >
          <span></span>
          <span></span>
          <span></span>
        </button>
      </div>
    </div>
  );
}