components/space/sub/author.tsx

import { SpaceAuthorData } from "@/utils/types";
import Image from "next/image";

export const SpaceAuthor = ({ author }: { author: SpaceAuthorData }) => {
  return (
    <p className="text-lg lg:text-xl font-serif text-white/60 flex items-center justify-start gap-2">
      by
      <Image
        src={
          author.avatarUrl?.startsWith("http")
            ? author.avatarUrl
            : `https://huggingface.co${author.avatarUrl}`
        }
        width={44}
        height={44}
        alt={`${author.fullname}'s avatar from Hugging Face`}
        className="rounded-full w-6 h-6"
      />
      {author.name}
    </p>
  );
};