import { AuthorAvatar } from "@blog";

interface AuthorProps {
  author: {
    name: string;
    href: string;
    imageUrl: string;
    role: string;
    did?: string;
  };
}

export default function Author({ author }: AuthorProps) {
  return (
    <div className="relative mt-8 flex items-center gap-x-4">
      <AuthorAvatar
        author={author}
        size={40}
        className="size-10 rounded-full bg-gray-50"
      />
      <div className="text-sm/6">
        <p className="font-semibold text-gray-900">
          <a href={author.href}>
            <span className="absolute inset-0" />
            {author.name}
          </a>
        </p>
        <p className="text-gray-600">{author.role}</p>
      </div>
    </div>
  );
}
