fix(ui-clusters): improve cell number values accuracy by using roundi…

…ng instead of truncating columns modified: * 'Enabled / Installed (MW)' in Thermals and Renewables * 'Nominal Capacity (MW)' in Renewables * 'Injection capacity from stock to the network (MW)' in Storages * 'Withdrawal (MW)' in Storages * 'Efficiency (%)' in Storages * 'Initial level (%)' in Storages
AntaresSimulatorTeam · Jul 10, 2024 · 3d441e6 · 3d441e6
1 parent a2ac082
commit 3d441e6
Show file tree

Hide file tree

Showing 4 changed files with 55 additions and 54 deletions.
diff --git a/webapp/src/components/App/Singlestudy/explore/Modelization/Areas/Renewables/index.tsx b/webapp/src/components/App/Singlestudy/explore/Modelization/Areas/Renewables/index.tsx
@@ -20,6 +20,7 @@ import {
   addClusterCapacity,
   capacityAggregationFn,
   getClustersWithCapacityTotals,
+  toCapacityString,
 } from "../common/clustersUtils";
 import { TRow } from "../../../../../../common/GroupedDataTable/types";
 import BooleanCell from "../../../../../../common/GroupedDataTable/cellRenderers/BooleanCell";
@@ -80,29 +81,26 @@ function Renewables() {
       columnHelper.accessor("nominalCapacity", {
         header: "Nominal Capacity (MW)",
         size: 220,
-        Cell: ({ cell }) => Math.floor(cell.getValue()),
-      }),
-      columnHelper.accessor("installedCapacity", {
-        header: "Enabled / Installed (MW)",
-        size: 220,
-        aggregationFn: capacityAggregationFn(),
-        AggregatedCell: ({ cell }) => (
-          <Box sx={{ color: "info.main", fontWeight: "bold" }}>
-            {cell.getValue() ?? ""}
-          </Box>
-        ),
-        Cell: ({ row }) => (
-          <>
-            {Math.floor(row.original.enabledCapacity)} /{" "}
-            {Math.floor(row.original.installedCapacity)}
-          </>
-        ),
-        Footer: () => (
-          <Box color="warning.main">
-            {totalEnabledCapacity} / {totalInstalledCapacity}
-          </Box>
-        ),
+        Cell: ({ cell }) => cell.getValue().toFixed(1),
       }),
+      columnHelper.accessor(
+        (row) => toCapacityString(row.enabledCapacity, row.installedCapacity),
+        {
+          header: "Enabled / Installed (MW)",
+          size: 220,
+          aggregationFn: capacityAggregationFn(),
+          AggregatedCell: ({ cell }) => (
+            <Box sx={{ color: "info.main", fontWeight: "bold" }}>
+              {cell.getValue()}
+            </Box>
+          ),
+          Footer: () => (
+            <Box color="warning.main">
+              {toCapacityString(totalEnabledCapacity, totalInstalledCapacity)}
+            </Box>
+          ),
+        },
+      ),
     ];
   }, [totals]);
 

diff --git a/webapp/src/components/App/Singlestudy/explore/Modelization/Areas/Storages/index.tsx b/webapp/src/components/App/Singlestudy/explore/Modelization/Areas/Storages/index.tsx
@@ -69,13 +69,13 @@ function Storages() {
         aggregationFn: "sum",
         AggregatedCell: ({ cell }) => (
           <Box sx={{ color: "info.main", fontWeight: "bold" }}>
-            {Math.floor(cell.getValue())}
+            {Math.round(cell.getValue())}
           </Box>
         ),
-        Cell: ({ cell }) => Math.floor(cell.getValue()),
+        Cell: ({ cell }) => Math.round(cell.getValue()),
         Footer: () => (
           <Box color="warning.main">
-            {Math.floor(totalInjectionNominalCapacity)}
+            {Math.round(totalInjectionNominalCapacity)}
           </Box>
         ),
       }),
@@ -96,13 +96,13 @@ function Storages() {
         aggregationFn: "sum",
         AggregatedCell: ({ cell }) => (
           <Box sx={{ color: "info.main", fontWeight: "bold" }}>
-            {Math.floor(cell.getValue())}
+            {Math.round(cell.getValue())}
           </Box>
         ),
-        Cell: ({ cell }) => Math.floor(cell.getValue()),
+        Cell: ({ cell }) => Math.round(cell.getValue()),
         Footer: () => (
           <Box color="warning.main">
-            {Math.floor(totalWithdrawalNominalCapacity)}
+            {Math.round(totalWithdrawalNominalCapacity)}
           </Box>
         ),
       }),
