lock cusheet edits

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/declarations/declaration.d.ts

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

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,9 @@ export default function CuesheetTable(props: CuesheetTableProps) {
   const { data, columns, showModal } = props;
 
   const { updateEvent, updateTimer } = useEventAction();
+  const [searchParams] = useSearchParams();
+  const blockEdits = searchParams.get('locked') ?? false;
+
   const { followSelected, showDelayedTimes, hideTableSeconds } = useCuesheetOptions();
   const { columnVisibility, columnOrder, columnSizing, resetColumnOrder, setColumnVisibility, setColumnSizing } =
     useColumnManager(columns);
@@ -77,6 +81,7 @@ export default function CuesheetTable(props: CuesheetTableProps) {
       options: {
         showDelayedTimes,
         hideTableSeconds,
+        allowEdits: !blockEdits,
       },
     },
   });

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.allowEdits}
+    >
       {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.allowEdits}
+    >
       {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.allowEdits}
+    >
       {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.allowEdits}
+    />
+  );
 }
 
 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.allowEdits}
+    />
+  );
 }
 
 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.allowEdits}
+    />
+  );
 }
 
 export function makeCuesheetColumns(customFields: CustomFields): ColumnDef<OntimeRundownEntry>[] {