diff --git a/src/components/step.tsx b/src/components/step.tsx index 60b2622..3f322a7 100644 --- a/src/components/step.tsx +++ b/src/components/step.tsx @@ -5,6 +5,7 @@ import React, { ReactChild, useMemo } from "react"; import { StepIcon } from "@/components/stepIcon"; type StepProps = StepperStepProps & { + notBefore?: Moment; until?: Moment; completedOn?: Moment; label: string; @@ -17,7 +18,7 @@ type StepProps = StepperStepProps & { const now = moment(); export const Step = (props: StepProps) => { - const { until, label, completedOn, children, completed = false, declined = false, waiting = false, state = null, ...rest } = props; + const { until, notBefore, label, completedOn, children, completed = false, declined = false, waiting = false, state = null, ...rest } = props; const { t } = useTranslation(); const isLate = useMemo(() => until?.isBefore(completedOn || now), [completedOn, until]); @@ -26,18 +27,22 @@ export const Step = (props: StepProps) => { return { label } - { until && - { state && <> - { state } + + { state && { state } } + { notBefore && + + { t('not-before', { date: notBefore }) } + } + { until && <> + + { t('until', { date: until }) } + { isLate && - { t('late', { by: moment.duration(now.diff(until)) }) } } + { !isLate && !completed && - { t('left', { left: left }) } } + } - - { t('until', { date: until }) } - { isLate && - { t('late', { by: moment.duration(now.diff(until)) }) } } - { !isLate && !completed && - { t('left', { left: left }) } } - - } + { children && { children } } diff --git a/src/pages/main.tsx b/src/pages/main.tsx index c6b91a5..761a47c 100644 --- a/src/pages/main.tsx +++ b/src/pages/main.tsx @@ -13,7 +13,7 @@ import { PlanStep } from "@/pages/steps/plan"; import { InsuranceState } from "@/state/reducer/insurance"; import { InsuranceStep } from "@/pages/steps/insurance"; import { StudentStep } from "@/pages/steps/student"; -import { useDeadlines } from "@/hooks"; +import { useCurrentEdition, useDeadlines } from "@/hooks"; import api from "@/api"; import { AppDispatch, InternshipPlanActions, InternshipProposalActions, useDispatch } from "@/state/actions"; import { internshipRegistrationDtoTransformer } from "@/api/dto/internship-registration"; @@ -51,6 +51,7 @@ export const MainPage = () => { const deadlines = useDeadlines(); const insurance = useSelector(root => root.insurance); const dispatch = useDispatch(); + const edition = useCurrentEdition(); useEffect(() => { dispatch(updateInternshipInfo); @@ -68,13 +69,15 @@ export const MainPage = () => { if (insurance.required) yield ; - yield + yield yield } - return + return + + { t("pages.my-internship.header") } + - { t("pages.my-internship.header") } { Array.from(getSteps()) } diff --git a/src/pages/steps/plan.tsx b/src/pages/steps/plan.tsx index b437403..2e15ec3 100644 --- a/src/pages/steps/plan.tsx +++ b/src/pages/steps/plan.tsx @@ -26,7 +26,7 @@ const PlanActions = () => { const history = useHistory(); const FormAction = ({ children = t('steps.plan.submit'), ...props }: ButtonProps) => - diff --git a/translations/pl.yaml b/translations/pl.yaml index 5df1221..32e762e 100644 --- a/translations/pl.yaml +++ b/translations/pl.yaml @@ -7,6 +7,7 @@ logout: wyloguj się logged-in-as: zalogowany jako <1>{{ name }} until: do {{ date, DD MMMM YYYY }} +not-before: od {{ date, DD MMMM YYYY }} late: '{{ by, humanize }} spóźnienia' left: jeszcze {{ left, humanize }}