import { IUser } from "../types/IUser";
import ChevronRightIcon from "./icons/ChevronRightIcon";
import NewButton from "./NewButton";

function ClientCard({ client }: { client: IUser }) {
  return (
    <>
      <NewButton variant="secondary" className="w-full">
        <div className="flex flex-col gap-[0.278vw] w-full text-left h-[2.222vw]">
          <p className="caption-s font-medium text-[#BDBDBD]">Клиент</p>
          <p className="text-s font-medium">{client.name}</p>
        </div>
        <div className="flex gap-[0.556vw] items-center">
          {!client.email && (
            <p className="caption-s font-medium text-[#7B60F3] whitespace-nowrap">
              Добавьте email
            </p>
          )}
          <span className="w-[1.389vw] h-[1.389vw] flex items-center justify-center text-[#7B60F3]">
            <ChevronRightIcon />
          </span>
        </div>
      </NewButton>
    </>
  );
}

export default ClientCard;