"use client";

import Link from "next/link";
import HeaderMenuRight from "@/layouts/header-menu-right";
import StickyHeader from "@/layouts/sticky-header";
import { Title } from "rizzui";
import { PiListBold } from "react-icons/pi";
import Image from "next/image";

type HeaderProps = {
  collapsed: boolean;
  setCollapsed: React.Dispatch<React.SetStateAction<boolean>>;
};

export default function Header({
  collapsed,
  setCollapsed,
}: HeaderProps) {
  return (
    <StickyHeader className="z-[990] px-4 py-3">
      <div className="flex items-center gap-4">
        {/* Toggle Button */}
        <button
          onClick={() => setCollapsed(!collapsed)}
          className="rounded-md p-2 hover:bg-gray-200"
        >
          <PiListBold/>
        </button>

        <Link href="/" className="flex items-center gap-2 text-gray-800">
          {collapsed ? (
             <>
              <Image
                src={'/logo_small.png'}
                alt="Logo"
                width={100}
                height={6}
                className="rounded-full border"
              />
              <Title className="text-base font-semibold">
                Siddhanam Real Estate Private Limited
              </Title>
            </>
          ) : (
            <>
              <Title className="text-base font-semibold">
                SRPL
              </Title>
            </>
          )}
        </Link>
      </div>
      <HeaderMenuRight />
    </StickyHeader>
  );
}