import { SyncOutlined } from "@ant-design/icons";
import { Card } from "antd";
import React from "react";
import { useTranslation } from "react-i18next";

export default function DashboardRefreshRequired(props) {
  const { t } = useTranslation();

  return (
    <Card {...props}>
      <div
        style={{
          display: "flex",
          flexDirection: "column",
          justifyContent: "center",
          alignItems: "center",
          textOverflow: "ellipsis"
        }}
      >
        <SyncOutlined style={{ fontSize: "300%", margin: "1rem" }} />
        <div>{t("dashboard.errors.refreshrequired")}</div>
      </div>
    </Card>
  );
}
