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>
2026-08-17 05:13:32 +00:00 · 2026-03-08 16:22:12 +01:00
parent 9516ac21bb
commit 1849b4d39f
501 changed files with 2678 additions and 4654 deletions
@@ -1,7 +1,8 @@
 import { ErrorBoundary } from '@sentry/react';

 import { useKeyDown } from '../../common/hooks/useKeyDown';
-
+import PanelContent from './panel-content/PanelContent';
+import PanelList from './panel-list/PanelList';
 import AboutPanel from './panel/about-panel/AboutPanel';
 import AutomationPanel from './panel/automations-panel/AutomationPanel';
 import FeaturePanel from './panel/feature-panel/FeaturePanel';
@@ -10,8 +11,6 @@ import NetworkLogPanel from './panel/network-panel/NetworkLogPanel';
 import ProjectPanel from './panel/project-panel/ProjectPanel';
 import SettingsPanel from './panel/settings-panel/SettingsPanel';
 import ShutdownPanel from './panel/shutdown-panel/ShutdownPanel';
-import PanelContent from './panel-content/PanelContent';
-import PanelList from './panel-list/PanelList';
 import useAppSettingsNavigation from './useAppSettingsNavigation';

 import style from './AppSettings.module.scss';
@@ -59,7 +59,9 @@ function PanelListItem(props: PanelListItemProps) {
        key={panel.id}
        onClick={() => setLocation(panel.id as SettingsOptionId)}
        onKeyDown={(event) => {
-          isKeyEnter(event) && setLocation(panel.id as SettingsOptionId);
+          if (isKeyEnter(event)) {
+            setLocation(panel.id as SettingsOptionId);
+          }
        }}
        className={classes}
        tabIndex={0}
@@ -75,7 +77,9 @@ function PanelListItem(props: PanelListItemProps) {
            key={secondary.id + index}
            onClick={() => setLocation(secondary.id as SettingsOptionId)}
            onKeyDown={(event) => {
-              isKeyEnter(event) && setLocation(secondary.id as SettingsOptionId);
+              if (isKeyEnter(event)) {
+                setLocation(secondary.id as SettingsOptionId);
+              }
            }}
            className={secondaryClasses}
            role='button'
@@ -9,7 +9,6 @@ import {
  websiteUrl,
 } from '../../../../externals';
 import * as Panel from '../../panel-utils/PanelUtils';
-
 import AppVersion from './AppVersion';

 export default function AboutPanel() {
@@ -1,16 +1,16 @@
-import { useEffect, useMemo } from 'react';
-import { useFieldArray, useForm } from 'react-hook-form';
-import { IoAdd, IoTrash } from 'react-icons/io5';
 import {
  Automation,
  AutomationDTO,
  HTTPOutput,
-  isHTTPOutput,
-  isOntimeAction,
-  isOSCOutput,
-  OntimeAction,
  OSCOutput,
+  OntimeAction,
+  isHTTPOutput,
+  isOSCOutput,
+  isOntimeAction,
 } from 'ontime-types';
+import { useEffect, useMemo } from 'react';
+import { useFieldArray, useForm } from 'react-hook-form';
+import { IoAdd, IoTrash } from 'react-icons/io5';

 import { addAutomation, editAutomation, testOutput } from '../../../../common/api/automation';
 import { maybeAxiosError } from '../../../../common/api/utils';
@@ -27,10 +27,9 @@ import useCustomFields from '../../../../common/hooks-query/useCustomFields';
 import { preventEscape } from '../../../../common/utils/keyEvent';
 import { startsWithHttp } from '../../../../common/utils/regex';
 import * as Panel from '../../panel-utils/PanelUtils';
-
-import TemplateInput from './template-input/TemplateInput';
 import { isAutomation, makeFieldList } from './automationUtils';
 import OntimeActionForm from './OntimeActionForm';
+import TemplateInput from './template-input/TemplateInput';

 import style from './AutomationForm.module.scss';

@@ -1,8 +1,7 @@
-import useScrollIntoView from '../../../../common/hooks/useScrollIntoView';
 import useAutomationSettings from '../../../../common/hooks-query/useAutomationSettings';
+import useScrollIntoView from '../../../../common/hooks/useScrollIntoView';
 import type { PanelBaseProps } from '../../panel-list/PanelList';
 import * as Panel from '../../panel-utils/PanelUtils';
-
 import AutomationSettingsForm from './AutomationSettingsForm';
 import AutomationsList from './AutomationsList';
 import TriggersList from './TriggersList';
@@ -1,6 +1,6 @@
+import { AutomationDTO, NormalisedAutomation } from 'ontime-types';
 import { Fragment, useState } from 'react';
 import { IoAdd, IoPencil, IoTrash } from 'react-icons/io5';
-import { AutomationDTO, NormalisedAutomation } from 'ontime-types';

 import { deleteAutomation } from '../../../../common/api/automation';
 import { maybeAxiosError } from '../../../../common/api/utils';
@@ -9,7 +9,6 @@ import IconButton from '../../../../common/components/buttons/IconButton';
 import Tag from '../../../../common/components/tag/Tag';
 import useAutomationSettings from '../../../../common/hooks-query/useAutomationSettings';
 import * as Panel from '../../panel-utils/PanelUtils';
-
 import AutomationForm from './AutomationForm';

 const automationPlaceholder: AutomationDTO = {
@@ -1,6 +1,6 @@
+import { AutomationDTO, OntimeAction, OntimeActionKey, SecondarySource } from 'ontime-types';
 import { PropsWithChildren, useState } from 'react';
 import { UseFormRegister, UseFormSetValue, UseFormWatch } from 'react-hook-form';
-import { AutomationDTO, OntimeAction, OntimeActionKey, SecondarySource } from 'ontime-types';

 import Input from '../../../../common/components/input/input/Input';
 import Select from '../../../../common/components/select/Select';
@@ -1,6 +1,6 @@
+import { NormalisedAutomation, TimerLifeCycle, TriggerDTO } from 'ontime-types';
 import { useEffect } from 'react';
 import { useForm } from 'react-hook-form';
-import { NormalisedAutomation, TimerLifeCycle, TriggerDTO } from 'ontime-types';

 import { addTrigger, editTrigger } from '../../../../common/api/automation';
 import { maybeAxiosError } from '../../../../common/api/utils';
@@ -9,7 +9,6 @@ import Input from '../../../../common/components/input/input/Input';
 import Select from '../../../../common/components/select/Select';
 import { preventEscape } from '../../../../common/utils/keyEvent';
 import * as Panel from '../../panel-utils/PanelUtils';
-
 import { cycles } from './automationUtils';

 interface TriggerFormProps {
@@ -1,13 +1,12 @@
+import { NormalisedAutomation, Trigger } from 'ontime-types';
 import { Fragment, useMemo, useState } from 'react';
 import { IoAdd } from 'react-icons/io5';
-import { NormalisedAutomation, Trigger } from 'ontime-types';

 import { deleteTrigger } from '../../../../common/api/automation';
 import { maybeAxiosError } from '../../../../common/api/utils';
 import Button from '../../../../common/components/buttons/Button';
 import useAutomationSettings from '../../../../common/hooks-query/useAutomationSettings';
 import * as Panel from '../../panel-utils/PanelUtils';
-
 import { checkDuplicates } from './automationUtils';
 import AutomationForm from './TriggerForm';
 import TriggersListItem from './TriggersListItem';
@@ -1,11 +1,10 @@
+import { NormalisedAutomation, TimerLifeCycle } from 'ontime-types';
 import { useState } from 'react';
 import { IoPencil, IoTrash, IoWarningOutline } from 'react-icons/io5';
-import { NormalisedAutomation, TimerLifeCycle } from 'ontime-types';

 import IconButton from '../../../../common/components/buttons/IconButton';
 import Tag from '../../../../common/components/tag/Tag';
 import * as Panel from '../../panel-utils/PanelUtils';
-
 import { cycles } from './automationUtils';
 import AutomationForm from './TriggerForm';

@@ -1,9 +1,8 @@
-import { forwardRef, useMemo, useState } from 'react';
 import { mergeRefs, useClickOutside } from '@mantine/hooks';
+import { forwardRef, useMemo, useState } from 'react';

 import Input, { type InputProps } from '../../../../../common/components/input/input/Input';
 import useCustomFields from '../../../../../common/hooks-query/useCustomFields';
-
 import { makeAutoCompleteList, matchRemaining, selectFromLastTemplate } from './templateInput.utils';

 import style from './TemplateInput.module.scss';
@@ -4,7 +4,6 @@ import GenerateLinkFormExport from '../../../sharing/GenerateLinkFormExport';
 import type { PanelBaseProps } from '../../panel-list/PanelList';
 import * as Panel from '../../panel-utils/PanelUtils';
 import InfoNif from '../network-panel/NetworkInterfaces';
-
 import ReportSettings from './ReportSettings';
 import URLPresets from './URLPresets';

@@ -9,7 +9,6 @@ import useRundown from '../../../../common/hooks-query/useRundown';
 import { cx } from '../../../../common/utils/styleUtils';
 import { formatTime } from '../../../../common/utils/time';
 import * as Panel from '../../panel-utils/PanelUtils';
-
 import { CombinedReport, getCombinedReport, makeReportCSV } from './reportSettings.utils';

 import style from './ReportSettings.module.scss';
@@ -1,6 +1,6 @@
+import { URLPreset } from 'ontime-types';
 import { useState } from 'react';
 import { IoAdd, IoOpenOutline, IoPencil, IoTrash } from 'react-icons/io5';
-import { URLPreset } from 'ontime-types';

 import Button from '../../../../common/components/buttons/Button';
 import IconButton from '../../../../common/components/buttons/IconButton';
@@ -11,7 +11,6 @@ import Tag from '../../../../common/components/tag/Tag';
 import useUrlPresets, { useUpdateUrlPreset } from '../../../../common/hooks-query/useUrlPresets';
 import { handleLinks } from '../../../../common/utils/linkUtils';
 import * as Panel from '../../panel-utils/PanelUtils';
-
 import URLPresetForm from './composite/URLPresetForm';

 type FormState = {
@@ -6,4 +6,4 @@
  display: flex;
  flex-direction: column;
  gap: 1rem;
-}
+}
@@ -1,6 +1,6 @@
+import { OntimeView, OntimeViewPresettable, URLPreset } from 'ontime-types';
 import { useEffect, useRef } from 'react';
 import { useForm } from 'react-hook-form';
-import { OntimeView, OntimeViewPresettable, URLPreset } from 'ontime-types';

 import { maybeAxiosError, unwrapError } from '../../../../../common/api/utils';
 import Button from '../../../../../common/components/buttons/Button';
@@ -1,4 +1,4 @@
-import { EntryId, isOntimeEvent, MaybeNumber, OntimeReport, RundownEntries } from 'ontime-types';
+import { EntryId, MaybeNumber, OntimeReport, RundownEntries, isOntimeEvent } from 'ontime-types';

 import { makeCSVFromArrayOfArrays } from '../../../../common/utils/csv';
 import { formatTime } from '../../../../common/utils/time';
@@ -1,6 +1,6 @@
+import { CustomField, CustomFieldKey } from 'ontime-types';
 import { useState } from 'react';
 import { IoAdd } from 'react-icons/io5';
-import { CustomField, CustomFieldKey } from 'ontime-types';

 import { deleteCustomField, editCustomField, postCustomField } from '../../../../common/api/customFields';
 import Button from '../../../../common/components/buttons/Button';
@@ -10,7 +10,6 @@ import ExternalLink from '../../../../common/components/link/external-link/Exter
 import useCustomFields from '../../../../common/hooks-query/useCustomFields';
 import { customFieldsDocsUrl } from '../../../../externals';
 import * as Panel from '../../panel-utils/PanelUtils';
-
 import CustomFieldEntry from './composite/CustomFieldEntry';
 import CustomFieldForm from './composite/CustomFieldForm';

@@ -1,11 +1,10 @@
 import useScrollIntoView from '../../../../common/hooks/useScrollIntoView';
 import type { PanelBaseProps } from '../../panel-list/PanelList';
 import * as Panel from '../../panel-utils/PanelUtils';
-
-import SourcesPanel from './sources-panel/SourcesPanel';
 import CustomFieldSettings from './CustomFields';
 import ManageRundowns from './ManageRundowns';
 import RundownDefaultSettings from './RundownDefaultSettings';
+import SourcesPanel from './sources-panel/SourcesPanel';

 export default function ManagePanel({ location }: PanelBaseProps) {
  const defaultsRef = useScrollIntoView<HTMLDivElement>('defaults', location);
@@ -1,3 +1,4 @@
+import { useDisclosure } from '@mantine/hooks';
 import { useState } from 'react';
 import {
  IoAdd,
@@ -8,7 +9,6 @@ import {
  IoPencilOutline,
  IoTrash,
 } from 'react-icons/io5';
-import { useDisclosure } from '@mantine/hooks';

 import { downloadAsExcel } from '../../../../common/api/excel';
 import { maybeAxiosError } from '../../../../common/api/utils';
@@ -20,7 +20,6 @@ import Tag from '../../../../common/components/tag/Tag';
 import { useMutateProjectRundowns, useProjectRundowns } from '../../../../common/hooks-query/useProjectRundowns';
 import { cx } from '../../../../common/utils/styleUtils';
 import * as Panel from '../../panel-utils/PanelUtils';
-
 import RundownRenameForm from './composite/RundownRenameForm';
 import { ManageRundownForm } from './ManageRundownForm';

@@ -1,4 +1,4 @@
-import { EndAction, TimerType, TimeStrategy } from 'ontime-types';
+import { EndAction, TimeStrategy, TimerType } from 'ontime-types';
 import { parseUserTime } from 'ontime-utils';

 import TimeInput from '../../../../common/components/input/time-input/TimeInput';
@@ -1,13 +1,12 @@
+import { CustomField, CustomFieldKey } from 'ontime-types';
 import { useState } from 'react';
 import { IoPencil, IoTrash } from 'react-icons/io5';
-import { CustomField, CustomFieldKey } from 'ontime-types';

 import IconButton from '../../../../../common/components/buttons/IconButton';
 import CopyTag from '../../../../../common/components/copy-tag/CopyTag';
 import Swatch from '../../../../../common/components/input/colour-input/Swatch';
 import Tag from '../../../../../common/components/tag/Tag';
 import * as Panel from '../../../panel-utils/PanelUtils';
-
 import CustomFieldForm from './CustomFieldForm';

 import style from '../ManagePanel.module.scss';
@@ -1,7 +1,7 @@
-import { useEffect, useState } from 'react';
-import { useForm } from 'react-hook-form';
 import { CustomField } from 'ontime-types';
 import { checkRegex, customFieldLabelToKey } from 'ontime-utils';
+import { useEffect, useState } from 'react';
+import { useForm } from 'react-hook-form';

 import { maybeAxiosError } from '../../../../../common/api/utils';
 import Button from '../../../../../common/components/buttons/Button';
@@ -1,6 +1,6 @@
+import { checkRegex } from 'ontime-utils';
 import { useEffect } from 'react';
 import { useForm } from 'react-hook-form';
-import { checkRegex } from 'ontime-utils';

 import { maybeAxiosError } from '../../../../../common/api/utils';
 import Button from '../../../../../common/components/buttons/Button';
@@ -6,9 +6,8 @@ const googleSheetDocsUrl = 'https://docs.getontime.no/features/import-spreadshee
 export default function GSheetInfo() {
  return (
    <Info>
-      Ontime can import data from spreadsheets by: <br />
-      - importing the spreadsheet file in Ontime <br />
-      - synchronising your project with a Google Sheet
+      Ontime can import data from spreadsheets by: <br />- importing the spreadsheet file in Ontime <br />-
+      synchronising your project with a Google Sheet
      <br />
      <br />
      To synchronise with a Google Sheet, you will need to allow Ontime to authenticate with your Google account.
@@ -8,7 +8,6 @@ import CopyTag from '../../../../../common/components/copy-tag/CopyTag';
 import Input from '../../../../../common/components/input/input/Input';
 import { openLink } from '../../../../../common/utils/linkUtils';
 import * as Panel from '../../../panel-utils/PanelUtils';
-
 import useGoogleSheet from './useGoogleSheet';
 import { useSheetStore } from './useSheetStore';

@@ -1,12 +1,11 @@
-import { useState } from 'react';
 import { CustomFields, Rundown, RundownSummary } from 'ontime-types';
 import { millisToString } from 'ontime-utils';
+import { useState } from 'react';

 import Button from '../../../../../common/components/buttons/Button';
 import useRundown from '../../../../../common/hooks-query/useRundown';
 import { formatDuration } from '../../../../../common/utils/time';
 import * as Panel from '../../../panel-utils/PanelUtils';
-
 import PreviewSpreadsheet from './preview/PreviewRundown';
 import useGoogleSheet from './useGoogleSheet';
 import { useSheetStore } from './useSheetStore';
@@ -1,6 +1,6 @@
+import { ImportMap, getErrorMessage } from 'ontime-utils';
 import { ChangeEvent, useRef, useState } from 'react';
 import { IoCloudOutline, IoDownloadOutline } from 'react-icons/io5';
-import { getErrorMessage, ImportMap } from 'ontime-utils';

 import {
  importRundownPreview as importRundownPreviewExcel,
@@ -12,10 +12,9 @@ import Button from '../../../../../common/components/buttons/Button';
 import * as Editor from '../../../../../common/components/editor-utils/EditorUtils';
 import { validateExcelImport } from '../../../../../common/utils/uploadUtils';
 import * as Panel from '../../../panel-utils/PanelUtils';
-
-import ImportMapForm from './import-map/ImportMapForm';
 import GSheetInfo from './GSheetInfo';
 import GSheetSetup from './GSheetSetup';
+import ImportMapForm from './import-map/ImportMapForm';
 import ImportReview from './ImportReview';
 import useGoogleSheet from './useGoogleSheet';
 import { useSheetStore } from './useSheetStore';
@@ -1,7 +1,7 @@
+import { ImportMap, checkRegex } from 'ontime-utils';
 import { useEffect, useState } from 'react';
 import { useFieldArray, useForm } from 'react-hook-form';
 import { IoAdd, IoTrash } from 'react-icons/io5';
-import { checkRegex, ImportMap } from 'ontime-utils';

 import Button from '../../../../../../common/components/buttons/Button';
 import IconButton from '../../../../../../common/components/buttons/IconButton';
@@ -12,8 +12,7 @@ import Tooltip from '../../../../../../common/components/tooltip/Tooltip';
 import * as Panel from '../../../../panel-utils/PanelUtils';
 import useGoogleSheet from '../useGoogleSheet';
 import { useSheetStore } from '../useSheetStore';
-
-import { convertToImportMap, getPersistedOptions, NamedImportMap, persistImportMap } from './importMapUtils';
+import { NamedImportMap, convertToImportMap, getPersistedOptions, persistImportMap } from './importMapUtils';

 import style from '../SourcesPanel.module.scss';

@@ -1,6 +1,6 @@
 import { ImportCustom } from 'ontime-utils';

-import { convertToImportMap, NamedImportMap } from '../importMapUtils';
+import { NamedImportMap, convertToImportMap } from '../importMapUtils';

 describe('convertToImportMap', () => {
  it('converts a namedImportMap to a importMap', () => {
@@ -1,7 +1,7 @@
+import { CustomFields, Rundown, isOntimeEvent, isOntimeGroup, isOntimeMilestone } from 'ontime-types';
+import { millisToString } from 'ontime-utils';
 import { Fragment } from 'react';
 import { IoLink } from 'react-icons/io5';
-import { CustomFields, isOntimeEvent, isOntimeGroup, isOntimeMilestone, Rundown } from 'ontime-types';
-import { millisToString } from 'ontime-utils';

 import Tag from '../../../../../../common/components/tag/Tag';
 import { getAccessibleColour } from '../../../../../../common/utils/styleUtils';
@@ -12,7 +12,6 @@ import {
  verifyAuthenticationStatus,
 } from '../../../../../common/api/sheets';
 import { maybeAxiosError } from '../../../../../common/api/utils';
-
 import { useSheetStore } from './useSheetStore';

 export default function useGoogleSheet() {
@@ -1,5 +1,5 @@
 import { AuthenticationStatus, CustomFields, Rundown, RundownSummary } from 'ontime-types';
-import { defaultImportMap, ImportMap } from 'ontime-utils';
+import { ImportMap, defaultImportMap } from 'ontime-utils';
 import { create } from 'zustand';

 type SheetStore = {
@@ -1,5 +1,5 @@
-import { useEffect } from 'react';
 import { MessageTag } from 'ontime-types';
+import { useEffect } from 'react';

 import useScrollIntoView from '../../../../common/hooks/useScrollIntoView';
 import { usePing } from '../../../../common/hooks/useSocket';
@@ -7,7 +7,6 @@ import { sendSocket } from '../../../../common/utils/socket';
 import { isDocker } from '../../../../externals';
 import type { PanelBaseProps } from '../../panel-list/PanelList';
 import * as Panel from '../../panel-utils/PanelUtils';
-
 import ClientControlPanel from './client-control/ClientControlPanel';
 import LogExport from './NetworkLogExport';

@@ -12,7 +12,7 @@
 }

 .copiable {
-  cursor: text  ;
+  cursor: text;
  user-select: text;
 }

@@ -1,5 +1,4 @@
 import * as Panel from '../../../panel-utils/PanelUtils';
-
 import ClientList from './ClientList';

 export default function ClientControlPanel() {
@@ -1,6 +1,6 @@
-import { useState } from 'react';
 import { useDisclosure } from '@mantine/hooks';
 import { Client } from 'ontime-types';
+import { useState } from 'react';

 import Button from '../../../../../common/components/buttons/Button';
 import { RedirectClientModal } from '../../../../../common/components/client-modal/RedirectClientModal';
@@ -7,7 +7,6 @@ import { invalidateAllCaches, maybeAxiosError } from '../../../../common/api/uti
 import Button from '../../../../common/components/buttons/Button';
 import { validateProjectFile } from '../../../../common/utils/uploadUtils';
 import * as Panel from '../../panel-utils/PanelUtils';
-
 import ProjectCreateForm from './ProjectCreateForm';
 import ProjectList from './ProjectList';

@@ -4,7 +4,6 @@ import { IoArrowDown, IoArrowUp } from 'react-icons/io5';
 import Info from '../../../../common/components/info/Info';
 import { ProjectSortMode, useOrderedProjectList } from '../../../../common/hooks-query/useProjectList';
 import * as Panel from '../../panel-utils/PanelUtils';
-
 import ProjectListItem, { EditMode } from './ProjectListItem';

 import style from './ProjectPanel.module.scss';
@@ -20,7 +20,6 @@ import IconButton from '../../../../common/components/buttons/IconButton';
 import { DropdownMenu } from '../../../../common/components/dropdown-menu/DropdownMenu';
 import { cx } from '../../../../common/utils/styleUtils';
 import * as Panel from '../../panel-utils/PanelUtils';
-
 import ProjectForm, { ProjectFormValues } from './ProjectForm';
 import ProjectMergeForm from './ProjectMergeForm';

@@ -1,6 +1,6 @@
+import { useQueryClient } from '@tanstack/react-query';
 import { useState } from 'react';
 import { useForm } from 'react-hook-form';
-import { useQueryClient } from '@tanstack/react-query';

 import { PROJECT_DATA } from '../../../../common/api/constants';
 import { getDb, patchData } from '../../../../common/api/db';
@@ -10,7 +10,6 @@ import Info from '../../../../common/components/info/Info';
 import Switch from '../../../../common/components/switch/Switch';
 import { cx } from '../../../../common/utils/styleUtils';
 import * as Panel from '../../panel-utils/PanelUtils';
-
 import { makeProjectPatch } from './project.utils';

 import style from './ProjectPanel.module.scss';
@@ -58,4 +58,4 @@
 .empty {
  height: 300px;
  position: relative;
-}
+}
@@ -3,7 +3,6 @@ import type { PanelBaseProps } from '../../panel-list/PanelList';
 import * as Panel from '../../panel-utils/PanelUtils';
 import QuickStart from '../../quick-start/QuickStart';
 import type { SettingsOptionId } from '../../useAppSettingsMenu';
-
 import ManageProjects from './ManageProjects';

 interface ProjectPanelProps extends PanelBaseProps {
@@ -1,7 +1,7 @@
-import { lazy, useEffect } from 'react';
-import { useForm } from 'react-hook-form';
 import { useDisclosure } from '@mantine/hooks';
 import { Settings } from 'ontime-types';
+import { lazy, useEffect } from 'react';
+import { useForm } from 'react-hook-form';

 import { postSettings } from '../../../../common/api/settings';
 import { maybeAxiosError } from '../../../../common/api/utils';
@@ -11,7 +11,6 @@ import Select from '../../../../common/components/select/Select';
 import useSettings from '../../../../common/hooks-query/useSettings';
 import { preventEscape } from '../../../../common/utils/keyEvent';
 import * as Panel from '../../panel-utils/PanelUtils';
-
 import GeneralPinInput from './composite/GeneralPinInput';

 const TranslationModal = lazy(() => import('./composite/CustomTranslationModal'));
@@ -1,7 +1,7 @@
+import { type ProjectData } from 'ontime-types';
 import { ChangeEvent, useEffect, useRef } from 'react';
 import { useFieldArray, useForm } from 'react-hook-form';
 import { IoAdd, IoDownloadOutline, IoTrash } from 'react-icons/io5';
-import { type ProjectData } from 'ontime-types';

 import { projectLogoPath } from '../../../../common/api/constants';
 import { uploadProjectLogo } from '../../../../common/api/project';
@@ -1,6 +1,6 @@
+import { PortInfo } from 'ontime-types';
 import { useCallback, useEffect, useState } from 'react';
 import { useForm } from 'react-hook-form';
-import { PortInfo } from 'ontime-types';

 import { getServerPort, postServerPort } from '../../../../common/api/settings';
 import { maybeAxiosError } from '../../../../common/api/utils';
@@ -2,7 +2,6 @@ import useScrollIntoView from '../../../../common/hooks/useScrollIntoView';
 import { isDocker } from '../../../../externals';
 import type { PanelBaseProps } from '../../panel-list/PanelList';
 import * as Panel from '../../panel-utils/PanelUtils';
-
 import GeneralSettings from './GeneralSettings';
 import ProjectData from './ProjectData';
 import ServerPortSettings from './ServerPortSettings';
@@ -1,7 +1,7 @@
-import { useEffect } from 'react';
-import { useForm } from 'react-hook-form';
 import { useDisclosure } from '@mantine/hooks';
 import { ViewSettings as ViewSettingsType } from 'ontime-types';
+import { useEffect } from 'react';
+import { useForm } from 'react-hook-form';

 import { maybeAxiosError } from '../../../../common/api/utils';
 import Button from '../../../../common/components/buttons/Button';
@@ -12,7 +12,6 @@ import Switch from '../../../../common/components/switch/Switch';
 import useViewSettings from '../../../../common/hooks-query/useViewSettings';
 import { preventEscape } from '../../../../common/utils/keyEvent';
 import * as Panel from '../../panel-utils/PanelUtils';
-
 import CodeEditorModal from './composite/StyleEditorModal';

 const cssOverrideDocsUrl = 'https://docs.getontime.no/features/custom-styling/';
@@ -1,6 +1,6 @@
+import { TranslationObject, langEn } from 'ontime-types';
 import { useMemo } from 'react';
 import { useForm } from 'react-hook-form';
-import { langEn, TranslationObject } from 'ontime-types';

 import { maybeAxiosError } from '../../../../../common/api/utils';
 import Button from '../../../../../common/components/buttons/Button';
@@ -1,7 +1,7 @@
+import { Settings } from 'ontime-types';
 import { PropsWithChildren, useState } from 'react';
 import { UseFormRegister } from 'react-hook-form';
 import { IoEyeOutline } from 'react-icons/io5';
-import { Settings } from 'ontime-types';

 import IconButton from '../../../../../common/components/buttons/IconButton';
 import Input from '../../../../../common/components/input/input/Input';
@@ -1,7 +1,6 @@
+import Prism from 'prismjs/components/prism-core';
 import { forwardRef, memo, useEffect, useImperativeHandle, useState } from 'react';
 import Editor from 'react-simple-code-editor';
-import Prism from 'prismjs/components/prism-core';
-
 import 'prismjs/components/prism-css';
 import 'prismjs/themes/prism-tomorrow.min.css';
 import style from './StyleEditor.module.scss';
@@ -4,7 +4,7 @@

 .right {
  align-self: end;
-  text-align: right
+  text-align: right;
 }

 .column {
@@ -1,4 +1,4 @@
-import { lazy, Suspense, useEffect, useRef, useState } from 'react';
+import { Suspense, lazy, useEffect, useRef, useState } from 'react';

 import { getCSSContents, postCSSContents, restoreCSSContents } from '../../../../../common/api/assets';
 import Button from '../../../../../common/components/buttons/Button';
@@ -1,5 +1,5 @@
-import { useRef } from 'react';
 import { useDisclosure } from '@mantine/hooks';
+import { useRef } from 'react';

 import Button from '../../../../common/components/buttons/Button';
 import Dialog from '../../../../common/components/dialog/Dialog';
@@ -1,6 +1,6 @@
-import { useForm } from 'react-hook-form';
 import { QuickStartData } from 'ontime-types';
 import { parseUserTime } from 'ontime-utils';
+import { useForm } from 'react-hook-form';

 import { quickProject } from '../../../common/api/db';
 import { invalidateAllCaches, maybeAxiosError } from '../../../common/api/utils';
@@ -11,7 +11,6 @@ import Modal from '../../../common/components/modal/Modal';
 import Select from '../../../common/components/select/Select';
 import { editorSettingsDefaults, useEditorSettings } from '../../../common/stores/editorSettings';
 import * as Panel from '../panel-utils/PanelUtils';
-
 import { quickStartDefaults } from './quickStart.utils';

 interface QuickStartProps {