Refactor: ms for api calls (#1593)

* use ms for api calls

* change it in UI

* update comment

* rename variables

* refactor: addtime api logic

apps/client/src/features/control/playback/add-time/AddTime.tsx

@@ -2,7 +2,7 @@ import { IoAdd, IoRemove } from 'react-icons/io5';
 import { Tooltip } from '@chakra-ui/react';
 import { useLocalStorage } from '@mantine/hooks';
 import { Playback } from 'ontime-types';
-import { MILLIS_PER_HOUR, MILLIS_PER_SECOND, parseUserTime } from 'ontime-utils';
+import { MILLIS_PER_HOUR, parseUserTime } from 'ontime-utils';
 
 import TimeInput from '../../../../common/components/input/time-input/TimeInput';
 import { setPlayback } from '../../../../common/hooks/useSocket';
@@ -17,29 +17,29 @@ interface AddTimeProps {
 
 export default function AddTime(props: AddTimeProps) {
   const { playback } = props;
-  const [time, setTime] = useLocalStorage({ key: 'add-time', defaultValue: 300_000 }); // 5 minutes
+  const [timeInMs, setTime] = useLocalStorage({ key: 'add-time', defaultValue: 300_000 }); // 5 minutes
 
   const handleTimeChange = (_field: string, value: string) => {
-    const newTime = parseUserTime(value);
+    const newTimeInMs = parseUserTime(value);
     // cap add time to 1 hour
-    setTime(Math.min(newTime, MILLIS_PER_HOUR));
+    setTime(Math.min(newTimeInMs, MILLIS_PER_HOUR));
   };
 
   const handleAddTime = (direction: 'add' | 'remove') => {
-    // API expects input in seconds
+    // API expects input in milliseconds
     if (direction === 'add') {
-      setPlayback.addTime(time / MILLIS_PER_SECOND);
+      setPlayback.addTime(timeInMs);
     } else {
-      setPlayback.addTime((-1 * time) / MILLIS_PER_SECOND);
+      setPlayback.addTime(-1 * timeInMs);
     }
   };
 
   const canAddTime = playback === Playback.Play || playback === Playback.Pause;
-  const doDisableButtons = !canAddTime || time === 0;
+  const doDisableButtons = !canAddTime || timeInMs === 0;
 
   return (
     <div className={style.addTime}>
-      <TimeInput name='addtime' submitHandler={handleTimeChange} time={time} placeholder='Add time' />
+      <TimeInput name='addtime' submitHandler={handleTimeChange} time={timeInMs} placeholder='Add time' />
       <div className={style.addButtons}>
         <Tooltip label='Remove time' openDelay={tooltipDelayMid} shouldWrapChildren>
           <TapButton onClick={() => handleAddTime('remove')} disabled={doDisableButtons} className={style.tallButtons}>

apps/client/src/features/control/playback/aux-timer/AuxTimer.tsx

@@ -59,15 +59,20 @@ export function AuxTimer() {
 }
 
 function AuxTimerInput() {
-  const time = useAuxTimerTime();
+  const newTimeInMs = useAuxTimerTime();
   const { setDuration } = setAuxTimer;
 
   const handleTimeUpdate = (_field: string, value: string) => {
-    const newTime = parseUserTime(value);
-    setDuration(newTime / 1000); // frontend api is seconds based
+    const newTimeInMs = parseUserTime(value);
+    setDuration(newTimeInMs);
   };
 
   return (
-    <TimeInput<'auxTimer'> submitHandler={handleTimeUpdate} name='auxTimer' time={time} placeholder='Aux Timer 1' />
+    <TimeInput<'auxTimer'>
+      submitHandler={handleTimeUpdate}
+      name='auxTimer'
+      time={newTimeInMs}
+      placeholder='Aux Timer 1'
+    />
   );
 }

apps/server/src/api-integration/integration.controller.ts

@@ -1,5 +1,5 @@
 import { MessageState, OffsetMode, OntimeEvent, SimpleDirection, SimplePlayback } from 'ontime-types';
-import { MILLIS_PER_HOUR, MILLIS_PER_SECOND } from 'ontime-utils';
+import { MILLIS_PER_HOUR } from 'ontime-utils';
 
 import { DeepPartial } from 'ts-essentials';
 
@@ -187,27 +187,24 @@ const actionHandlers: Record<string, ActionHandler> = {
     throw new Error('No matching method provided');
   },
   addtime: (payload) => {
-    let time = 0;
-    if (payload && typeof payload === 'object') {
-      if ('add' in payload) {
-        time = numberOrError(payload.add);
-      } else if ('remove' in payload) {
-        time = numberOrError(payload.remove) * -1;
+    const time = (() => {
+      if (payload && typeof payload === 'object') {
+        if ('add' in payload) return numberOrError(payload.add);
+        if ('remove' in payload) return numberOrError(payload.remove) * -1;
       }
-    } else {
-      time = numberOrError(payload);
-    }
+      return numberOrError(payload);
+    })();
+
     assert.isNumber(time);
     if (time === 0) {
       return { payload: 'success' };
     }
 
-    const timeToAdd = time * MILLIS_PER_SECOND; // frontend is seconds based
-    if (Math.abs(timeToAdd) > MILLIS_PER_HOUR) {
+    if (Math.abs(time) > MILLIS_PER_HOUR) {
       throw new Error(`Payload too large: ${time}`);
     }
 
-    runtimeService.addTime(timeToAdd);
+    runtimeService.addTime(time);
     return { payload: 'success' };
   },
   /* Extra timers */
@@ -233,13 +230,11 @@ const actionHandlers: Record<string, ActionHandler> = {
     } else if (command && typeof command === 'object') {
       const reply = { payload: {} };
       if ('duration' in command) {
-        // convert duration in seconds to ms
-        const timeInMs = numberOrError(command.duration) * 1000;
+        const timeInMs = numberOrError(command.duration);
         reply.payload = auxTimerService.setTime(timeInMs);
       }
       if ('addtime' in command) {
-        // convert addTime in seconds to ms
-        const timeInMs = numberOrError(command.addtime) * 1000;
+        const timeInMs = numberOrError(command.addtime);
         reply.payload = auxTimerService.addTime(timeInMs);
       }
       if ('direction' in command) {