@@ -123,12 +123,12 @@ function Storages() {
       columnHelper.accessor("efficiency", {
         header: t("study.modelization.storages.efficiency"),
         size: 50,
-        Cell: ({ cell }) => `${Math.floor(cell.getValue() * 100)}`,
+        Cell: ({ cell }) => `${Math.round(cell.getValue() * 100)}`,
       }),
       columnHelper.accessor("initialLevel", {
         header: t("study.modelization.storages.initialLevel"),
         size: 50,
-        Cell: ({ cell }) => `${Math.floor(cell.getValue() * 100)}`,
+        Cell: ({ cell }) => `${Math.round(cell.getValue() * 100)}`,
       }),
       columnHelper.accessor("initialLevelOptim", {
         header: t("study.modelization.storages.initialLevelOptim"),

diff --git a/webapp/src/components/App/Singlestudy/explore/Modelization/Areas/Thermal/index.tsx b/webapp/src/components/App/Singlestudy/explore/Modelization/Areas/Thermal/index.tsx
@@ -20,6 +20,7 @@ import {
   addClusterCapacity,
   capacityAggregationFn,
   getClustersWithCapacityTotals,
+  toCapacityString,
 } from "../common/clustersUtils";
 import { TRow } from "../../../../../../common/GroupedDataTable/types";
 import BooleanCell from "../../../../../../common/GroupedDataTable/cellRenderers/BooleanCell";
@@ -84,27 +85,24 @@ function Thermal() {
         size: 220,
         Cell: ({ cell }) => cell.getValue().toFixed(1),
       }),
-      columnHelper.accessor("installedCapacity", {
-        header: "Enabled / Installed (MW)",
-        size: 220,
-        aggregationFn: capacityAggregationFn(),
-        AggregatedCell: ({ cell }) => (
-          <Box sx={{ color: "info.main", fontWeight: "bold" }}>
-            {cell.getValue() ?? ""}
-          </Box>
-        ),
-        Cell: ({ row }) => (
-          <>
-            {Math.floor(row.original.enabledCapacity)} /{" "}
-            {Math.floor(row.original.installedCapacity)}
-          </>
-        ),
-        Footer: () => (
-          <Box color="warning.main">
-            {totalEnabledCapacity} / {totalInstalledCapacity}
-          </Box>
-        ),
-      }),
+      columnHelper.accessor(
+        (row) => toCapacityString(row.enabledCapacity, row.installedCapacity),
+        {
+          header: "Enabled / Installed (MW)",
+          size: 220,
+          aggregationFn: capacityAggregationFn(),
+          AggregatedCell: ({ cell }) => (
+            <Box sx={{ color: "info.main", fontWeight: "bold" }}>
+              {cell.getValue()}
+            </Box>
+          ),
+          Footer: () => (
+            <Box color="warning.main">
+              {toCapacityString(totalEnabledCapacity, totalInstalledCapacity)}
+            </Box>
+          ),
+        },
+      ),
       columnHelper.accessor("marketBidCost", {
         header: "Market Bid (€/MWh)",
         size: 50,

diff --git a/webapp/src/components/App/Singlestudy/explore/Modelization/Areas/common/clustersUtils.ts b/webapp/src/components/App/Singlestudy/explore/Modelization/Areas/common/clustersUtils.ts
@@ -2,6 +2,13 @@ import { MRT_AggregationFn } from "material-react-table";
 import { ThermalClusterWithCapacity } from "../Thermal/utils";
 import { RenewableClusterWithCapacity } from "../Renewables/utils";
 
+export function toCapacityString(
+  enabledCapacity: number,
+  installedCapacity: number,
+) {
+  return `${Math.round(enabledCapacity)} / ${Math.round(installedCapacity)}`;
+}
+
 /**
  * Custom aggregation function summing the values of each row,
  * to display enabled and installed capacity in the same cell. This function is
@@ -29,9 +36,7 @@ export const capacityAggregationFn = <
       { enabledCapacitySum: 0, installedCapacitySum: 0 },
     );
 
-    return `${Math.floor(enabledCapacitySum)} / ${Math.floor(
-      installedCapacitySum,
-    )}`;
+    return toCapacityString(enabledCapacitySum, installedCapacitySum);
   };
 };