import { Page } from "@/pages/base";
import { Container, Link, Typography } from "@material-ui/core";
import { Link as RouterLink } from "react-router-dom";
import { route } from "@/routing";
import React from "react";
import { useTranslation } from "react-i18next";
import { PlanForm } from "@/forms/plan";

export const SubmitPlanPage = () => {
    const { t } = useTranslation();

    return <Page title={ t("steps.plan.submit") }>
        <Page.Header maxWidth="md">
            <Page.Breadcrumbs>
                <Link component={ RouterLink } to={ route("home") }>{ t('pages.my-internship.header') }</Link>
                <Typography color="textPrimary">{ t("steps.plan.submit") }</Typography>
            </Page.Breadcrumbs>
            <Page.Title>{ t("steps.plan.submit") }</Page.Title>
        </Page.Header>
        <Container maxWidth={ "md" }>
            <PlanForm />
        </Container>
    </Page>
}

export default SubmitPlanPage;
