-
Matt Kirby authoredMatt Kirby authored
Code owners
Assign users and groups as approvers for specific file changes. Learn more.
Comment.tsx 1.00 KiB
import { Comment } from '@/types/comment';
import { HeartIcon } from '@heroicons/react/24/outline';
import { FC, PropsWithChildren } from 'react';
type CommentProps = {
Comment: Comment;
};
const Comment: FC<PropsWithChildren<CommentProps>> = ({ Comment }) => {
return (
<div className="w-full flex items-center justify-between p-2">
<div className="flex flex-1">
<div className="flex h-8 w-8 max-w-xs items-center justify-center rounded-full bg-c-pink text-sm focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-pink-400 mr-2">
<img className="h-8 w-8 rounded-full" src={Comment.User.profile} alt="" />
</div>
<div>
<p className="text-xs font-bold">{Comment.User.username}</p>
<p className="text-sm">This is my comment</p>
<p className="text-xs text-gray-500">1 like</p>
</div>
</div>
<HeartIcon className="block h-3 w-3" aria-hidden="true" />
</div>
);
};
export default Comment;