pulsar-web/src/components/Message/Message.tsx

29 lines
934 B
TypeScript

import type { Component } from "solid-js";
import { IMessageProps } from "./types";
const Message: Component<IMessageProps> = (props: IMessageProps) => {
return (
<li class="list-row p-3 hover:bg-stone-700">
<div
class="avatar cursor-pointer"
onClick={() => props.onProfileClick?.(props.userId)}
>
<div class="w-10 rounded-full">
<img src={props.avatar} />
</div>
</div>
<div>
<div class="font-bold">{props.username}</div>
{props.decryptionStatus ? (
<p class="list-col-wrap text-xs">{props.message}</p>
) : (
<p class="list-col-wrap text-xs italic">
Decryption failed
</p>
)}
</div>
</li>
);
};
export { Message };