From 8eded98a0b953252b12a2f38ffe31e9bdc30244f Mon Sep 17 00:00:00 2001
From: PotapovaA <a.m.d.s@mail.ru>
Date: Wed, 19 Aug 2026 18:48:09 +0300
Subject: [PATCH] sticky column

---
 web/src/components/RealtimeTable/TableHead/TableHead.jsx | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/web/src/components/RealtimeTable/TableHead/TableHead.jsx b/web/src/components/RealtimeTable/TableHead/TableHead.jsx
index 8a2385c..16c63ad 100644
--- a/web/src/components/RealtimeTable/TableHead/TableHead.jsx
+++ b/web/src/components/RealtimeTable/TableHead/TableHead.jsx
@@ -110,6 +110,8 @@ const HeaderCell = ({ header, table, pinningPosition, onClick, onChangeWidth })
 	const isPinned = Boolean(pinningPosition);
 	const leftOffset = pinningPosition === 'left' ? header.getStart() : undefined;
 	const rightOffset = pinningPosition === 'right' ? table.getRightTotalSize() - header.getStart() - headerSize : undefined;
+	const stickyTextLeft = isPinned ? undefined : table.getLeftTotalSize();
+	const stickyTextRight = isPinned ? undefined : table.getRightTotalSize();
 
 	const customBgColor = column.columnDef?.muiTableHeadCellProps?.sx?.backgroundColor;
 
@@ -161,11 +163,16 @@ const HeaderCell = ({ header, table, pinningPosition, onClick, onChangeWidth })
 				<div
 					style={{
 						textAlign: 'center',
-						position: 'relative',
+						position: isPinned ? 'relative' : 'sticky',
+						left: stickyTextLeft,
+						right: stickyTextRight,
+						zIndex: 1,
 						paddingRight: '0.5rem',
 						paddingLeft: '0.5rem',
 						backgroundColor: backgroundColor,
 						color: color,
+						maxWidth: 'calc(100% - 1rem)',
+						boxSizing: 'border-box',
 					}}>
 					{header.isPlaceholder ? null : column.columnDef.header}
 				</div>