fix(ui-results): disable stretch to fix display issue

AntaresSimulatorTeam · Feb 23, 2024 · 9be770e · 9be770e
1 parent 35947e1
commit 9be770e
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 3 deletions.
diff --git a/webapp/src/components/App/Singlestudy/explore/Results/ResultDetails/index.tsx b/webapp/src/components/App/Singlestudy/explore/Results/ResultDetails/index.tsx
@@ -368,6 +368,7 @@ function ResultDetails() {
                     <EditableMatrix
                       matrix={matrix}
                       matrixTime={false}
+                      stretch={false}
                       readOnly
                     />
                   )

diff --git a/webapp/src/components/common/EditableMatrix/index.tsx b/webapp/src/components/common/EditableMatrix/index.tsx
@@ -28,6 +28,7 @@ interface PropTypes {
   rowNames?: string[];
   computStats?: MatrixStats;
   isPercentDisplayEnabled?: boolean;
+  stretch?: boolean;
 }
 
 type CellType = Array<number | string | boolean>;
@@ -55,6 +56,7 @@ function EditableMatrix(props: PropTypes) {
     rowNames,
     computStats,
     isPercentDisplayEnabled = false,
+    stretch = true,
   } = props;
   const { data = [], columns = [], index = [] } = matrix;
   const prependIndex = index.length > 0 && matrixTime;
@@ -176,7 +178,7 @@ function EditableMatrix(props: PropTypes) {
         data={grid}
         width="100%"
         height="100%"
-        stretchH="all"
+        stretchH={stretch ? "all" : "none"}
         className="editableMatrix"
         colHeaders
         rowHeaderWidth={matrixRowNames ? 150 : undefined}
@@ -186,7 +188,6 @@ function EditableMatrix(props: PropTypes) {
         beforeKeyDown={(e) => handleKeyDown(e)}
         columns={formattedColumns}
         rowHeaders={matrixRowNames || true}
-        manualColumnResize
       />
     </Root>
   );

diff --git a/webapp/src/components/common/EditableMatrix/style.ts b/webapp/src/components/common/EditableMatrix/style.ts
@@ -6,7 +6,7 @@ export const Root = styled(Box)(({ theme }) => ({
   display: "flex",
   flexDirection: "column",
   alignItems: "center",
-  overflow: "auto",
+  overflow: "hidden",
 }));
 
 export const StyledButton = styled(Button)(({ theme }) => ({