import HeadsetMicIcon from "@mui/icons-material/HeadsetMic";
import { Avatar, Box, Stack, Typography } from "@mui/material";
import moment from "jalali-moment";

const PreviousOperatorData = ({ historyItem }) => {
  return (
    <Stack direction={"row"} spacing={2}>
      <Box>
        <Avatar sx={{ backgroundColor: "primary.light" }}>
          <HeadsetMicIcon />
        </Avatar>
      </Box>
      <Stack>
        <Stack direction={"row"} sx={{ alignItems: "end" }}>
          <Typography sx={{ mr: 1 }}>
            {historyItem.operator_full_name}
          </Typography>
          <Typography variant="caption" sx={{ color: "secondary.main" }}>
            (کارشناس)
          </Typography>
        </Stack>
        <Typography variant="caption" sx={{ color: "secondary.main" }}>
          {moment(historyItem.created_at).locale("fa").fromNow()}
        </Typography>
      </Stack>
    </Stack>
  );
};

export default PreviousOperatorData;
