import type { Comment } from "@/db/schema";

type Props = { comments: Comment[] };

export function CommentList({ comments }: Props) {
  if (comments.length === 0) return null;

  return (
    <div className="mt-3 space-y-2">
      {comments.map((c) => (
        <div
          key={c.id}
          className={`flex gap-2 ${c.author === "admin" ? "flex-row-reverse" : ""}`}
        >
          <div
            className={`rounded-lg px-3 py-2 text-xs max-w-xs ${
              c.author === "admin"
                ? "bg-gray-900 text-white"
                : "bg-gray-100 text-gray-800"
            }`}
          >
            <p className="font-medium mb-0.5 opacity-60">
              {c.author === "admin" ? "iamcavalli" : "Tu"}
            </p>
            <p>{c.body}</p>
          </div>
        </div>
      ))}
    </div>
  );
}