import { PlaneIcon, Workflow } from "lucide-react";
import { useSession } from "next-auth/react";

interface HeaderProps {
  isChecked: boolean;
  handleCheckboxChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
}

export const Header = ({ isChecked, handleCheckboxChange }: HeaderProps) => {
  const session = useSession();
  console.log(session);
  return (
    <header className="flex justify-between items-center p-4">
      <h1 className="text-2xl font-bold">
        Hallo,{" "}
        {session.status === "authenticated"
          ? session.data?.user.firstname
          : "<username>"}
        {"!"}
      </h1>
      <div>
        <div className="tooltip" data-tip="Disponent / Pilot">
          <label className="toggle text-base-content">
            <input
              type="checkbox"
              checked={isChecked}
              onChange={handleCheckboxChange}
            />
            <Workflow
              className="w-4 h-4"
              viewBox="0 0 24 24"
              aria-label="enabled"
            />
            <PlaneIcon
              className="w-4 h-4"
              viewBox="0 0 24 24"
              aria-label="disabled"
            />
          </label>
        </div>
      </div>
    </header>
  );
};