diff --git a/apps/client/src/features/rundown/event-block/EventBlockInner.tsx b/apps/client/src/features/rundown/event-block/EventBlockInner.tsx index f0e3621ac1..d4dfa828b8 100644 --- a/apps/client/src/features/rundown/event-block/EventBlockInner.tsx +++ b/apps/client/src/features/rundown/event-block/EventBlockInner.tsx @@ -1,4 +1,4 @@ -import { memo, useEffect, useState } from 'react'; +import { memo, useCallback, useEffect, useState } from 'react'; import { Tooltip } from '@chakra-ui/react'; import { IoArrowDown } from '@react-icons/all-files/io5/IoArrowDown'; import { IoArrowUp } from '@react-icons/all-files/io5/IoArrowUp'; @@ -11,7 +11,9 @@ import { IoPlaySkipForward } from '@react-icons/all-files/io5/IoPlaySkipForward' import { IoStop } from '@react-icons/all-files/io5/IoStop'; import { IoTime } from '@react-icons/all-files/io5/IoTime'; import { EndAction, MaybeString, Playback, TimerType, TimeStrategy } from 'ontime-types'; +import { parseUserTime } from 'ontime-utils'; +import { useEventAction } from '../../../common/hooks/useEventAction'; import { cx } from '../../../common/utils/styleUtils'; import { tooltipDelayMid } from '../../../ontimeConfig'; import EditableBlockTitle from '../common/EditableBlockTitle'; @@ -80,11 +82,25 @@ const EventBlockInner = (props: EventBlockInnerProps) => { playBtnStyles._hover = {}; } + const { updateEvent } = useEventAction(); + + const handleSubmit = useCallback( + (field: string, value: string | null) => { + if (field === 'timeStart' || field === 'timeEnd' || field === 'duration') { + //FIXME: loss of th `p` and `+` smart entry + const newTime = parseUserTime(value as string); + updateEvent({ id: eventId, [field]: newTime }); + } else { + updateEvent({ id: eventId, [field]: value }); + } + }, + [eventId, updateEvent], + ); + return !renderInner ? null : ( <>
{ timeStrategy={timeStrategy} linkStart={linkStart} timerType={timerType} + handleSubmit={handleSubmit} />
diff --git a/apps/client/src/features/rundown/event-editor/EventEditor.tsx b/apps/client/src/features/rundown/event-editor/EventEditor.tsx index 76201831ed..1f9c9293b7 100644 --- a/apps/client/src/features/rundown/event-editor/EventEditor.tsx +++ b/apps/client/src/features/rundown/event-editor/EventEditor.tsx @@ -64,23 +64,6 @@ export default function EventEditor() { const multiSelect = selectedEvents.size > 1; - // const handleSubmit = useCallback( - // //TODO: the value type - // (field: EditorUpdateFields, value: string | boolean | number) => { - // if (field.startsWith('custom-')) { - // const fieldLabel = field.split('custom-')[1]; - // multiSelect - // ? batchUpdateEvents({ custom: { [fieldLabel]: value as string } }, Array.from(selectedEvents)) - // : updateEvent({ id: event?.id, custom: { [fieldLabel]: value as string } }); - // } else { - // multiSelect - // ? batchUpdateEvents({ [field]: value }, Array.from(selectedEvents)) - // : updateEvent({ id: event?.id, [field]: value }); - // } - // }, - // [multiSelect, batchUpdateEvents, selectedEvents, updateEvent, event?.id], - // ); - const handleSubmit = useCallback( (patch: EditorUpdateFields) => { multiSelect ? batchUpdateEvents(patch, Array.from(selectedEvents)) : updateEvent({ id: event?.id, ...patch }); @@ -100,7 +83,6 @@ export default function EventEditor() {
{ const { - isMulti, - eventId, timeStart, timeEnd, duration, @@ -47,19 +55,26 @@ const EventEditorTimes = (props: EventEditorTimesProps) => { handleSubmit, } = props; - const handleSubmitWrapper = (field: HandledActions, value: string | boolean) => { + const handleSubmitWrapper = (field: HandledActions, value: string | boolean | null) => { if (field === 'isPublic') { handleSubmit({ isPublic: !(value as boolean) }); return; } - if (field === 'timeWarning' || field === 'timeDanger') { + if ( + field === 'timeWarning' || + field === 'timeDanger' || + field === 'timeStart' || + field === 'timeEnd' || + field === 'duration' + ) { + //FIXME: loss of th `p` and `+` smart entry const newTime = parseUserTime(value as string); handleSubmit({ [field]: newTime }); return; } - if (field === 'timerType' || field === 'endAction') { + if (field === 'timerType' || field === 'endAction' || field === 'timeStrategy' || field === 'linkStart') { handleSubmit({ [field]: value }); return; } @@ -78,7 +93,6 @@ const EventEditorTimes = (props: EventEditorTimesProps) => {
Event schedule
{ linkStart={linkStart} delay={delay} timerType={timerType} - disableStartend={isMulti} + handleSubmit={handleSubmitWrapper} />
{delayLabel}
diff --git a/apps/client/src/features/rundown/time-input-flow/TimeInputFlow.tsx b/apps/client/src/features/rundown/time-input-flow/TimeInputFlow.tsx index fc392d0d4b..0a3a7f00e3 100644 --- a/apps/client/src/features/rundown/time-input-flow/TimeInputFlow.tsx +++ b/apps/client/src/features/rundown/time-input-flow/TimeInputFlow.tsx @@ -8,14 +8,13 @@ import { IoUnlink } from '@react-icons/all-files/io5/IoUnlink'; import { MaybeString, TimerType, TimeStrategy } from 'ontime-types'; import TimeInputWithButton from '../../../common/components/input/time-input/TimeInputWithButton'; -import { useEventAction } from '../../../common/hooks/useEventAction'; import { cx } from '../../../common/utils/styleUtils'; import { tooltipDelayFast, tooltipDelayMid } from '../../../ontimeConfig'; import style from './TimeInputFlow.module.scss'; +type TimeActions = 'timeStart' | 'timeEnd' | 'duration' | 'timeStrategy' | 'linkStart'; interface EventBlockTimerProps { - eventId: string; timeStart: number; timeEnd: number; duration: number; @@ -24,25 +23,19 @@ interface EventBlockTimerProps { delay: number; timerType: TimerType; disableStartend?: boolean; + handleSubmit: (field: TimeActions, value: string | null) => void; } -type TimeActions = 'timeStart' | 'timeEnd' | 'duration'; - const TimeInputFlow = (props: EventBlockTimerProps) => { - const { eventId, timeStart, timeEnd, duration, timeStrategy, linkStart, delay, timerType, disableStartend } = props; - const { updateEvent, updateTimer } = useEventAction(); - - // In sync with EventEditorTimes - const handleSubmit = (field: TimeActions, value: string) => { - updateTimer(eventId, field, value); - }; + const { timeStart, timeEnd, duration, timeStrategy, linkStart, delay, timerType, disableStartend, handleSubmit } = + props; const handleChangeStrategy = (timeStrategy: TimeStrategy) => { - updateEvent({ id: eventId, timeStrategy }); + handleSubmit('timeStrategy', timeStrategy); }; const handleLink = (doLink: boolean) => { - updateEvent({ id: eventId, linkStart: doLink ? 'true' : null }); + handleSubmit('linkStart', doLink ? 'true' : null); }; const warnings = [];