feature/IO-3545-Production-Board-List-DND - Checkpoint

client/src/App/App.styles.scss

@@ -446,3 +446,32 @@
 //.rbc-time-header-gutter {
 //  padding: 0;
 //}
+
+/* globally allow shrink inside table cells */
+.prod-list-table .ant-table-cell,
+.prod-list-table .ant-table-cell > * {
+  min-width: 0;
+}
+
+/* common AntD offenders */
+.prod-list-table > .ant-table-cell .ant-space,
+.ant-table-cell .ant-space-item {
+  min-width: 0;
+}
+
+/* Keep your custom header content on the left, push AntD sorter to the far right */
+.prod-list-table .ant-table-column-sorters {
+  display: flex !important;
+  align-items: center;
+  width: 100%;
+}
+
+.prod-list-table .ant-table-column-title {
+  flex: 1 1 auto;
+  min-width: 0; /* allows ellipsis to work */
+}
+
+.prod-list-table .ant-table-column-sorter {
+  margin-left: auto;
+  flex: 0 0 auto;
+}

client/src/components/production-list-table/production-list-table.component.jsx

@@ -472,6 +472,7 @@ export function ProductionListTable({ loading, data, refetch, bodyshop, technici
           <Table
             sticky
             tableLayout="fixed"
+            className="prod-list-table"
             pagination={false}
             size="small"
             {...(Production_List_Status_Colors.treatment === "on" &&

client/src/components/production-list-table/production-list-table.resizeable.component.jsx

@@ -18,12 +18,12 @@ const ResizableComponent = forwardRef((props, ref) => {
       onResizeStop={onResizeStop}
       draggableOpts={{ enableUserSelectHack: false }}
       resizeHandles={["e"]}
+      axis="x"
       handle={(axis, handleRef) => (
-        <span 
+        <span
-          ref={handleRef} 
+          ref={handleRef}
           className={`react-resizable-handle react-resizable-handle-${axis}`}
           onClick={(e) => e.stopPropagation()}
-          style={{ width: '10px', right: '-5px', cursor: 'col-resize' }}
         />
       )}
     >