import React from "react";
import { Typography } from "antd";
import useRoute from "@/routes/hooks/useRoute";
import { useTranslation } from "react-i18next";

const pageStyle = {
  margin: "0 24px 24px 24px",
  // margin: '24px',
  minHeight: "calc(100% - 24px)",
};
const { Title } = Typography;

export default (props) => {
  const router = useRoute() || {};
  const style = router.meta.noLayout ? { height: "100%" } : pageStyle;
  const title = props.title || router.meta.title;
  const { t } = useTranslation();
  return (
    <div style={style}>
      {title && !router.meta.noLayout && (
        <Title level={3} style={{ paddingBottom: "12px", fontWeight: 400 }}>
          {t(`${router.path}.title`)}
        </Title>
      )}
      {props.children}
    </div>
  );
};