From 3838bdc54d64c2b44a29b7abd583dc207918be07 Mon Sep 17 00:00:00 2001
From: Carlos Valente <carlosvalente@pm.me>
Date: Thu, 26 Mar 2026 17:45:49 +0100
Subject: [PATCH] fix: prevent hide index column from leaking between cuesheet
 and editor

---
 .../views/cuesheet/cuesheet-table/CuesheetTable.tsx   | 11 +++++++++--
 .../cuesheet-table-elements/CuesheetHeader.tsx        | 10 +++-------
 2 files changed, 12 insertions(+), 9 deletions(-)

diff --git a/apps/client/src/views/cuesheet/cuesheet-table/CuesheetTable.tsx b/apps/client/src/views/cuesheet/cuesheet-table/CuesheetTable.tsx
index e5030be90..238611fa8 100644
--- a/apps/client/src/views/cuesheet/cuesheet-table/CuesheetTable.tsx
+++ b/apps/client/src/views/cuesheet/cuesheet-table/CuesheetTable.tsx
@@ -206,9 +206,16 @@ export default function CuesheetTable({ columns, cuesheetMode, tableRoot, setCue
         : SortableCuesheetHeader;
 
       // if the table is being resized, we render non-sortable headers to avoid performance issues
-      return <HeaderComponent key={headerGroup.id} cuesheetMode={cuesheetMode} headerGroup={headerGroup} />;
+      return (
+        <HeaderComponent
+          key={headerGroup.id}
+          cuesheetMode={cuesheetMode}
+          headerGroup={headerGroup}
+          hideIndexColumn={hideIndexColumn}
+        />
+      );
     });
-  }, [cuesheetMode, table]);
+  }, [cuesheetMode, hideIndexColumn, table]);
 
   const isLoading = !data || status === 'pending';
 
diff --git a/apps/client/src/views/cuesheet/cuesheet-table/cuesheet-table-elements/CuesheetHeader.tsx b/apps/client/src/views/cuesheet/cuesheet-table/cuesheet-table-elements/CuesheetHeader.tsx
index 0704133fb..63b031bc7 100644
--- a/apps/client/src/views/cuesheet/cuesheet-table/cuesheet-table-elements/CuesheetHeader.tsx
+++ b/apps/client/src/views/cuesheet/cuesheet-table/cuesheet-table-elements/CuesheetHeader.tsx
@@ -5,7 +5,6 @@ import { CSSProperties } from 'react';
 import type { ExtendedEntry } from '../../../../common/utils/rundownMetadata';
 import { getAccessibleColour } from '../../../../common/utils/styleUtils';
 import { AppMode } from '../../../../ontimeConfig';
-import { usePersistedCuesheetOptions } from '../../cuesheet.options';
 import { Draggable, SortableCell, TableCell } from './SortableCell';
 
 import style from '../CuesheetTable.module.scss';
@@ -13,11 +12,10 @@ import style from '../CuesheetTable.module.scss';
 interface CuesheetHeaderProps {
   headerGroup: HeaderGroup<ExtendedEntry>;
   cuesheetMode: AppMode;
+  hideIndexColumn: boolean;
 }
 
-export function SortableCuesheetHeader({ headerGroup, cuesheetMode }: CuesheetHeaderProps) {
-  const hideIndexColumn = usePersistedCuesheetOptions((state) => state.hideIndexColumn);
-
+export function SortableCuesheetHeader({ headerGroup, cuesheetMode, hideIndexColumn }: CuesheetHeaderProps) {
   return (
     <tr key={headerGroup.id}>
       {cuesheetMode === AppMode.Edit && <th className={style.actionColumn} tabIndex={-1} />}
@@ -57,9 +55,7 @@ export function SortableCuesheetHeader({ headerGroup, cuesheetMode }: CuesheetHe
   );
 }
 
-export function CuesheetHeader({ headerGroup, cuesheetMode }: CuesheetHeaderProps) {
-  const hideIndexColumn = usePersistedCuesheetOptions((state) => state.hideIndexColumn);
-
+export function CuesheetHeader({ headerGroup, cuesheetMode, hideIndexColumn }: CuesheetHeaderProps) {
   return (
     <tr key={headerGroup.id}>
       {cuesheetMode === AppMode.Edit && <th className={style.actionColumn} tabIndex={-1} />}