Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 | 608x 17x 17x 17x 17x 17x | import { ReactElement } from "react";
import { useTranslation } from "react-i18next";
import { capitalize } from "remeda";
import { EventLogItem } from "shared/types/models/eventLog";
import { useTimeFormatters } from "client/utils/useTimeFormatters";
import { isSameDayInEventTimezone } from "client/views/program-item/programItemUtils";
interface Props {
eventLogItem: EventLogItem;
}
export const EventLogNoAssignment = ({ eventLogItem }: Props): ReactElement => {
const { t } = useTranslation();
const { getTime, getShortWeekdayAndTime } = useTimeFormatters();
// A lottery covering several starting times names the whole span, since no single hour of it
// is the one the attendee was competing for. Narrowed once, so the two fields cannot be read
// apart from each other.
const { programItemStartTime, lastProgramItemEndTime, programType } =
eventLogItem;
const lotteriedSpan =
lastProgramItemEndTime && programType
? { lastProgramItemEndTime, programType }
: null;
// A span can end on the next day, where bare clock times read as running backwards. Both ends
// carry the day then, so neither of them is the one the reader has to guess.
const formatSpanTime =
lotteriedSpan &&
!isSameDayInEventTimezone(
new Date(programItemStartTime),
new Date(lotteriedSpan.lastProgramItemEndTime),
)
? getShortWeekdayAndTime
: getTime;
return (
<div>
<span>
{lotteriedSpan
? t("eventLogActions.noAssignmentTimeRange", {
PROGRAM_TYPE: capitalize(
t(`programTypePlural.${lotteriedSpan.programType}`),
),
FIRST_TIME: formatSpanTime(programItemStartTime),
LAST_TIME: formatSpanTime(lotteriedSpan.lastProgramItemEndTime),
})
: t("eventLogActions.noAssignment", {
START_TIME: getTime(programItemStartTime),
})}
</span>
</div>
);
};
|