comment-item.tsx

// import { formatTimeElapsed } from "@/lib/utils";
// import { UserAvatar } from "./user-avatar";

// export default function CommentItem({ msg }: { msg: any }) {
//     return (
//         <div className="flex">
//             <UserAvatar
//                 user={{ name: msg.user.username || null, image: msg.user.image || null }}
//                 className="h-10 w-10"
//             />
//             <div className="ml-4 flex flex-col flex-grow">
//                 <div>
//                     <div className="flex items-center">
//                         <h1 className="font-bold mr-2">{msg.user.name}</h1>
//                         <h1 className="text-sky-500 text-sm">
//                             @{msg.user.username}
//                         </h1>
//                         <h1 className="text-gray-500 text-sm ml-auto">
//                             {formatTimeElapsed(msg.createdAt)}
//                         </h1>
//                     </div>
//                     <h1>{msg.message}</h1>
//                 </div>
//             </div>
//         </div>
//     )
// }