refactor: timer strategy is default

apps/client/src/features/app-settings/panel/interface-panel/EditorSettingsForm.tsx

@@ -1,5 +1,5 @@
 import { Select, Switch } from '@chakra-ui/react';
-import { EndAction, TimerType } from 'ontime-types';
+import { EndAction, TimerType, TimeStrategy } from 'ontime-types';
 import { parseUserTime } from 'ontime-utils';
 
 import TimeInput from '../../../../common/components/input/time-input/TimeInput';
@@ -10,6 +10,7 @@ export default function EditorSettingsForm() {
   const {
     defaultDuration,
     linkPrevious,
+    defaultTimeStrategy,
     defaultWarnTime,
     defaultDangerTime,
     defaultPublic,
@@ -17,6 +18,7 @@ export default function EditorSettingsForm() {
     defaultEndAction,
     setDefaultDuration,
     setLinkPrevious,
+    setTimeStrategy,
     setWarnTime,
     setDangerTime,
     setDefaultPublic,
@@ -36,15 +38,6 @@ export default function EditorSettingsForm() {
         <Panel.Section>
           <Panel.Title>Rundown defaults for new events</Panel.Title>
           <Panel.ListGroup>
-            <Panel.ListItem>
-              <Panel.Field title='Default duration' description='Default duration for new events' />
-              <TimeInput<'defaultDuration'>
-                name='defaultDuration'
-                submitHandler={(_field, value) => setDefaultDuration(value)}
-                time={durationInMs}
-                placeholder={editorSettingsDefaults.duration}
-              />
-            </Panel.ListItem>
             <Panel.ListItem>
               <Panel.Field
                 title='Link previous'
@@ -57,6 +50,33 @@ export default function EditorSettingsForm() {
                 onChange={(event) => setLinkPrevious(event.target.checked)}
               />
             </Panel.ListItem>
+            <Panel.ListItem>
+              <Panel.Field
+                title='Timer strategy'
+                description='Which time should be maintained when event schedule is recalculated'
+              />
+              <Select
+                variant='ontime'
+                size='sm'
+                width='auto'
+                value={defaultTimeStrategy}
+                onChange={(event) => setTimeStrategy(event.target.value as TimeStrategy)}
+              >
+                <option value={TimeStrategy.LockDuration}>Duration</option>
+                <option value={TimeStrategy.LockEnd}>End Time</option>
+              </Select>
+            </Panel.ListItem>
+          </Panel.ListGroup>
+          <Panel.ListGroup>
+            <Panel.ListItem>
+              <Panel.Field title='Default duration' description='Default duration for new events' />
+              <TimeInput<'defaultDuration'>
+                name='defaultDuration'
+                submitHandler={(_field, value) => setDefaultDuration(value)}
+                time={durationInMs}
+                placeholder={editorSettingsDefaults.duration}
+              />
+            </Panel.ListItem>
             <Panel.ListItem>
               <Panel.Field title='Timer type' description='Default type of timer for new events' />
               <Select

apps/client/src/features/rundown/time-input-flow/TimeInputFlow.tsx

@@ -10,7 +10,7 @@ import { MaybeString, OntimeEvent, 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 } from '../../../ontimeConfig';
+import { tooltipDelayFast, tooltipDelayMid } from '../../../ontimeConfig';
 
 import style from './TimeInputFlow.module.scss';
 
@@ -66,7 +66,7 @@ const TimeInputFlow = (props: EventBlockTimerProps) => {
         placeholder='Start'
         disabled={Boolean(linkStart)}
       >
-        <Tooltip label='Link start to previous end' shouldWrapChildren openDelay={0}>
+        <Tooltip label='Link start to previous end' openDelay={tooltipDelayMid}>
           <InputRightElement className={activeStart} onClick={() => handleLink(!linkStart)}>
             <span className={style.timeLabel}>S</span>
             <span className={style.fourtyfive}>{linkStart ? <IoLink /> : <IoUnlink />}</span>
@@ -82,7 +82,7 @@ const TimeInputFlow = (props: EventBlockTimerProps) => {
         disabled={isLockedDuration}
         placeholder='End'
       >
-        <Tooltip label='Lock end' shouldWrapChildren openDelay={0}>
+        <Tooltip label='Lock end' openDelay={tooltipDelayMid}>
           <InputRightElement
             className={activeEnd}
             onClick={() => handleChangeStrategy(TimeStrategy.LockEnd)}
@@ -101,7 +101,7 @@ const TimeInputFlow = (props: EventBlockTimerProps) => {
         disabled={isLockedEnd}
         placeholder='Duration'
       >
-        <Tooltip label='Lock duration' shouldWrapChildren openDelay={0}>
+        <Tooltip label='Lock duration' openDelay={tooltipDelayMid}>
           <InputRightElement
             className={activeDuration}
             onClick={() => handleChangeStrategy(TimeStrategy.LockDuration)}