fix test

* refactor: assign offsetClasses based on playback state

apps/cli/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@getontime/cli",
-    "version": "3.15.0",
+    "version": "3.16.1-alpha.2",
     "author": "Carlos Valente",
     "description": "Time keeping for live events",
     "repository": "https://github.com/cpvalente/ontime",

apps/client/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ontime-ui",
-  "version": "3.15.0",
+  "version": "3.16.1-alpha.2",
   "private": true,
   "type": "module",
   "dependencies": {
@@ -17,7 +17,7 @@
     "@table-nav/react": "^0.0.7",
     "@tanstack/react-query": "^5.62.7",
     "@tanstack/react-query-devtools": "^5.62.7",
-    "@tanstack/react-table": "^8.20.5",
+    "@tanstack/react-table": "^8.21.3",
     "autosize": "^6.0.1",
     "axios": "^1.2.0",
     "color": "^4.2.3",

apps/client/src/common/api/session.ts

@@ -20,8 +20,17 @@ export async function generateUrl(
   baseUrl: string,
   path: string,
   lock: boolean,
+  lockMainFields: boolean,
+  lockCustomFields: boolean,
   authenticate: boolean,
 ): Promise<string> {
-  const res = await axios.post(`${sessionPath}/url`, { baseUrl, path, lock, authenticate });
+  const res = await axios.post(`${sessionPath}/url`, {
+    baseUrl,
+    path,
+    lock,
+    lockMainFields,
+    lockCustomFields,
+    authenticate,
+  });
   return res.data.url;
 }

apps/client/src/common/components/input/auto-text-area/AutoTextArea.tsx

@@ -25,4 +25,4 @@ export const AutoTextArea = (props: TextareaProps & { inputref: RefObject<unknow
       {...props}
     />
   );
-};
+};

apps/client/src/common/models/ProjectData.ts

@@ -8,4 +8,5 @@ export const projectDataPlaceholder: ProjectData = {
   backstageUrl: '',
   backstageInfo: '',
   projectLogo: null,
+  custom: [],
 };

apps/client/src/common/utils/__tests__/urlPresets.test.ts

@@ -64,13 +64,13 @@ describe('getRouteFromPreset()', () => {
   describe('handle url sharing edge cases', () => {
     it('finds the correct preset when the url contains extra arguments', () => {
       const location = resolvePath('/demopage?locked=true&token=123');
-      expect(getRouteFromPreset(location, presets)?.startsWith('timer?user=guest&alias=demopage')).toBeTruthy()
-    })
+      expect(getRouteFromPreset(location, presets)?.startsWith('timer?user=guest&alias=demopage')).toBeTruthy();
+    });
 
     it('appends the feature params to the alias', () => {
       const location = resolvePath('/demopage?locked=true&token=123');
-      expect(getRouteFromPreset(location, presets)).toBe('timer?user=guest&alias=demopage&locked=true&token=123')
-    })
+      expect(getRouteFromPreset(location, presets)).toBe('timer?user=guest&alias=demopage&locked=true&token=123');
+    });
   });
 });
 
@@ -79,29 +79,30 @@ describe('generatePathFromPreset()', () => {
     ['timer?user=guest', 'demopage', 'timer?user=guest&alias=demopage'],
     ['timer?user=admin', 'demopage', 'timer?user=admin&alias=demopage'],
   ])('generates a path from a preset: %s', (path, alias, expected) => {
-    expect(generatePathFromPreset(path, alias, null, null)).toEqual(expected);
+    expect(generatePathFromPreset(path, alias, null, null, null, null)).toEqual(expected);
   });
 
   test('appends the feature params to the alias', () => {
-    expect(generatePathFromPreset('timer?user=guest', 'demopage', 'true', '123')).toBe('timer?user=guest&alias=demopage&locked=true&token=123');
+    expect(generatePathFromPreset('timer?user=guest', 'demopage', 'true', '123', null, null)).toBe(
+      'timer?user=guest&alias=demopage&locked=true&token=123',
+    );
   });
 });
 
 describe('arePathsEquivalent()', () => {
-  it("checks whether the paths match",  () => {
+  it('checks whether the paths match', () => {
     expect(arePathsEquivalent('demopage', 'timer')).toBeFalsy();
     expect(arePathsEquivalent('timer', 'timer')).toBeTruthy();
     expect(arePathsEquivalent('timer?user=guest', 'timer?user=guest')).toBeTruthy();
-  })
+  });
 
-  it("checks whether the params match",  () => {
+  it('checks whether the params match', () => {
     expect(arePathsEquivalent('timer?test=a', 'timer?test=b')).toBeFalsy();
     expect(arePathsEquivalent('timer?test=a', 'timer?test=a')).toBeTruthy();
-  })
+  });
 
-  it("considers edge cases for the url sharing feature",  () => {
+  it('considers edge cases for the url sharing feature', () => {
     expect(arePathsEquivalent('timer?test=a&locked=true=token=123', 'timer?test=b')).toBeFalsy();
     expect(arePathsEquivalent('timer?test=a&locked=true=token=123', 'timer?test=a')).toBeTruthy();
-  })
+  });
 });
-

apps/client/src/common/utils/urlPresets.ts

@@ -45,11 +45,14 @@ export function getRouteFromPreset(location: Path, urlPresets: URLPreset[]): str
   const locked = searchParams.get('locked');
   const token = searchParams.get('token');
 
+  const lmain = searchParams.get('lmain');
+  const lcustom = searchParams.get('lcustom');
+
   // we need to check if the whole url is an alias
   const foundPreset = urlPresets.find((preset) => preset.alias === removeTrailingSlash(currentURL) && preset.enabled);
   if (foundPreset) {
     // if so, we can redirect to the preset path
-    return generatePathFromPreset(foundPreset.pathAndParams, foundPreset.alias, locked, token);
+    return generatePathFromPreset(foundPreset.pathAndParams, foundPreset.alias, locked, token, lmain, lcustom);
   }
 
   // if the current url is not an alias, we check if the alias is in the search parameters
