import ArrowUpComment from "@/components/icons/ArrowUpComment";
import { Button } from "@mui/material";

function AnswerField({ data, update, setUpdate }) {
  return (
    <div className="flex items-center justify-start gap-1 my-2">
      <Button
        className="!text-[#0FA1B3] !text-[12px] !font-medium"
        onClick={() => {
          data.is_open_reply = !data.is_open_reply;
          setUpdate(!update);
        }}
      >
        مشاهده پاسخ ها ({data.replies.length})
        <div
          className={`!mr-1 ${
            data.is_open_reply ? "!rotate-0" : "!rotate-180"
          }`}
        >
          <ArrowUpComment />
        </div>
      </Button>
    </div>
  );
}

export default AnswerField;