import {User} from "@/interfaces/user";
import {Avatar} from "primereact/avatar";

interface Props {
	user: User;
}

/* eslint-disable @next/next/no-img-element */
export default function Navbar({user}: Props) {
	return (
		<header className="w-full bg-transparent py-4 gap-2 flex items-center">
			<h1 className="font-bold text-2xl w-1/6 px-8">eCrop</h1>
			<div className="flex justify-between w-5/6 mr-8">
				<input type="text" placeholder="Search..." className="rounded-full py-3 px-6 shadow-md outline-none" />
				<div className="flex gap-3 items-center justify-end">
					<Avatar size="normal" label={user.name.slice(0, 1)} shape="circle" />
					<span className="text-right">{user.name}</span>
				</div>
			</div>
		</header>
	);
}