import React from "react";
import DoneAllRoundedIcon from "@mui/icons-material/DoneAllRounded";
import CheckRoundedIcon from "@mui/icons-material/CheckRounded";
import { MessageReadStatusProps } from "@/hooks/Interface";

const MessageReadStatus: React.FC<MessageReadStatusProps> = ({
  messageStatus = "",
  indexOfLastMessageRead,
  index,
}) => {
  const isRead =
    indexOfLastMessageRead !== -1 && indexOfLastMessageRead >= index;

  if (isRead) {
    return <DoneAllRoundedIcon sx={{ color: "#d7282f !important" }} />;
  }

  return messageStatus === "delivered" ? (
    <DoneAllRoundedIcon />
  ) : (
    <CheckRoundedIcon />
  );
};

export default MessageReadStatus;
