import { Button, Typography } from "@mui/material";
import { useRouter } from "next/router";
import Message from "@/core/components/Messages";
import { NextLinkComposed } from "@/core/components/LinkRouting";
import {useTranslations} from "next-intl";

const WithAuthComponent = () => {
    const router = useRouter();
    const t = useTranslations();

    return (
        <Message
            text={
                <Typography sx={{ textAlign: "center" }}>
                    {t("Authorization.typography_your_access_to_this_page_has_expired_Please_login_again")}
                </Typography>
            }
            actions={
                <>
                    <Button
                        variant="contained"
                        component={NextLinkComposed}
                        to={{
                            pathname: "/login-expert",
                            query: {back_url: encodeURIComponent(router.asPath)},
                        }}
                    >
                        {t("login")}
                    </Button>
                </>
            }
        />
    );
};

export default WithAuthComponent;
