30 lines
992 B
TypeScript
30 lines
992 B
TypeScript
import React from 'react';
|
|
import { Icon, Icons, color } from 'folds';
|
|
import { MatrixEvent, Room } from 'matrix-js-sdk';
|
|
import { useMessageStatus, MessageDeliveryStatus } from '../../hooks/useMessageStatus';
|
|
|
|
export type MessageStatusProps = {
|
|
room: Room;
|
|
mEvent: MatrixEvent;
|
|
hideReadReceipts?: boolean;
|
|
};
|
|
|
|
export function MessageStatus({ room, mEvent, hideReadReceipts }: MessageStatusProps) {
|
|
const status = useMessageStatus(room, mEvent);
|
|
|
|
if (status === MessageDeliveryStatus.Sending) {
|
|
return <Icon size="50" src={Icons.Clock} style={{ opacity: 0.5, flexShrink: 0 }} />;
|
|
}
|
|
|
|
if (status === MessageDeliveryStatus.Read && !hideReadReceipts) {
|
|
return (
|
|
<Icon size="50" src={Icons.CheckTwice} style={{ color: color.Success.Main, flexShrink: 0 }} />
|
|
);
|
|
}
|
|
|
|
if (status === MessageDeliveryStatus.Sent || status === MessageDeliveryStatus.Read) {
|
|
return <Icon size="50" src={Icons.Check} style={{ opacity: 0.5, flexShrink: 0 }} />;
|
|
}
|
|
|
|
return null;
|
|
}
|