@@ -63,7 +66,7 @@ export function getRouteFromPreset(location: Path, urlPresets: URLPreset[]): str
   for (const preset of urlPresets) {
     // if the page has a known enabled alias, we check if we need to redirect
     if (preset.alias === presetOnPage && preset.enabled) {
-      const newPath = generatePathFromPreset(preset.pathAndParams, preset.alias, locked, token);
+      const newPath = generatePathFromPreset(preset.pathAndParams, preset.alias, locked, token, lmain, lcustom);
       if (!arePathsEquivalent(currentPath, newPath)) {
         // if current path is out of date
         // return new path so we can redirect
@@ -77,7 +80,14 @@ export function getRouteFromPreset(location: Path, urlPresets: URLPreset[]): str
 /**
  * Handles generating a path and search parameters from a preset
  */
-export function generatePathFromPreset(pathAndParams: string, alias: string, locked: string | null, token: string | null ): string {
+export function generatePathFromPreset(
+  pathAndParams: string,
+  alias: string,
+  locked: string | null,
+  token: string | null,
+  lmain: string | null,
+  lcustom: string | null,
+): string {
   const path = resolvePath(pathAndParams);
   const searchParams = new URLSearchParams(path.search);
 
@@ -93,6 +103,14 @@ export function generatePathFromPreset(pathAndParams: string, alias: string, loc
     searchParams.set('token', token);
   }
 
+  if (lmain) {
+    searchParams.set('lmain', lmain);
+  }
+
+  if (lcustom) {
+    searchParams.set('lcustom', lcustom);
+  }
+
   // return path concatenated without the leading slash
   return `${path.pathname}?${searchParams}`.substring(1);
 }
@@ -106,16 +124,16 @@ export function generatePathFromPreset(pathAndParams: string, alias: string, loc
 export function arePathsEquivalent(currentPath: string, newPath: string): boolean {
   const currentUrl = new URL(currentPath, document.location.origin);
   const newUrl = new URL(newPath, document.location.origin);
-  
+
   // check path
   if (currentUrl.pathname !== newUrl.pathname) {
-    return false
+    return false;
   }
 
   // check search params
   // if the params match, we dont need further checks
   if (currentUrl.searchParams.toString() === newUrl.searchParams.toString()) {
-    return true
+    return true;
   }
 
   // if there is no match, we check the edge cases for the url sharing feature

apps/client/src/declarations/declaration.d.ts

@@ -31,6 +31,8 @@ declare module '@tanstack/react-table' {
     options: {
       showDelayedTimes: boolean;
       hideTableSeconds: boolean;
+      allowMainEdits: boolean;
+      allowCustomEdits: boolean;
     };
   }
 }

apps/client/src/features/app-settings/panel/network-panel/GenerateLinkForm.tsx

@@ -20,6 +20,8 @@ interface GenerateLinkFormOptions {
   baseUrl: string;
   path: string;
   lock: boolean;
+  lockMainFields: boolean;
+  lockCustomFields: boolean;
   authenticate: boolean;
 }
 
@@ -35,13 +37,15 @@ export default function GenerateLinkForm() {
     handleSubmit,
     register,
     setError,
-    formState: { errors },
+    formState: { errors, dirtyFields },
   } = useForm<GenerateLinkFormOptions>({
     mode: 'onChange',
     defaultValues: {
       baseUrl: currentHostName,
       path: '',
       lock: false,
+      lockMainFields: false,
+      lockCustomFields: false,
       authenticate: false,
     },
     resetOptions: {
@@ -53,7 +57,14 @@ export default function GenerateLinkForm() {
     try {
       setFormState('loading');
       const baseUrl = linkToOtherHost(options.baseUrl);
-      const url = await generateUrl(baseUrl, options.path, options.lock, options.authenticate);
+      const url = await generateUrl(
+        baseUrl,
+        options.path,
+        options.lock,
+        options.lockMainFields,
+        options.lockCustomFields,
+        options.authenticate,
+      );
       await copyToClipboard(url);
       setUrl(url);
       setFormState('success');
@@ -119,6 +130,18 @@ export default function GenerateLinkForm() {
           />
           <Switch variant='ontime' size='lg' {...register('lock')} />
         </Panel.ListItem>
+        {dirtyFields.lock && (
+          <>
+            <Panel.ListItem>
+              <Panel.Field title='Lock main field edits' description='Prevent edits to main fields' />
+              <Switch variant='ontime' size='lg' {...register('lockMainFields')} />
+            </Panel.ListItem>
+            <Panel.ListItem>
+              <Panel.Field title='Lock custom field edits' description='Prevent edits to custom fields' />
+              <Switch variant='ontime' size='lg' {...register('lockCustomFields')} />
+            </Panel.ListItem>
+          </>
+        )}
         <Panel.ListItem>
           <Panel.Field title='Authenticate' description='Whether the URL should be pre-authenticated' />
           <Switch variant='ontime' size='lg' {...register('authenticate')} />

apps/client/src/features/app-settings/panel/project-panel/ProjectCreateForm.tsx

@@ -1,5 +1,6 @@
 import { useEffect, useState } from 'react';
-import { useForm } from 'react-hook-form';
+import { useFieldArray, useForm } from 'react-hook-form';
+import { IoTrash } from 'react-icons/io5';
 import { Button, Input, Textarea } from '@chakra-ui/react';
 import { useQueryClient } from '@tanstack/react-query';
 
@@ -23,6 +24,7 @@ type ProjectCreateFormValues = {
   publicUrl?: string;
   backstageInfo?: string;
   backstageUrl?: string;
+  custom?: { title: string; value: string }[];
 };
 
 export default function ProjectCreateForm(props: ProjectCreateFromProps) {
@@ -34,6 +36,7 @@ export default function ProjectCreateForm(props: ProjectCreateFromProps) {
   const {
     handleSubmit,
     register,
+    control,
     formState: { isSubmitting, isValid },
     setFocus,
   } = useForm<ProjectCreateFormValues>({
@@ -44,6 +47,11 @@ export default function ProjectCreateForm(props: ProjectCreateFromProps) {
     },
   });
 
+  const { fields, append, remove } = useFieldArray({
+    control,
+    name: 'custom',
+  });
+
   // set focus to first field
   useEffect(() => {
     setFocus('title');
@@ -59,6 +67,7 @@ export default function ProjectCreateForm(props: ProjectCreateFromProps) {
         ...values,
         filename,
       });
+
       await queryClient.invalidateQueries({ queryKey: PROJECT_LIST });
       onClose();
     } catch (error) {
@@ -66,6 +75,10 @@ export default function ProjectCreateForm(props: ProjectCreateFromProps) {
     }
   };
 
+  const handleAddCustom = () => {
+    append({ title: '', value: '' });
+  };
+
   return (
     <Panel.Section
       as='form'
@@ -151,6 +164,42 @@ export default function ProjectCreateForm(props: ProjectCreateFromProps) {
             {...register('backstageUrl')}
           />
         </label>
+        <Panel.Section>
+          <Panel.ListItem>
+            <Panel.Field title='Custom data' description='Add custom data for your project' />
+            <Button variant='ontime-subtle' onClick={handleAddCustom}>
+              +
+            </Button>
+          </Panel.ListItem>
+          {fields.map((field, idx) => (
+            <div key={field.id} className={style.customDataItem}>
+              <Panel.Paragraph>{idx + 1}.</Panel.Paragraph>
+              <label>
+                Title
+                <Input
+                  variant='ontime-filled'
+                  size='sm'
+                  placeholder={field.title}
+                  autoComplete='off'
+                  {...register(`custom.${idx}.title` as const)}
+                />
+              </label>
+              <label>
+                Value
+                <Input
+                  variant='ontime-filled'
+                  size='sm'
+                  placeholder={field.value}
+                  autoComplete='off'
+                  {...register(`custom.${idx}.value` as const)}
+                />
+              </label>
+              <Button variant='ontime-ghosted' onClick={() => remove(idx)}>
+                <IoTrash />
+              </Button>
+            </div>
+          ))}
+        </Panel.Section>
       </Panel.Section>
     </Panel.Section>
   );

apps/client/src/features/app-settings/panel/project-panel/ProjectData.tsx

@@ -1,6 +1,6 @@
 import { ChangeEvent, useEffect, useRef } from 'react';
-import { useForm } from 'react-hook-form';
-import { IoDownloadOutline, IoTrash } from 'react-icons/io5';
+import { useFieldArray, useForm } from 'react-hook-form';
+import { IoAdd, IoDownloadOutline, IoTrash } from 'react-icons/io5';
 import { Button, Input, Textarea } from '@chakra-ui/react';
 import { type ProjectData } from 'ontime-types';
 
@@ -25,6 +25,7 @@ export default function ProjectData() {
     formState: { isSubmitting, isValid, isDirty, errors },
     setError,
     watch,
+    control,
     setValue,
   } = useForm({
     defaultValues: data,
@@ -32,6 +33,12 @@ export default function ProjectData() {
     resetOptions: {
       keepDirtyValues: true,
     },
+    mode: 'onChange',
+  });
+
+  const { fields, append, remove } = useFieldArray({
+    control,
+    name: 'custom',
   });
 
   // reset form values if data changes
@@ -77,6 +84,10 @@ export default function ProjectData() {
     });
   };
 
+  const handleAddCustom = () => {
+    append({ title: '', value: '' });
+  };
+
   const onSubmit = async (formData: ProjectData) => {
     try {
       await postProjectData(formData);
@@ -231,6 +242,69 @@ export default function ProjectData() {
               {...register('backstageUrl')}
             />
           </label>
+          <Panel.Section style={{ marginTop: 0 }}>
+            <Panel.ListItem>
+              <Panel.Field title='Custom data' description='' />
+              <Button leftIcon={<IoAdd />} size='sm' variant='ontime-subtle' onClick={handleAddCustom}>
+                Add
+              </Button>
+            </Panel.ListItem>
+            {fields.length > 0 &&
+              fields.map((field, idx) => {
+                const rowErrors = errors.custom?.[idx] as
+                  | {
+                      title?: { message?: string };
+                      value?: { message?: string };
+                    }
+                  | undefined;
+                return (
+                  <div key={field.id} className={style.customDataItem}>
+                    <div>
+                      <div className={style.titleRow}>
+                        <label>
+                          Title
+                          <Input
+                            variant='ontime-filled'
+                            size='sm'
+                            defaultValue={field.title}
+                            placeholder='Title of your custom data'
+                            autoComplete='off'
+                            {...register(`custom.${idx}.title`, {
+                              required: { value: true, message: 'Field cannot be empty' },
+                            })}
+                          />
+                        </label>
+                        <Button
+                          size='sm'
+                          variant='ontime-subtle'
+                          color='#FA5656' // $red-500
+                          onClick={() => remove(idx)}
+                          leftIcon={<IoTrash />}
+                        >
+                          Delete Entry
+                        </Button>
+                      </div>
+                      {rowErrors?.title?.message && <Panel.Error>{rowErrors.title.message}</Panel.Error>}
+                    </div>
+                    <label>
+                      Value
+                      <Textarea
+                        variant='ontime-filled'
+                        resize='none'
+                        size='sm'
+                        defaultValue={field.value}
+                        autoComplete='off'
+                        placeholder='Text of your custom data'
+                        {...register(`custom.${idx}.value`, {
+                          required: { value: true, message: 'Field cannot be empty' },
+                        })}
+                      />
+                      {rowErrors?.value?.message && <Panel.Error>{rowErrors.value.message}</Panel.Error>}
+                    </label>
+                  </div>
+                );
+              })}
+          </Panel.Section>
         </Panel.Section>
       </Panel.Card>
     </Panel.Section>

apps/client/src/features/app-settings/panel/project-panel/ProjectPanel.module.scss

@@ -57,3 +57,18 @@
     height: auto;
   }
 }
+
+.customDataItem {
+  display: contents;
+  width: 100%;
+
+  .titleRow{
+    display: flex;
+    gap: 1rem;
+    align-items: end;
+
+    label {
+      flex: 1;
+    }
+  }
+}

apps/client/src/features/app-settings/panel/sources-panel/SourcesPanel.tsx

@@ -103,6 +103,7 @@ export default function SourcesPanel() {
   };
 
   const handleSubmitImportPreview = async (importMap: ImportMap) => {
+    setError(''); // to clear previous error
     if (importFlow === 'excel') {
       try {
         const previewData = await importRundownPreviewExcel(importMap);

apps/client/src/features/app-settings/panel/sources-panel/import-map/ImportMapForm.tsx

@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 import { useFieldArray, useForm } from 'react-hook-form';
 import { IoAdd, IoTrash } from 'react-icons/io5';
 import { Button, IconButton, Input, Select, Tooltip } from '@chakra-ui/react';
@@ -28,6 +28,7 @@ export default function ImportMapForm(props: ImportMapFormProps) {
     control,
     handleSubmit,
     register,
+    setValue,
     formState: { errors, isValid },
   } = useForm<NamedImportMap>({
     mode: 'onChange',
@@ -45,6 +46,14 @@ export default function ImportMapForm(props: ImportMapFormProps) {
 
   const [loading, setLoading] = useState<'' | 'export' | 'import'>('');
 
+  // Set first sheet as default worksheet when 'event schedule' sheet is not there
+  useEffect(() => {
+    if (!worksheetNames || worksheetNames.length === 0) return;
+    if (!worksheetNames.includes(namedImportMap.Worksheet)) {
+      setValue('Worksheet', worksheetNames[0], { shouldValidate: true, shouldDirty: true });
+    }
+  }, [worksheetNames, setValue, namedImportMap.Worksheet]);
+
   const handleExport = async (values: NamedImportMap) => {
     setLoading('export');
     const importMap = convertToImportMap(values);

apps/client/src/features/overview/Overview.module.scss

@@ -45,6 +45,10 @@
   @include ellipsis-overflow;
 }
 
+.offset {
+  color: $muted-gray;
+}
+
 .ahead {
   color: $playback-ahead;
 }

apps/client/src/features/overview/Overview.tsx

@@ -1,4 +1,5 @@
 import { memo, PropsWithChildren, ReactNode, useMemo } from 'react';
+import { Playback } from 'ontime-types';
 import { millisToString } from 'ontime-utils';
 
 import ErrorBoundary from '../../common/components/error-boundary/ErrorBoundary';
@@ -163,10 +164,10 @@ function ProgressOverview() {
 }
 
 function RuntimeOverview() {
-  const { clock, offset } = useRuntimePlaybackOverview();
+  const { clock, offset, playback } = useRuntimePlaybackOverview();
 
   const offsetText = getOffsetText(offset);
-  const offsetClasses = offset === null ? undefined : offset <= 0 ? style.behind : style.ahead;
+  const offsetClasses = cx([style.offset, playback !== Playback.Stop && (offset < 0 ? style.behind : style.ahead)]);
 
   return (
     <>

apps/client/src/views/cuesheet/CuesheetPage.tsx

@@ -16,7 +16,7 @@ import CuesheetDnd from './cuesheet-dnd/CuesheetDnd';
 import CuesheetProgress from './cuesheet-progress/CuesheetProgress';
 import { makeCuesheetColumns } from './cuesheet-table/cuesheet-table-elements/cuesheetCols';
 import CuesheetTable from './cuesheet-table/CuesheetTable';
-import { cuesheetOptions } from './cuesheet.options';
+import { cuesheetOptions, useCuesheetOptions } from './cuesheet.options';
 
 import styles from './CuesheetPage.module.scss';
 
@@ -28,8 +28,9 @@ export default function CuesheetPage() {
   const { isOpen: isMenuOpen, onOpen, onClose } = useDisclosure();
   const { isOpen: isEventEditorOpen, onOpen: onEventEditorOpen, onClose: onEventEditorClose } = useDisclosure();
   const [eventId, setEventId] = useState<string | null>(null);
+  const { hideCustom } = useCuesheetOptions();
 
-  const columns = useMemo(() => makeCuesheetColumns(customFields), [customFields]);
+  const columns = useMemo(() => makeCuesheetColumns(hideCustom ? {} : customFields), [customFields, hideCustom]);
 
   useWindowTitle('Cuesheet');
 

apps/client/src/views/cuesheet/__tests__/cuesheet.utils.test.ts

@@ -100,7 +100,7 @@ describe('makeTable()', () => {
         [
           "00:00:00",
           "00:00:00",
-          "...",
+          "",
           "",
           "",
           "",

apps/client/src/views/cuesheet/cuesheet-table/CuesheetTable.tsx

@@ -1,4 +1,5 @@
 import { useCallback, useRef } from 'react';
+import { useSearchParams } from 'react-router-dom';
 import { useTableNav } from '@table-nav/react';
 import { ColumnDef, getCoreRowModel, useReactTable } from '@tanstack/react-table';
 import { isOntimeEvent, MaybeString, OntimeEvent, OntimeRundown, OntimeRundownEntry, TimeField } from 'ontime-types';
@@ -25,6 +26,10 @@ export default function CuesheetTable(props: CuesheetTableProps) {
   const { data, columns, showModal } = props;
 
   const { updateEvent, updateTimer } = useEventAction();
+  const [searchParams] = useSearchParams();
+  const allowMainEdits = !searchParams.get('lmain');
+  const allowCustomEdits = !searchParams.get('lcustom');
+
   const { followSelected, showDelayedTimes, hideTableSeconds } = useCuesheetOptions();
   const { columnVisibility, columnOrder, columnSizing, resetColumnOrder, setColumnVisibility, setColumnSizing } =
     useColumnManager(columns);
@@ -77,6 +82,8 @@ export default function CuesheetTable(props: CuesheetTableProps) {
       options: {
         showDelayedTimes,
         hideTableSeconds,
+        allowMainEdits,
+        allowCustomEdits,
       },
     },
   });
@@ -104,7 +111,7 @@ export default function CuesheetTable(props: CuesheetTableProps) {
       <div ref={tableContainerRef} className={style.cuesheetContainer}>
         <table className={style.cuesheet} id='cuesheet' {...listeners}>
           <CuesheetHeader headerGroups={headerGroups} />
-          <CuesheetBody rowModel={rowModel} selectedRef={selectedRef} table={table} columnSizing={columnSizing} />
+          <CuesheetBody rowModel={rowModel} selectedRef={selectedRef} table={table} />
         </table>
       </div>
       <CuesheetTableMenu showModal={showModal} />

apps/client/src/views/cuesheet/cuesheet-table/cuesheet-table-elements/BlockRow.tsx

@@ -19,7 +19,10 @@ function BlockRow(props: BlockRowProps) {
     return null;
   }
 
-  const paddingRows = new Array(columnCount - 1).fill(null);
+  // guard the use case where user has hidden all columns
+  const fillColumns = Math.min(columnCount, 1);
+
+  const paddingRows = new Array(fillColumns).fill(null);
 
   return (
     <tr className={style.blockRow}>

apps/client/src/views/cuesheet/cuesheet-table/cuesheet-table-elements/CuesheetBody.tsx

@@ -16,16 +16,24 @@ interface CuesheetBodyProps {
   rowModel: RowModel<OntimeRundownEntry>;
   selectedRef: MutableRefObject<HTMLTableRowElement | null>;
   table: Table<OntimeRundownEntry>;
-  columnSizing: Record<string, number>;
 }
 
 export default function CuesheetBody(props: CuesheetBodyProps) {
-  const { rowModel, selectedRef, table, columnSizing } = props;
+  const { rowModel, selectedRef, table } = props;
 
   const { selectedEventId } = useSelectedEventId();
   const { hideDelays, hidePast } = useCuesheetOptions();
 
-  const getColumnCount = lazyEvaluate(() => table.getVisibleFlatColumns().length);
+  const getVisibleColumns = lazyEvaluate(() => table.getVisibleFlatColumns());
+  const getColumnHash = lazyEvaluate(() => {
+    let columnHash = '';
+    const columns = getVisibleColumns();
+
+    for (let i = 0; i < columns.length; i++) {
+      columnHash += `${columns[i].getIndex()}-${columns[i].getSize()} `;
+    }
+    return columnHash;
+  });
 
   let eventIndex = 0;
   // for the first event, it will be past if there is something selected
@@ -41,7 +49,7 @@ export default function CuesheetBody(props: CuesheetBodyProps) {
         }
 
         if (isOntimeBlock(entry)) {
-          const columnCount = getColumnCount();
+          const columnCount = getVisibleColumns().length;
           return <BlockRow columnCount={columnCount} key={key} title={entry.title} hidePast={isPast && hidePast} />;
         }
         if (isOntimeDelay(entry)) {
@@ -58,6 +66,7 @@ export default function CuesheetBody(props: CuesheetBodyProps) {
         if (isOntimeEvent(entry)) {
           eventIndex++;
           const isSelected = key === selectedEventId;
+          const columnHash = getColumnHash();
 
           if (isPast && hidePast) {
             return null;
@@ -87,7 +96,7 @@ export default function CuesheetBody(props: CuesheetBodyProps) {
               selectedRef={isSelected ? selectedRef : undefined}
               rowBgColour={rowBgColour}
               table={table}
-              columnSizing={columnSizing}
+              columnHash={columnHash}
             />
           );
         }

apps/client/src/views/cuesheet/cuesheet-table/cuesheet-table-elements/EventRow.tsx

@@ -23,7 +23,7 @@ interface EventRowProps {
   rowBgColour?: string;
   table: Table<OntimeRundownEntry>;
   /** hack to force re-rendering of the row when the column sizes change */
-  columnSizing: Record<string, number>;
+  columnHash: string;
 }
 
 export default memo(EventRow, (prevProps, nextProps) => {
@@ -35,8 +35,7 @@ export default memo(EventRow, (prevProps, nextProps) => {
     prevProps.isPast === nextProps.isPast &&
     prevProps.selectedRef === nextProps.selectedRef &&
     prevProps.rowBgColour === nextProps.rowBgColour &&
-    prevProps.table === nextProps.table &&
-    prevProps.columnSizing === nextProps.columnSizing
+    prevProps.columnHash === nextProps.columnHash
   );
 });
 

apps/client/src/views/cuesheet/cuesheet-table/cuesheet-table-elements/MultiLineCell.tsx

@@ -6,12 +6,13 @@ import useReactiveTextInput from '../../../../common/components/input/text-input
 interface MultiLineCellProps {
   initialValue: string;
   handleUpdate: (newValue: string) => void;
+  allowEdits?: boolean;
 }
 
 export default memo(MultiLineCell);
 
 function MultiLineCell(props: MultiLineCellProps) {
-  const { initialValue, handleUpdate } = props;
+  const { initialValue, handleUpdate, allowEdits } = props;
   const ref = useRef<HTMLInputElement | null>(null);
   const submitCallback = useCallback((newValue: string) => handleUpdate(newValue), [handleUpdate]);
 
@@ -38,6 +39,7 @@ function MultiLineCell(props: MultiLineCellProps) {
       onBlur={onBlur}
       onKeyDown={onKeyDown}
       spellCheck={false}
+      isDisabled={!allowEdits}
     />
   );
 }

apps/client/src/views/cuesheet/cuesheet-table/cuesheet-table-elements/SingleLineCell.tsx

@@ -1,17 +1,18 @@
 import { forwardRef, memo, useCallback, useImperativeHandle, useRef } from 'react';
-import { Input } from '@chakra-ui/react';
+import { Input, Text } from '@chakra-ui/react';
 
 import useReactiveTextInput from '../../../../common/components/input/text-input/useReactiveTextInput';
 
 interface SingleLineCellProps {
   initialValue: string;
   allowSubmitSameValue?: boolean;
+  allowEdits?: boolean;
   handleUpdate: (newValue: string) => void;
   handleCancelUpdate?: () => void;
 }
 
 const SingleLineCell = forwardRef((props: SingleLineCellProps, inputRef) => {
-  const { initialValue, allowSubmitSameValue, handleUpdate, handleCancelUpdate } = props;
+  const { initialValue, allowSubmitSameValue, handleUpdate, handleCancelUpdate, allowEdits } = props;
   const ref = useRef<HTMLInputElement | null>(null);
   const submitCallback = useCallback((newValue: string) => handleUpdate(newValue), [handleUpdate]);
 
@@ -38,6 +39,14 @@ const SingleLineCell = forwardRef((props: SingleLineCellProps, inputRef) => {
     };
   }, [ref]);
 
+  if (allowEdits === false) {
+    return (
+      <Text ref={ref} size='sm' variant='ontime-transparent' padding={0} fontSize='md'>
+        {initialValue}
+      </Text>
+    );
+  }
+
   return (
     <Input
       ref={ref}

apps/client/src/views/cuesheet/cuesheet-table/cuesheet-table-elements/TimeInput.tsx

@@ -8,6 +8,7 @@ interface TimeInputDurationProps {
   initialValue: number;
   lockedValue: boolean;
   delayed?: boolean;
+  allowEdits?: boolean;
   onSubmit: (value: string) => void;
 }
 
@@ -18,7 +19,7 @@ interface ParentFocusableInput extends HTMLInputElement {
 export default memo(TimeInputDuration);
 
 function TimeInputDuration(props: PropsWithChildren<TimeInputDurationProps>) {
-  const { initialValue, lockedValue, delayed, onSubmit, children } = props;
+  const { initialValue, lockedValue, delayed, onSubmit, children, allowEdits } = props;
 
   const [isEditing, setIsEditing] = useState(false);
   const [value, setValue] = useState(initialValue);
@@ -86,7 +87,7 @@ function TimeInputDuration(props: PropsWithChildren<TimeInputDurationProps>) {
 
   const timeString = millisToString(value);
 
-  return isEditing ? (
+  return isEditing && allowEdits ? (
     <SingleLineCell
       ref={inputRef}
       initialValue={timeString}

apps/client/src/views/cuesheet/cuesheet-table/cuesheet-table-elements/cuesheetCols.tsx

@@ -32,7 +32,13 @@ function MakeStart({ getValue, row, table }: CellContext<OntimeRundownEntry, unk
   }
 
   return (
-    <TimeInput initialValue={startTime} onSubmit={update} lockedValue={isStartLocked} delayed={delayValue !== 0}>
+    <TimeInput
+      initialValue={startTime}
+      onSubmit={update}
+      lockedValue={isStartLocked}
+      delayed={delayValue !== 0}
+      allowEdits={table.options.meta?.options.allowMainEdits}
+    >
       {formattedTime}
       <DelayIndicator delayValue={delayValue} tooltipPrefix={millisToString(startTime)} />
     </TimeInput>
@@ -60,7 +66,13 @@ function MakeEnd({ getValue, row, table }: CellContext<OntimeRundownEntry, unkno
   }
 
   return (
-    <TimeInput initialValue={endTime} onSubmit={update} lockedValue={isEndLocked} delayed={delayValue !== 0}>
+    <TimeInput
+      initialValue={endTime}
+      onSubmit={update}
+      lockedValue={isEndLocked}
+      delayed={delayValue !== 0}
+      allowEdits={table.options.meta?.options.allowMainEdits}
+    >
       {formattedTime}
       <DelayIndicator delayValue={delayValue} tooltipPrefix={millisToString(endTime)} />
     </TimeInput>
@@ -81,7 +93,12 @@ function MakeDuration({ getValue, row, table }: CellContext<OntimeRundownEntry,
   const formattedDuration = formatDuration(duration, false);
 
   return (
-    <TimeInput initialValue={duration} onSubmit={update} lockedValue={isDurationLocked}>
+    <TimeInput
+      initialValue={duration}
+      onSubmit={update}
+      lockedValue={isDurationLocked}
+      allowEdits={table.options.meta?.options.allowMainEdits}
+    >
       {formattedDuration}
     </TimeInput>
   );
@@ -103,7 +120,13 @@ function MakeMultiLineField({ row, column, table }: CellContext<OntimeRundownEnt
 
   const initialValue = event[column.id as keyof OntimeRundownEntry] ?? '';
 
-  return <MultiLineCell initialValue={initialValue} handleUpdate={update} />;
+  return (
+    <MultiLineCell
+      initialValue={initialValue}
+      handleUpdate={update}
+      allowEdits={table.options.meta?.options.allowMainEdits}
+    />
+  );
 }
 
 function LazyImage({ row, column, table }: CellContext<OntimeRundownEntry, unknown>) {
@@ -140,7 +163,13 @@ function MakeSingleLineField({ row, column, table }: CellContext<OntimeRundownEn
 
   const initialValue = event[column.id as keyof OntimeRundownEntry] ?? '';
 
-  return <SingleLineCell initialValue={initialValue} handleUpdate={update} />;
+  return (
+    <SingleLineCell
+      initialValue={initialValue}
+      handleUpdate={update}
+      allowEdits={table.options.meta?.options.allowMainEdits}
+    />
+  );
 }
 
 function MakeCustomField({ row, column, table }: CellContext<OntimeRundownEntry, unknown>) {
@@ -158,7 +187,13 @@ function MakeCustomField({ row, column, table }: CellContext<OntimeRundownEntry,
   }
 
   const initialValue = event.custom[column.id] ?? '';
-  return <MultiLineCell initialValue={initialValue} handleUpdate={update} />;
+  return (
+    <MultiLineCell
+      initialValue={initialValue}
+      handleUpdate={update}
+      allowEdits={table.options.meta?.options.allowCustomEdits}
+    />
+  );
 }
 
 export function makeCuesheetColumns(customFields: CustomFields): ColumnDef<OntimeRundownEntry>[] {

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

@@ -49,6 +49,13 @@ export const cuesheetOptions: ViewOption[] = [
         type: 'boolean',
         defaultValue: false,
       },
+      {
+        id: 'hideCustomColumns',
+        title: 'Hide custom data columns',
+        description: 'Whether the hide the custom data in the table',
+        type: 'boolean',
+        defaultValue: false,
+      },
     ],
   },
   {
@@ -81,6 +88,7 @@ type CuesheetOptions = {
   hideIndexColumn: boolean;
   showDelayedTimes: boolean;
   hideDelays: boolean;
+  hideCustom: boolean;
 };
 
 /**
@@ -97,6 +105,7 @@ function getOptionsFromParams(searchParams: URLSearchParams): CuesheetOptions {
     hideIndexColumn: isStringBoolean(searchParams.get('hideIndexColumn')),
     showDelayedTimes: isStringBoolean(searchParams.get('showDelayedTimes')),
     hideDelays: isStringBoolean(searchParams.get('hideDelays')),
+    hideCustom: isStringBoolean(searchParams.get('hideCustomColumns')),
   };
 }
 

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

@@ -20,7 +20,7 @@ type CsvHeaderKey = OntimeEntryCommonKeys | keyof CustomFields;
 
 export const parseField = (field: CsvHeaderKey, data: unknown): string => {
   if (field === 'timeStart' || field === 'timeEnd' || field === 'duration') {
-    return millisToString(data as MaybeNumber);
+    return millisToString(data as MaybeNumber, { fallback: '' });
   }
 
   if (field === 'isPublic' || field === 'skip') {

apps/client/src/views/project-info/ProjectInfo.scss

@@ -25,7 +25,9 @@
     flex: 1;
     max-height: 100%;
     overflow-y: auto;
-    width: min(calc(100vw - 4rem), 800px);
+    width: min(calc(100vw - 4rem), 960px);
+
+    padding-bottom: 10vh;
   }
 
   .info__label {
@@ -33,11 +35,15 @@
     color: var(--label-color-override, $viewer-label-color);
     text-transform: uppercase;
     margin-top: $view-element-gap;
-    white-space: pre;
+  }
+
+  .info__value {
+    white-space: break-spaces;
   }
 
   a.info__value {
     color: $action-text-color;
+  
     &:hover {
       color: $ontime-color;
     }

apps/client/src/views/project-info/ProjectInfo.tsx

@@ -8,6 +8,7 @@ import { useWindowTitle } from '../../common/hooks/useWindowTitle';
 import { useTranslation } from '../../translation/TranslationProvider';
 
 import BackstageInfo from './backstage-info/BackstageInfo';
+import CustomInfo from './custom-info/CustomInfo';
 import PublicInfo from './public-info/PublicInfo';
 import { projectInfoOptions } from './projectInfo.options';
 
@@ -66,6 +67,7 @@ export default function ProjectInfo(props: ProjectInfoProps) {
         )}
         <BackstageInfo general={general} />
         <PublicInfo general={general} />
+        <CustomInfo general={general} />
       </div>
     </div>
   );

apps/client/src/views/project-info/custom-info/CustomInfo.tsx

@@ -0,0 +1,36 @@
+import { Fragment } from 'react';
+import { useSearchParams } from 'react-router-dom';
+import { ProjectData } from 'ontime-types';
+
+import { isStringBoolean } from '../../../features/viewers/common/viewUtils';
+
+interface CustomInfoProps {
+  general: ProjectData;
+}
+
+export default function CustomInfo(props: CustomInfoProps) {
+  const { general } = props;
+  const [searchParams] = useSearchParams();
+
+  const showCustom = isStringBoolean(searchParams.get('showCustom'));
+
+  if (!showCustom || general.custom === undefined || general.custom.length === 0) {
+    return null;
+  }
+
+  return (
+    <>
+      {general.custom.map((info, idx) => {
+        if (!info.title || !info.value) {
+          return null;
+        }
+        return (
+          <Fragment key={`${info.title}-${idx}`}>
+            <div className='info__label'>{info.title}</div>
+            <div className='info__value'>{info.value}</div>
+          </Fragment>
+        );
+      })}
+    </>
+  );
+}

apps/client/src/views/project-info/projectInfo.options.ts

@@ -9,14 +9,21 @@ export const projectInfoOptions: ViewOption[] = [
       {
         id: 'showBackstage',
         title: 'Show backstage Data',
-        description: 'Weather to show fields related to the backstage views',
+        description: 'Whether to show fields related to the backstage views',
         type: 'boolean',
         defaultValue: false,
       },
       {
         id: 'showPublic',
         title: 'Show Public Data',
-        description: 'Weather to show fields related to the public views',
+        description: 'Whether to show fields related to the public views',
+        type: 'boolean',
+        defaultValue: false,
+      },
+      {
+        id: 'showCustom',
+        title: 'Show Custom Data',
+        description: 'Whether to show fields related to the custom data',
         type: 'boolean',
         defaultValue: false,
       },

apps/electron/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ontime-electron",
-  "version": "3.15.0",
+  "version": "3.16.1-alpha.2",
   "author": "Carlos Valente",
   "description": "Time keeping for live events",
   "repository": "https://github.com/cpvalente/ontime",

apps/server/package.json

@@ -2,7 +2,7 @@
   "name": "ontime-server",
   "type": "module",
   "main": "src/index.ts",
-  "version": "3.15.0",
+  "version": "3.16.1-alpha.2",
   "exports": "./src/index.js",
   "dependencies": {
     "@googleapis/sheets": "^5.0.5",

apps/server/src/api-data/db/db.controller.ts

@@ -58,6 +58,7 @@ export async function createProjectFile(req: Request, res: Response<{ filename:
         backstageUrl: req.body?.backstageUrl ?? '',
         backstageInfo: req.body?.backstageInfo ?? '',
         projectLogo: req.body?.projectLogo ?? null,
+        custom: req.body?.custom ?? [],
       },
     });
 
@@ -203,7 +204,7 @@ export async function loadProject(req: Request, res: Response<MessageResponse |
 /**
  * Loads the demo project
  */
-export async function loadDemo(req: Request, res: Response<MessageResponse | ErrorResponse>) {
+export async function loadDemo(_req: Request, res: Response<MessageResponse | ErrorResponse>) {
   try {
     const projectName = await projectService.loadDemoProject();
 

apps/server/src/api-data/db/db.validation.ts

@@ -16,6 +16,7 @@ export const validateNewProject = [
   body('backstageInfo').optional().isString().trim(),
   body('projectLogo').optional().isString().trim(),
   body('endMessage').optional().isString().trim(),
+  body('custom').optional().isArray(),
 
   (req: Request, res: Response, next: NextFunction) => {
     const errors = validationResult(req);

apps/server/src/api-data/project/project.controller.ts

@@ -5,11 +5,11 @@ import type { Request, Response } from 'express';
 
 import { removeUndefined } from '../../utils/parserUtils.js';
 import { failEmptyObjects } from '../../utils/routerUtils.js';
-import { getDataProvider } from '../../classes/data-provider/DataProvider.js';
 import { editCurrentProjectData } from '../../services/project-service/ProjectService.js';
+import * as projectDao from './project.dao.js';
 
 export function getProjectData(_req: Request, res: Response<ProjectData>) {
-  res.json(getDataProvider().getProjectData());
+  res.json(projectDao.getProjectData());
 }
 
 export async function postProjectData(req: Request, res: Response<ProjectData | ErrorResponse>) {
@@ -27,6 +27,7 @@ export async function postProjectData(req: Request, res: Response<ProjectData |
       backstageInfo: req.body?.backstageInfo,
       endMessage: req.body?.endMessage,
       projectLogo: req.body?.projectLogo,
+      custom: req.body?.custom,
     });
 
     const updatedData = await editCurrentProjectData(newData);

apps/server/src/api-data/project/project.dao.ts

@@ -0,0 +1,9 @@
+import { ProjectData } from 'ontime-types';
+import { getDataProvider } from '../../classes/data-provider/DataProvider.js';
+
+/**
+ * Gets a copy of the stored project data
+ */
+export function getProjectData(): ProjectData {
+  return structuredClone(getDataProvider().getProjectData());
+}

apps/server/src/api-data/project/project.validation.ts

@@ -10,6 +10,9 @@ export const projectSanitiser = [
   body('backstageInfo').optional().isString().trim(),
   body('endMessage').optional().isString().trim(),
   body('projectLogo').optional({ nullable: true }).isString().trim(),
+  body('custom').optional().isArray(),
+  body('custom.*.title').optional().isString().trim().notEmpty(),
+  body('custom.*.value').optional().isString().trim().notEmpty(),
 
   (req: Request, res: Response, next: NextFunction) => {
     const errors = validationResult(req);

apps/server/src/api-data/session/__tests__/session.service.test.ts

@@ -3,17 +3,26 @@ import { generateAuthenticatedUrl } from '../session.service.js';
 describe('generateAuthenticatedUrl()', () => {
   describe('for local IP addresses', () => {
     it('generates a link without locking or authentication', () => {
-      const localhostNotLocked = generateAuthenticatedUrl('http://localhost:3000', 'timer', false, false);
+      const localhostNotLocked = generateAuthenticatedUrl('http://localhost:3000', 'timer', false, false, false, false);
       expect(localhostNotLocked.toString()).toBe('http://localhost:3000/timer');
     });
 
     it('generates a link with IP locking enabled', () => {
-      const ipLocked = generateAuthenticatedUrl('http://192.168.10.173:4001', 'timer', true, false);
+      const ipLocked = generateAuthenticatedUrl('http://192.168.10.173:4001', 'timer', true, false, false, false);
       expect(ipLocked.toString()).toBe('http://192.168.10.173:4001/timer?locked=true');
     });
 
     it('generates a link with authentication token and IP locking', () => {
-      const withAuth = generateAuthenticatedUrl('http://192.168.10.173:4001', 'timer', true, true, undefined, '1234');
+      const withAuth = generateAuthenticatedUrl(
+        'http://192.168.10.173:4001',
+        'timer',
+        true,
+        false,
+        false,
+        true,
+        undefined,
+        '1234',
+      );
       expect(withAuth.toString()).toBe('http://192.168.10.173:4001/timer?token=1234&locked=true');
     });
   });
@@ -25,13 +34,23 @@ describe('generateAuthenticatedUrl()', () => {
         'timer',
         false,
         false,
+        false,
+        false,
         'prefix',
       );
       expect(cloudNotLocked.toString()).toBe('https://cloud.getontime.no/prefix/timer');
     });
 
     it('generates a link with IP locking enabled', () => {
-      const ipLocked = generateAuthenticatedUrl('https://cloud.getontime.no/prefix', 'timer', true, false, 'prefix');
+      const ipLocked = generateAuthenticatedUrl(
+        'https://cloud.getontime.no/prefix',
+        'timer',
+        true,
+        false,
+        false,
+        false,
+        'prefix',
+      );
       expect(ipLocked.toString()).toBe('https://cloud.getontime.no/prefix/timer?locked=true');
     });
 
@@ -40,6 +59,8 @@ describe('generateAuthenticatedUrl()', () => {
         'https://cloud.getontime.no/prefix',
         'timer',
         true,
+        false,
+        false,
         true,
         'prefix',
         '1234',

apps/server/src/api-data/session/session.controller.ts

@@ -31,6 +31,8 @@ export async function generateUrl(req: Request, res: Response<GetUrl | ErrorResp
       req.body.baseUrl,
       req.body.path,
       req.body.lock,
+      req.body.lockMainFields,
+      req.body.lockCustomFields,
       req.body.authenticate,
     );
     res.status(200).send({ url: url.toString() });

apps/server/src/api-data/session/session.service.ts

@@ -59,6 +59,8 @@ export function generateAuthenticatedUrl(
   baseUrl: string,
   path: string,
   lock: boolean,
+  lockMainFields: boolean,
+  lockCustomFields: boolean,
   authenticate: boolean,
   prefix = routerPrefix,
   hash = hashedPassword,
@@ -72,5 +74,11 @@ export function generateAuthenticatedUrl(
   if (lock) {
     url.searchParams.append('locked', 'true');
   }
+  if (lockMainFields) {
+    url.searchParams.append('lmain', 'true');
+  }
+  if (lockCustomFields) {
+    url.searchParams.append('lcustom', 'true');
+  }
   return url;
 }

apps/server/src/api-data/session/session.validation.ts

@@ -5,6 +5,8 @@ export const validateGenerateUrl = [
   body('baseUrl').exists().isString().notEmpty().trim(),
   body('path').exists().isString().trim(),
   body('lock').exists().isBoolean(),
+  body('lockMainFields').exists().isBoolean(),
+  body('lockCustomFields').exists().isBoolean(),
   body('authenticate').exists().isBoolean(),
 
   (req: Request, res: Response, next: NextFunction) => {

apps/server/src/classes/data-provider/DataProvider.ts

@@ -63,7 +63,7 @@ function getData(): Readonly<DatabaseModel> {
 }
 
 async function setProjectData(newData: Partial<ProjectData>): ReadonlyPromise<ProjectData> {
-  db.data.project = { ...db.data.project, ...newData };
+  db.data.project = { ...structuredClone(db.data.project), ...structuredClone(newData) }; // Performing deep copy as we're updating / merging data
   await persist();
   return db.data.project;
 }

apps/server/src/classes/data-provider/DataProvider.utils.ts

@@ -4,24 +4,27 @@ import { DatabaseModel } from 'ontime-types';
  * Merges a partial ontime project into a given ontime project
  */
 export function safeMerge(existing: DatabaseModel, newData: Partial<DatabaseModel>): DatabaseModel {
+  const deepExisting = structuredClone(existing);
+  const deepNewData = structuredClone(newData);
+
   const {
-    rundown = existing.rundown,
+    rundown = deepExisting.rundown,
     project = {},
     settings = {},
     viewSettings = {},
-    urlPresets = existing.urlPresets,
-    customFields = existing.customFields,
-    automation = existing.automation,
-  } = newData;
+    urlPresets = deepExisting.urlPresets,
+    customFields = deepExisting.customFields,
+    automation = deepExisting.automation,
+  } = deepNewData;
 
   return {
-    ...existing,
+    ...deepExisting,
     rundown,
-    project: { ...existing.project, ...project },
-    settings: { ...existing.settings, ...settings },
-    viewSettings: { ...existing.viewSettings, ...viewSettings },
-    urlPresets: urlPresets ?? existing.urlPresets,
-    customFields: customFields ?? existing.customFields,
-    automation: { ...existing.automation, ...automation },
+    project: { ...deepExisting.project, ...project },
+    settings: { ...deepExisting.settings, ...settings },
+    viewSettings: { ...deepExisting.viewSettings, ...viewSettings },
+    urlPresets: urlPresets ?? deepExisting.urlPresets,
+    customFields: customFields ?? deepExisting.customFields,
+    automation: { ...deepExisting.automation, ...automation },
   };
 }

apps/server/src/classes/data-provider/__tests__/DataProvider.utils.test.ts

@@ -12,6 +12,12 @@ describe('safeMerge', () => {
       publicInfo: 'existing backstageInfo',
       backstageInfo: 'existing backstageInfo',
       projectLogo: null,
+      custom: [
+        {
+          title: 'existing custom title',
+          value: 'existing custom value',
+        },
+      ],
     },
     settings: {
       app: 'ontime',
@@ -62,6 +68,12 @@ describe('safeMerge', () => {
       project: {
         title: 'new title',
         publicInfo: 'new public info',
+        custom: [
+          {
+            title: 'new custom title',
+            value: 'new custom value',
+          },
+        ],
       },
     };
     // @ts-expect-error -- just testing
@@ -74,6 +86,12 @@ describe('safeMerge', () => {
       backstageUrl: 'existing backstageUrl',
       backstageInfo: 'existing backstageInfo',
       projectLogo: null,
+      custom: [
+        {
+          title: 'new custom title',
+          value: 'new custom value',
+        },
+      ],
     });
   });
 
@@ -107,6 +125,7 @@ describe('safeMerge', () => {
         backstageUrl: '',
         backstageInfo: '',
         projectLogo: null,
+        custom: [],
       },
       settings: {
         app: 'ontime',

apps/server/src/models/dataModel.ts

@@ -11,6 +11,7 @@ export const dbModel: DatabaseModel = {
     backstageUrl: '',
     backstageInfo: '',
     projectLogo: null,
+    custom: [],
   },
   settings: {
     app: 'ontime',

apps/server/src/models/demoProject.ts

@@ -413,6 +413,7 @@ export const demoDb: DatabaseModel = {
     backstageUrl: 'www.github.com/cpvalente/ontime',
     backstageInfo: 'Rehearsal Schedule - Turin 2022\nAll performers to wear full costumes for 1st rehearsal',
     projectLogo: null,
+    custom: [],
   },
   settings: {
     app: 'ontime',

apps/server/src/services/__tests__/timerUtils.test.ts

@@ -4,7 +4,6 @@ import { EndAction, Playback, TimeStrategy, TimerPhase, TimerType } from 'ontime
 import {
   getCurrent,
   getExpectedFinish,
-  getRelativeOffset,
   getRuntimeOffset,
   getTimerPhase,
   normaliseEndTime,
@@ -741,8 +740,8 @@ describe('getRuntimeOffset()', () => {
       },
     } as RuntimeState;
 
-    const offset = getRuntimeOffset(state);
-    expect(offset).toBe(-50);
+    const { absoluteOffset } = getRuntimeOffset(state);
+    expect(absoluteOffset).toBe(-50);
   });
 
   it('added time subtracts time offset (positive offset)', () => {
@@ -764,8 +763,8 @@ describe('getRuntimeOffset()', () => {
       },
     } as RuntimeState;
 
-    const offset = getRuntimeOffset(state);
-    expect(offset).toBe(-60);
+    const { absoluteOffset } = getRuntimeOffset(state);
+    expect(absoluteOffset).toBe(-60);
   });
 
   it('considers running overtime (negative offset)', () => {
@@ -788,8 +787,8 @@ describe('getRuntimeOffset()', () => {
       },
     } as RuntimeState;
 
-    const offset = getRuntimeOffset(state);
-    expect(offset).toBe(-10);
+    const { absoluteOffset } = getRuntimeOffset(state);
+    expect(absoluteOffset).toBe(-10);
   });
 
   it('paused time is delayed time (negative offset)', () => {
@@ -813,8 +812,8 @@ describe('getRuntimeOffset()', () => {
       },
     } as RuntimeState;
 
-    const offset = getRuntimeOffset(state);
-    expect(offset).toBe(-25);
+    const { absoluteOffset } = getRuntimeOffset(state);
+    expect(absoluteOffset).toBe(-25);
   });
 
   it('offset doesnt exist if we havent started', () => {
@@ -851,8 +850,8 @@ describe('getRuntimeOffset()', () => {
       _timer: { pausedAt: null },
     } as RuntimeState;
 
-    const offset = getRuntimeOffset(state);
-    expect(offset).toBe(0);
+    const { absoluteOffset } = getRuntimeOffset(state);
+    expect(absoluteOffset).toBe(0);
   });
 
   it('handles loaded event', () => {
@@ -892,8 +891,8 @@ describe('getRuntimeOffset()', () => {
       _timer: { pausedAt: null },
     } as RuntimeState;
 
-    const offset = getRuntimeOffset(state);
-    expect(offset).toBe(81000000 - 79521653); // clock - timestart
+    const { absoluteOffset } = getRuntimeOffset(state);
+    expect(absoluteOffset).toBe(81000000 - 79521653); // clock - timestart
   });
 
   it('with time-to-end, offsets dont exist if we are not in overtime', () => {
@@ -945,8 +944,8 @@ describe('getRuntimeOffset()', () => {
       _timer: { pausedAt: null },
     } as RuntimeState;
 
-    const offset = getRuntimeOffset(state);
-    expect(offset).toBe(0);
+    const { absoluteOffset } = getRuntimeOffset(state);
+    expect(absoluteOffset).toBe(0);
   });
 
   it('with time-to-end, offset is the overtime', () => {
@@ -998,8 +997,8 @@ describe('getRuntimeOffset()', () => {
       _timer: { pausedAt: null },
     } as RuntimeState;
 
-    const offset = getRuntimeOffset(state);
-    expect(offset).toBe(-400000); // <--- offset is always the overtime
+    const { absoluteOffset } = getRuntimeOffset(state);
+    expect(absoluteOffset).toBe(-400000); // <--- offset is always the overtime
   });
 
   it('handles time-to-end started after the end time', () => {
@@ -1041,9 +1040,9 @@ describe('getRuntimeOffset()', () => {
 
     const updateCurrent = getCurrent(state);
     state.timer.current = updateCurrent;
-    const offset = getRuntimeOffset(state);
-    expect(millisToString(offset)).toBe('-00:16:40');
-    expect(offset).toBe(81000000 - 82000000); // <-- planned end - now
+    const { absoluteOffset } = getRuntimeOffset(state);
+    expect(millisToString(absoluteOffset)).toBe('-00:16:40');
+    expect(absoluteOffset).toBe(81000000 - 82000000); // <-- planned end - now
   });
 });
 
@@ -1068,10 +1067,9 @@ describe('getRelativeOffset()', () => {
       },
     } as RuntimeState;
 
-    state.runtime.offset = getRuntimeOffset(state);
-    expect(state.runtime.offset).toBe(0);
-    const relativeOffsetoffset = getRelativeOffset(state);
-    expect(relativeOffsetoffset).toBe(0);
+    const { absoluteOffset, relativeOffset } = getRuntimeOffset(state);
+    expect(absoluteOffset).toBe(0);
+    expect(relativeOffset).toBe(0);
   });
   it('relative offset is 0 when starting after the planed time', () => {
     const state = {
@@ -1093,10 +1091,9 @@ describe('getRelativeOffset()', () => {
       },
     } as RuntimeState;
 
-    state.runtime.offset = getRuntimeOffset(state);
-    expect(state.runtime.offset).toBe(-50);
-    const relativeOffsetoffset = getRelativeOffset(state);
-    expect(relativeOffsetoffset).toBe(0);
+    const { absoluteOffset, relativeOffset } = getRuntimeOffset(state);
+    expect(absoluteOffset).toBe(-50);
+    expect(relativeOffset).toBe(0);
   });
   it('relative offset is 0 when starting before the planed time', () => {
     const state = {
@@ -1118,10 +1115,9 @@ describe('getRelativeOffset()', () => {
       },
     } as RuntimeState;
 
-    state.runtime.offset = getRuntimeOffset(state);
-    expect(state.runtime.offset).toBe(50);
-    const relativeOffsetoffset = getRelativeOffset(state);
-    expect(relativeOffsetoffset).toBe(0);
+    const { absoluteOffset, relativeOffset } = getRuntimeOffset(state);
+    expect(absoluteOffset).toBe(50);
+    expect(relativeOffset).toBe(0);
   });
 });
 

apps/server/src/services/project-service/ProjectService.ts

@@ -314,17 +314,13 @@ export async function patchCurrentProject(data: Partial<DatabaseModel>) {
 }
 
 /**
- * Changes the title of a project
- * it handles invalidating the necessary data
+ * Patches the current project data
+ * Handles deleting the local logo if the logo has been removed
  */
 export async function editCurrentProjectData(newData: Partial<ProjectData>) {
   const currentProjectData = getDataProvider().getProjectData();
   const updatedProjectData = await getDataProvider().setProjectData(newData);
 
-  if (currentProjectData.title !== updatedProjectData.title) {
-    // something
-  }
-
   // Delete the old logo if the logo has been removed
   if (!updatedProjectData.projectLogo && currentProjectData.projectLogo) {
     const filePath = join(publicDir.logoDir, currentProjectData.projectLogo);

apps/server/src/services/timerUtils.ts

@@ -116,10 +116,10 @@ export function skippedOutOfEvent(state: RuntimeState, previousTime: number, ski
  * Positive offset is time ahead
  * Negative offset is time delayed
  */
-export function getRuntimeOffset(state: RuntimeState): number {
+export function getRuntimeOffset(state: RuntimeState): { absoluteOffset: number; relativeOffset: number } {
   // nothing to calculate if there are no loaded events or if we havent started
   if (state.eventNow === null || state.runtime.actualStart === null) {
-    return 0;
+    return { absoluteOffset: 0, relativeOffset: 0 };
   }
 
   // eslint-disable-next-line no-unused-labels -- dev code path
@@ -133,18 +133,16 @@ export function getRuntimeOffset(state: RuntimeState): number {
   const { clock } = state;
   const { countToEnd, timeStart } = state.eventNow;
   const { addedTime, current, startedAt } = state.timer;
+  const { actualStart, plannedStart } = state.runtime;
 
   // if we havent started, but the timer is armed
   // the offset is the difference to the schedule
   if (startedAt === null) {
-    return timeStart - clock;
+    return { absoluteOffset: timeStart - clock, relativeOffset: 0 };
   }
 
   const overtime = Math.min(current, 0);
   // in time-to-end, offset is overtime
-  if (countToEnd) {
-    return overtime;
-  }
 
   const startOffset = timeStart - startedAt;
   const pausedTime = state._timer.pausedAt === null ? 0 : clock - state._timer.pausedAt;
@@ -153,24 +151,20 @@ export function getRuntimeOffset(state: RuntimeState): number {
   // addedTime - time added by user (negative offset)
   // pausedTime - time the playback was paused (negative offset)
   // overtime - how long the timer has been over-running (negative offset)
-  return startOffset - addedTime - pausedTime + overtime;
-}
+  const offset = startOffset - addedTime - pausedTime + overtime;
 
-/**
- * Calculates relative offset
- * should always be calculated after the absolute offset
- */
-export function getRelativeOffset(state: RuntimeState): number {
-  const { actualStart, plannedStart, offset } = state.runtime;
-  // eslint-disable-next-line no-unused-labels -- dev code path
-  DEV: {
-    // we know actualStart and plannedStart exists as long as a timer is running
-    if (actualStart === null || plannedStart === null) {
-      throw new Error('timerUtils.calculate: actualStart and plannedStart must be set');
-    }
+  // offset between planned rundown start and actual rundown start
+  const rundownStartOffset = actualStart - plannedStart;
+
+  // offset offset relative to the actual rundown start
+  const relativeOffset = offset + rundownStartOffset;
+
+  // in time-to-end, offset is overtime
+  if (countToEnd) {
+    return { absoluteOffset: overtime, relativeOffset };
   }
-  const relativeStartOffset = actualStart - plannedStart;
-  return offset + relativeStartOffset;
+
+  return { absoluteOffset: offset, relativeOffset };
 }
 
 /**

apps/server/src/stores/runtimeState.ts

@@ -28,7 +28,6 @@ import {
   getCurrent,
   getExpectedEnd,
   getExpectedFinish,
-  getRelativeOffset,
   getRuntimeOffset,
   getTimerPhase,
 } from '../services/timerUtils.js';
@@ -89,7 +88,7 @@ export function getState(): Readonly<RuntimeState> {
   };
 }
 
-/* clear data related to the current event, but leav in place data about the global run state
+/* clear data related to the current event, but leave in place data about the global run state
  * used when loading a new event but the playback is not interrupted
  */
 export function clearEventData() {
@@ -214,8 +213,9 @@ export function load(
     const firstStart = initialData?.firstStart;
     if (firstStart === null || typeof firstStart === 'number') {
       runtimeState.runtime.actualStart = firstStart;
-      runtimeState.runtime.offset = getRuntimeOffset(runtimeState);
-      runtimeState.runtime.relativeOffset = getRelativeOffset(runtimeState);
+      const { absoluteOffset, relativeOffset } = getRuntimeOffset(runtimeState);
+      runtimeState.runtime.offset = absoluteOffset;
+      runtimeState.runtime.relativeOffset = relativeOffset;
       runtimeState.runtime.expectedEnd = getExpectedEnd(runtimeState);
     }
     if (typeof initialData.blockStartAt === 'number') {
@@ -420,8 +420,9 @@ export function start(state: RuntimeState = runtimeState): boolean {
   runtimeState.timer.phase = getTimerPhase(runtimeState);
 
   // update offset
-  state.runtime.offset = getRuntimeOffset(state);
-  state.runtime.relativeOffset = getRelativeOffset(state);
+  const { absoluteOffset, relativeOffset } = getRuntimeOffset(runtimeState);
+  runtimeState.runtime.offset = absoluteOffset;
+  runtimeState.runtime.relativeOffset = relativeOffset;
   state.runtime.expectedEnd = state.runtime.plannedEnd - state.runtime.offset;
   return true;
 }
@@ -482,8 +483,9 @@ export function addTime(amount: number) {
   runtimeState.timer.current += amount;
 
   // update runtime delays: over - under
-  runtimeState.runtime.offset = getRuntimeOffset(runtimeState);
-  runtimeState.runtime.relativeOffset = getRelativeOffset(runtimeState);
+  const { absoluteOffset, relativeOffset } = getRuntimeOffset(runtimeState);
+  runtimeState.runtime.offset = absoluteOffset;
+  runtimeState.runtime.relativeOffset = relativeOffset;
   runtimeState.runtime.expectedEnd = getExpectedEnd(runtimeState);
 
   return true;
@@ -528,8 +530,9 @@ export function update(): UpdateResult {
   runtimeState.timer.elapsed = runtimeState.timer.duration - runtimeState.timer.current;
 
   // update runtime, needs up-to-date timer state
-  runtimeState.runtime.offset = getRuntimeOffset(runtimeState);
-  runtimeState.runtime.relativeOffset = getRelativeOffset(runtimeState);
+  const { absoluteOffset, relativeOffset } = getRuntimeOffset(runtimeState);
+  runtimeState.runtime.offset = absoluteOffset;
+  runtimeState.runtime.relativeOffset = relativeOffset;
   runtimeState.runtime.expectedEnd = getExpectedEnd(runtimeState);
 
   const finishedNow =

apps/server/src/utils/__tests__/parser.test.ts

@@ -838,6 +838,7 @@ describe('getCustomFieldData()', () => {
         lighting: 'lx',
         sound: 'sound',
         video: 'av',
+        ontime_label: 'excel label',
       },
       entryId: 'id',
     } as ImportMap;
@@ -845,6 +846,7 @@ describe('getCustomFieldData()', () => {
     const customFields: CustomFields = {
       lighting: { label: 'lx', type: 'string', colour: 'red' },
       sound: { label: 'sound', type: 'string', colour: 'green' },
+      ontime_key: { label: 'ontime_label', type: 'string', colour: 'blue' },
     };
 
     const result = getCustomFieldData(importMap, customFields);
@@ -864,6 +866,11 @@ describe('getCustomFieldData()', () => {
         colour: '',
         label: 'video',
       },
+      ontime_key: {
+        type: 'string',
+        colour: 'blue',
+        label: 'ontime_label',
+      },
     });
 
     // it is an inverted record of <importKey, ontimeKey>
@@ -871,6 +878,7 @@ describe('getCustomFieldData()', () => {
       lx: 'lighting',
       sound: 'sound',
       av: 'video',
+      'excel label': 'ontime_key',
     });
   });
 });
@@ -1022,8 +1030,8 @@ describe('parseExcel()', () => {
       user2: { type: 'string', colour: 'blue', label: 'user2' },
     };
 
-    const parsedData = parseExcel(testdata, existingCustomFields, importMap);
-    expect(parsedData.customFields).toStrictEqual({
+    const { customFields, rundown } = parseExcel(testdata, existingCustomFields, importMap);
+    expect(customFields).toStrictEqual({
       user0: {
         type: 'string',
         colour: 'red',
@@ -1075,9 +1083,9 @@ describe('parseExcel()', () => {
         label: 'user9',
       },
     });
-    expect(parsedData.rundown.length).toBe(2);
-    expect(parsedData.rundown[0]).toMatchObject(expectedParsedRundown[0]);
-    expect(parsedData.rundown[1]).toMatchObject(expectedParsedRundown[1]);
+    expect(rundown.length).toBe(2);
+    expect(rundown[0]).toMatchObject(expectedParsedRundown[0]);
+    expect(rundown[1]).toMatchObject(expectedParsedRundown[1]);
   });
 
   it('parses a file without custom fields', () => {

apps/server/src/utils/__tests__/parserFunctions.test.ts

@@ -65,6 +65,7 @@ describe('parseProject()', () => {
           publicInfo: 'publicInfo',
           backstageUrl: 'backstageUrl',
           backstageInfo: 'backstageInfo',
+          custom: [],
         },
       },
       errorEmitter,
@@ -77,6 +78,7 @@ describe('parseProject()', () => {
       backstageUrl: 'backstageUrl',
       backstageInfo: 'backstageInfo',
       projectLogo: null,
+      custom: [],
     });
     expect(errorEmitter).not.toHaveBeenCalled();
   });

apps/server/src/utils/parser.ts

@@ -1,5 +1,6 @@
 import {
   customFieldLabelToKey,
+  customKeyFromLabel,
   defaultImportMap,
   generateId,
   type ImportMap,
@@ -60,7 +61,7 @@ export function getCustomFieldData(
   const customFields = {};
   const customFieldImportKeys = {};
   for (const ontimeLabel in importMap.custom) {
-    const ontimeKey = customFieldLabelToKey(ontimeLabel);
+    const ontimeKey = customKeyFromLabel(ontimeLabel, existingCustomFields) ?? customFieldLabelToKey(ontimeLabel);
     const importLabel = importMap.custom[ontimeLabel].toLowerCase();
     const colour = ontimeKey in existingCustomFields ? existingCustomFields[ontimeKey].colour : '';
     customFields[ontimeKey] = {
@@ -198,9 +199,9 @@ export const parseExcel = (
         entryIdIndex = col;
         rundownMetadata['id'] = { row, col };
       },
-      custom: (row: number, col: number, columnText: string) => {
+      custom: (row: number, col: number, columnText: string, ontimeKey: string) => {
         customFieldIndexes[col] = columnText;
-        rundownMetadata[`custom:${columnText}`] = { row, col };
+        rundownMetadata[`custom:${ontimeKey}`] = { row, col };
       },
     } as const;
 
@@ -266,12 +267,13 @@ export const parseExcel = (
 
           // check if it is an ontime column
           if (handlers[columnText]) {
-            handlers[columnText](rowIndex, j, undefined);
+            handlers[columnText](rowIndex, j, undefined, undefined);
           }
 
           // check if it is a custom field
           if (columnText in customFieldImportKeys) {
-            handlers.custom(rowIndex, j, columnText);
+            const ontimeKey = customFieldImportKeys[columnText];
+            handlers.custom(rowIndex, j, columnText, ontimeKey);
           }
 
           // else. we don't know how to handle this column

apps/server/src/utils/parserFunctions.ts

@@ -114,6 +114,7 @@ export function parseProject(data: Partial<DatabaseModel>, emitError?: ErrorEmit
     backstageUrl: data.project.backstageUrl ?? dbModel.project.backstageUrl,
     backstageInfo: data.project.backstageInfo ?? dbModel.project.backstageInfo,
     projectLogo: data.project.projectLogo ?? dbModel.project.projectLogo,
+    custom: data.project.custom ?? dbModel.project.custom,
   };
 }
 

apps/server/test-db/db.json

@@ -410,7 +410,8 @@
     "publicInfo": "Rehearsal Schedule - Turin 2022",
     "backstageUrl": "www.github.com/cpvalente/ontime",
     "backstageInfo": "Rehearsal Schedule - Turin 2022\nAll performers to wear full costumes for 1st rehearsal",
-    "projectLogo": null
+    "projectLogo": null,
+    "custom": []
   },
   "settings": {
     "app": "ontime",
@@ -455,4 +456,4 @@
       "label": "artist"
     }
   }
-}
+}

e2e/tests/fixtures/test-db.json

@@ -410,7 +410,8 @@
     "publicInfo": "Rehearsal Schedule - Turin 2022",
     "backstageUrl": "www.github.com/cpvalente/ontime",
     "backstageInfo": "Rehearsal Schedule - Turin 2022\nAll performers to wear full costumes for 1st rehearsal",
-    "projectLogo": null
+    "projectLogo": null,
+    "custom": []
   },
   "settings": {
     "app": "ontime",
@@ -455,4 +456,4 @@
       "label": "artist"
     }
   }
-}
+}

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ontime",
-  "version": "3.15.0",
+  "version": "3.16.1-alpha.2",
   "description": "Time keeping for live events",
   "keywords": [
     "ontime",

packages/types/src/definitions/core/ProjectData.type.ts

@@ -6,4 +6,5 @@ export type ProjectData = {
   backstageUrl: string;
   backstageInfo: string;
   projectLogo: string | null;
+  custom: { title: string; value: string }[];
 };

packages/utils/index.ts

@@ -58,7 +58,7 @@ export { isAlphanumeric, isAlphanumericWithSpace } from './src/regex-utils/isAlp
 export { isColourHex } from './src/regex-utils/isColourHex.js';
 export { splitWhitespace } from './src/regex-utils/splitWhitespace.js';
 
-export { customFieldLabelToKey } from './src/customField-utils/customFieldLabelToKey.js';
+export { customFieldLabelToKey, customKeyFromLabel } from './src/customField-utils/customFieldLabelToKey.js';
 
 // helpers from externals
 export { deepmerge } from './src/externals/deepmerge.js';

packages/utils/src/customField-utils/customFieldLabelToKey.ts

@@ -1,3 +1,5 @@
+import type { CustomFields } from 'ontime-types';
+
 import { isAlphanumericWithSpace } from '../regex-utils/isAlphanumeric.js';
 
 /**
@@ -9,3 +11,11 @@ export const customFieldLabelToKey = (label: string): string | null => {
   }
   return null;
 };
+
+export const customKeyFromLabel = (label: string, fields: CustomFields): string | null => {
+  const maybeMatchingKey = Object.keys(fields).find((key) => fields[key].label === label);
+  if (maybeMatchingKey) {
+    return maybeMatchingKey;
+  }
+  return null;
+};

pnpm-lock.yaml

@@ -6,6 +6,9 @@ settings:
 
 catalogs:
   default:
+    '@types/node':
+      specifier: 20.17.16
+      version: 20.17.16
     '@typescript-eslint/eslint-plugin':
       specifier: 7.16.1
       version: 7.16.1
@@ -123,8 +126,8 @@ importers:
         specifier: ^5.62.7
         version: 5.62.7(@tanstack/react-query@5.62.7(react@18.3.1))(react@18.3.1)
       '@tanstack/react-table':
-        specifier: ^8.20.5
-        version: 8.20.6(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+        specifier: ^8.21.3
+        version: 8.21.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
       autosize:
         specifier: ^6.0.1
         version: 6.0.1
@@ -1983,15 +1986,15 @@ packages:
     peerDependencies:
       react: ^18 || ^19
 
-  '@tanstack/react-table@8.20.6':
-    resolution: {integrity: sha512-w0jluT718MrOKthRcr2xsjqzx+oEM7B7s/XXyfs19ll++hlId3fjTm+B2zrR3ijpANpkzBAr15j1XGVOMxpggQ==}
+  '@tanstack/react-table@8.21.3':
+    resolution: {integrity: sha512-5nNMTSETP4ykGegmVkhjcS8tTLW6Vl4axfEGQN3v0zdHYbK4UfoqfPChclTrJ4EoK9QynqAu9oUf8VEmrpZ5Ww==}
     engines: {node: '>=12'}
     peerDependencies:
       react: '>=16.8'
       react-dom: '>=16.8'
 
-  '@tanstack/table-core@8.20.5':
-    resolution: {integrity: sha512-P9dF7XbibHph2PFRz8gfBKEXEY/HJPOhym8CHmjF8y3q5mWpKx9xtZapXQUWCgkqvsK0R46Azuz+VaxD4Xl+Tg==}
+  '@tanstack/table-core@8.21.3':
+    resolution: {integrity: sha512-ldZXEhOBb8Is7xLs01fR3YEc3DERiz5silj8tnGkFZytt1abEvl/GhUmCE0PMLaMPTa3Jk4HbKmRlHmu+gCftg==}
     engines: {node: '>=12'}
 
   '@tootallnate/once@2.0.0':
@@ -6747,13 +6750,13 @@ snapshots:
       '@tanstack/query-core': 5.62.7
       react: 18.3.1
 
-  '@tanstack/react-table@8.20.6(react-dom@18.3.1(react@18.3.1))(react@18.3.1)':
+  '@tanstack/react-table@8.21.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1)':
     dependencies:
-      '@tanstack/table-core': 8.20.5
+      '@tanstack/table-core': 8.21.3
       react: 18.3.1
       react-dom: 18.3.1(react@18.3.1)
 
-  '@tanstack/table-core@8.20.5': {}
+  '@tanstack/table-core@8.21.3': {}
 
   '@tootallnate/once@2.0.0': {}