diff --git a/opencti-platform/opencti-front/src/components/dataGrid/components/DataTableBody.tsx b/opencti-platform/opencti-front/src/components/dataGrid/components/DataTableBody.tsx index 04849afaa526..8a6cf4138926 100644 --- a/opencti-platform/opencti-front/src/components/dataGrid/components/DataTableBody.tsx +++ b/opencti-platform/opencti-front/src/components/dataGrid/components/DataTableBody.tsx @@ -102,7 +102,7 @@ const DataTableBody = ({ } // From there, currentRefContainer is not null /* eslint-disable @typescript-eslint/no-non-null-assertion */ - const clientWidth = currentRefContainer!.clientWidth - storedSize; // Scrollbar size to prevent alignment issues + const clientWidth = currentRefContainer!.clientWidth - storedSize - 10; // Scrollbar size to prevent alignment issues for (let i = startsWithSelect ? 1 : 0; i < columns.length - (endsWithNavigate ? 1 : 0); i += 1) { const column = reset ? columns[i] : { ...columns[i], ...localStorageColumns[columns[i].id] }; const shouldCompute = (!column.size || resize || !localStorageColumns[columns[i].id]?.size) && (column.percentWidth && Boolean(computeState)); @@ -146,8 +146,8 @@ const DataTableBody = ({ } else { currentRefContainer!.style.overflow = 'hidden'; } - colSizes['--header-table-size'] = tableSize; - colSizes['--col-table-size'] = tableSize; + colSizes['--header-table-size'] = tableSize + 10; + colSizes['--col-table-size'] = tableSize + 10; if (variant === DataTableVariant.widget) { if (!rootRef) { throw Error('Invalid configuration for widget list'); diff --git a/opencti-platform/opencti-front/src/components/dataGrid/components/DataTableLine.tsx b/opencti-platform/opencti-front/src/components/dataGrid/components/DataTableLine.tsx index b77d21b38d81..fd451745baec 100644 --- a/opencti-platform/opencti-front/src/components/dataGrid/components/DataTableLine.tsx +++ b/opencti-platform/opencti-front/src/components/dataGrid/components/DataTableLine.tsx @@ -143,8 +143,6 @@ const DataTableLine = ({ const endWithNavigate = effectiveColumns.at(-1)?.id === 'navigate'; const handleSelectLine = (event: React.MouseEvent) => { - event.preventDefault(); - event.stopPropagation(); if (event.shiftKey) { onToggleShiftEntity(index, data, event); } else { @@ -152,19 +150,24 @@ const DataTableLine = ({ } }; + const handleNavigate = (event: React.MouseEvent) => { + if (event.ctrlKey) { + window.open(link, '_blank'); + } else { + navigate(link); + } + }; + const handleRowClick = (event: React.MouseEvent) => { event.preventDefault(); event.stopPropagation(); + if (selectOnLineClick) { handleSelectLine(event); } else if (onLineClick) { onLineClick(data); - } else if (navigable) { - if (event.ctrlKey) { - window.open(link, '_blank'); - } else { - navigate(link); - } + } else { + handleNavigate(event); } }; @@ -172,39 +175,44 @@ const DataTableLine = ({
- {startsWithSelect && ( -
- - + {startsWithSelect && ( +
+ + +
+ )} + {effectiveColumns.slice(startsWithSelect ? 1 : 0, (actions || disableNavigation) ? undefined : -1).map((column) => ( + -
- )} - {effectiveColumns.slice(startsWithSelect ? 1 : 0, (actions || disableNavigation) ? undefined : -1).map((column) => ( - - ))} + ))} + {(actions || endWithNavigate) && (
e.stopPropagation()} + onMouseDown={(e) => { + e.preventDefault(); + e.stopPropagation(); + }} + onClick={(e) => { + e.preventDefault(); + e.stopPropagation(); + }} + onMouseUp={(e) => { + e.preventDefault(); + e.stopPropagation(); + }} > {actions && actions(data)} {endWithNavigate && (