import { IProjectCreator } from "@/types/types";
import React from "react";
import ProfileAvatar from "@/components/main/ProfileAvatar";import VerificationBadge from "@/components/main/VerificationBadge";
import Link from "next/link";

function ProjectCreator({ creator }: { creator: IProjectCreator }) {
  return (
    <Link
      href={`/users/${creator?.user_name}`}
      className="w-full flex items-center my-3"
    >
      {creator?.profile_image && (
        <ProfileAvatar
          src={creator.profile_image}
          alt={creator?.user_name}
          size="md"
          rounded="2xl"
          className="ml-2 md:h-[120px] md:w-[120px]"
        />
      )}
      <div className="flex flex-col gap-1">
        <span>کاربر</span>
        <span>
          {creator?.first_name &&
            creator?.first_name + " " + creator?.last_name}
        </span>
        <div className="flex items-center gap-1 mt-1">
          <span className="inline-flex items-center gap-1">
            {creator?.user_name}
            <VerificationBadge isVerified={creator?.is_verified} />
          </span>
        </div>
      </div>
    </Link>
  );
}

export default ProjectCreator;
