import { WarningOutlined } from "@ant-design/icons";
import { Space, Tooltip } from "antd";
import { useTranslation } from "react-i18next";

const style = {
  fontWeight: "bold",
  color: "green"
};

export default function ExportLogsCountDisplay({ logs }) {
  const success = logs.filter((e) => e.successful).length;
  const attempts = logs.length;
  const { t } = useTranslation();
  return (
    <Space style={success > 0 ? style : {}}>
      {`${success}/${attempts}`}
      {success > 0 && (
        <Tooltip title={t("exportlogs.labels.priorsuccesfulexport")}>
          <WarningOutlined />
        </Tooltip>
      )}
    </Space>
  );
}
