Deps migration (#1988)

* chore: migrate eslint to oxlint

* chore: migrate prettier to oxfmt

* chore: migrate typescript

* chore: toThrow should have a expected value

* chore: cast test value as Day

* chore: small title fix

* chore: mocks should be hoisted

* chore: incorrect async useage

* chore: test should be inside description

* chore: test sohuld include an expeced

* chore: oxfmt

---------

Co-authored-by: alex-Arc <omnivox@LAPTOP-RC5SNBVV.localdomain>

apps/client/src/views/timeline/Timeline.tsx

@@ -1,13 +1,12 @@
-import { memo, useMemo, useRef } from 'react';
 import { useViewportSize } from '@mantine/hooks';
-import { isOntimeEvent, isPlayableEvent, OntimeEntry, PlayableEvent } from 'ontime-types';
-import { dayInMs, getLastEvent, MILLIS_PER_HOUR } from 'ontime-utils';
+import { OntimeEntry, PlayableEvent, isOntimeEvent, isPlayableEvent } from 'ontime-types';
+import { MILLIS_PER_HOUR, dayInMs, getLastEvent } from 'ontime-utils';
+import { memo, useMemo, useRef } from 'react';
 
 import useHorizontalFollowComponent from '../../common/hooks/useHorizontalFollowComponent';
 import { ExtendedEntry } from '../../common/utils/rundownMetadata';
 import { cx } from '../../common/utils/styleUtils';
 import { getPropertyValue } from '../common/viewUtils';
-
 import TimelineMarkers from './timeline-markers/TimelineMarkers';
 import { useTimelineOptions } from './timeline.options';
 import { calculateTimelineLayout, getEndHour, getStartHour } from './timeline.utils';

apps/client/src/views/timeline/TimelineEntry.tsx

@@ -1,12 +1,11 @@
-import { RefObject } from 'react';
 import { Day } from 'ontime-types';
+import { CSSProperties, RefObject } from 'react';
 
 import { useExpectedStartData, useTimer } from '../../common/hooks/useSocket';
 import { getProgress } from '../../common/utils/getProgress';
 import { alpha, cx } from '../../common/utils/styleUtils';
 import { formatDuration, formatTime, getExpectedTimesFromExtendedEvent } from '../../common/utils/time';
 import { useTranslation } from '../../translation/TranslationProvider';
-
 import { getStatusLabel } from './timeline.utils';
 
 import style from './Timeline.module.scss';
@@ -64,21 +63,25 @@ export function TimelineEntry({
     <div
       ref={ref}
       className={cx([style.column, smallArea && style.smallArea])}
-      style={{
-        '--color': colour,
-        '--lighter': lighterColour ?? '',
-        left: `${left}px`,
-        width: `${width}px`,
-      }}
+      style={
+        {
+          '--color': colour,
+          '--lighter': lighterColour ?? '',
+          left: `${left}px`,
+          width: `${width}px`,
+        } as CSSProperties
+      }
       data-testid={cue}
     >
       {status === 'live' ? <ActiveBlock /> : <div data-status={status} className={style.timelineBlock} />}
       <div
         className={cx([style.content, width < 20 && style.hide, !hasLink && style.separeLeft])}
         data-status={status}
-        style={{
-          '--color': colour,
-        }}
+        style={
+          {
+            '--color': colour,
+          } as CSSProperties
+        }
       >
         <div className={style.maybeInline}>
           <div className={cx([hasDelay && style.cross])}>{formattedStartTime}</div>
@@ -160,5 +163,7 @@ function TimelineEntryStatus({
 function ActiveBlock() {
   const { current, duration } = useTimer();
   const progress = getProgress(current, duration);
-  return <div data-status='live' className={style.timelineBlock} style={{ '--progress': `${progress}%` }} />;
+  return (
+    <div data-status='live' className={style.timelineBlock} style={{ '--progress': `${progress}%` } as CSSProperties} />
+  );
 }

apps/client/src/views/timeline/TimelinePage.tsx

@@ -1,5 +1,5 @@
-import { useMemo } from 'react';
 import { OntimeView } from 'ontime-types';
+import { useMemo } from 'react';
 
 import EmptyPage from '../../common/components/state/EmptyPage';
 import ViewLogo from '../../common/components/view-logo/ViewLogo';
@@ -10,7 +10,6 @@ import { formatTime, getDefaultFormat } from '../../common/utils/time';
 import { useTranslation } from '../../translation/TranslationProvider';
 import Loader from '../common/loader/Loader';
 import SuperscriptTime from '../common/superscript-time/SuperscriptTime';
-
 import Timeline from './Timeline';
 import { getTimelineOptions, useTimelineOptions } from './timeline.options';
 import { getUpcomingEvents, useScopedRundown } from './timeline.utils';

apps/client/src/views/timeline/TimelineSections.tsx

@@ -6,7 +6,6 @@ import { ExtendedEntry } from '../../common/utils/rundownMetadata';
 import { formatDuration, getExpectedTimesFromExtendedEvent } from '../../common/utils/time';
 import { useTranslation } from '../../translation/TranslationProvider';
 import { getPropertyValue } from '../common/viewUtils';
-
 import TimelineSection from './timeline-section/TimelineSection';
 
 interface TimelineSectionsProps {

apps/client/src/views/timeline/timeline-section/TimelineSection.tsx

@@ -1,5 +1,5 @@
-import { memo } from 'react';
 import { MaybeString } from 'ontime-types';
+import { memo } from 'react';
 
 import { cx } from '../../../common/utils/styleUtils';
 

apps/client/src/views/timeline/timeline.options.ts

@@ -1,6 +1,6 @@
+import { CustomFields, OntimeEvent } from 'ontime-types';
 import { use, useMemo } from 'react';
 import { useSearchParams } from 'react-router';
-import { CustomFields, OntimeEvent } from 'ontime-types';
 
 import { getTimeOption } from '../../common/components/view-params-editor/common.options';
 import { OptionTitle } from '../../common/components/view-params-editor/constants';

apps/client/src/views/timeline/timeline.utils.ts

@@ -1,19 +1,18 @@
-import { useMemo } from 'react';
-import { isOntimeEvent, isPlayableEvent, MaybeString, OntimeEntry, OntimeEvent, PlayableEvent } from 'ontime-types';
+import { MaybeString, OntimeEntry, OntimeEvent, PlayableEvent, isOntimeEvent, isPlayableEvent } from 'ontime-types';
 import {
+  MILLIS_PER_HOUR,
+  MILLIS_PER_MINUTE,
   dayInMs,
   getEventWithId,
   getFirstEvent,
   getNextEvent,
   getTimeFrom,
   isNewLatest,
-  MILLIS_PER_HOUR,
-  MILLIS_PER_MINUTE,
 } from 'ontime-utils';
+import { useMemo } from 'react';
 
 import { ExtendedEntry } from '../../common/utils/rundownMetadata';
 import { formatDuration } from '../../common/utils/time';
-
 import { useTimelineOptions } from './timeline.options';
 import type { ProgressStatus } from './TimelineEntry';
 

apps/client/src/views/timeline/useTimelineData.ts

@@ -5,7 +5,7 @@ import useProjectData from '../../common/hooks-query/useProjectData';
 import { useFlatRundownWithMetadata } from '../../common/hooks-query/useRundown';
 import useSettings from '../../common/hooks-query/useSettings';
 import { ExtendedEntry } from '../../common/utils/rundownMetadata';
-import { aggregateQueryStatus, ViewData } from '../utils/viewLoader.utils';
+import { ViewData, aggregateQueryStatus } from '../utils/viewLoader.utils';
 
 export interface TimelineData {
   events: ExtendedEntry<OntimeEntry>[];