feat(ui-hydro): add data adapter for Allocation and Correlation

Temporary solution to convert API numeric arrays to string arrays for Matrix 
component headers. Will be removed when API model is updated to return proper 
string labels.

webapp/src/components/App/Singlestudy/explore/Modelization/Areas/Hydro/HydroMatrixDialog.tsx

@@ -12,22 +12,91 @@
  * This file is part of the Antares project.
  */
 
-import { Button, Box } from "@mui/material";
+import { Button, Box, Skeleton } from "@mui/material";
 import { useTranslation } from "react-i18next";
+import { useState, useEffect } from "react";
 import BasicDialog, {
   BasicDialogProps,
 } from "../../../../../../common/dialogs/BasicDialog";
-import HydroMatrix from "./HydroMatrix";
+import Matrix from "../../../../../../common/Matrix";
 import { HydroMatrixType } from "./utils";
+import { getAllocationMatrix } from "./Allocation/utils";
+import { getCorrelationMatrix } from "./Correlation/utils";
+import { useOutletContext } from "react-router";
+import { StudyMetadata } from "../../../../../../../common/types";
+import { MatrixDataDTO } from "@/components/common/Matrix/shared/types";
+import useEnqueueErrorSnackbar from "@/hooks/useEnqueueErrorSnackbar";
+import { AxiosError } from "axios";
+
+interface AdaptedMatrixData {
+  data: number[][];
+  columns: string[];
+  index: string[];
+}
 
 interface Props {
   open: boolean;
   onClose: () => void;
   type: HydroMatrixType;
 }
 
+const MATRIX_FETCHERS = {
+  Allocation: getAllocationMatrix,
+  Correlation: getCorrelationMatrix,
+} as const;
+
 function HydroMatrixDialog({ open, onClose, type }: Props) {
+  /**
+   * !TEMPORARY SOLUTION - Matrix Data Model Adaptation
+   *
+   * This component handles a specific case (Allocation, Correlation).
+   * They receive their columns and row headers from the backend as numeric arrays.
+   * This differs from the standard Matrix component usage where these properties expect string arrays
+   * representing actual header labels.
+   *
+   * Current scenario:
+   * - Backend returns {columns: number[], index: number[]} for these specific matrices
+   * - Matrix component expects {columns: string[], rowHeaders: string[]} for its headers
+   *
+   * Future API model update will:
+   * - Rename 'index' to 'rowHeaders' to better reflect its purpose
+   * - Return properly formatted string arrays for header labels
+   * - Allow using the standard HydroMatrix component without this adapter
+   *
+   * TODO - Once the API is updated:
+   * 1. The model adapter layer will be removed
+   * 2. These matrices will use the HydroMatrix component directly
+   * 3. All matrices will follow the same data structure pattern
+   */
+
   const { t } = useTranslation();
+  const { study } = useOutletContext<{ study: StudyMetadata }>();
+  const enqueueErrorSnackbar = useEnqueueErrorSnackbar();
+  const fetchFn = MATRIX_FETCHERS[type as keyof typeof MATRIX_FETCHERS];
+  const [matrix, setMatrix] = useState<AdaptedMatrixData | undefined>(
+    undefined,
+  );
+
+  const matrixModelAdapter = (apiData: MatrixDataDTO): AdaptedMatrixData => ({
+    data: apiData.data,
+    columns: apiData.columns.map(String),
+    index: apiData.index.map(String), // Will be renamed to rowHeaders in future API version
+  });
+
+  useEffect(() => {
+    const fetchData = async () => {
+      try {
+        const data = await fetchFn(study.id);
+        setMatrix(matrixModelAdapter(data));
+      } catch (error) {
+        enqueueErrorSnackbar(t("data.error.matrix"), error as AxiosError);
+      }
+    };
+
+    fetchData();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [study.id, type, t]);
+
   const dialogProps: BasicDialogProps = {
     open,
     onClose,
@@ -38,6 +107,10 @@ function HydroMatrixDialog({ open, onClose, type }: Props) {
     ),
   };
 
+  ////////////////////////////////////////////////////////////////
+  // JSX
+  ////////////////////////////////////////////////////////////////
+
   return (
     <BasicDialog
       {...dialogProps}
@@ -48,7 +121,21 @@ function HydroMatrixDialog({ open, onClose, type }: Props) {
       maxWidth="xl"
     >
       <Box sx={{ width: 1, height: 1, p: 2 }}>
-        <HydroMatrix type={type} />
+        {matrix ? (
+          <Matrix
+            title={`${type} Matrix`}
+            url=""
+            customColumns={matrix.columns}
+            customRowHeaders={matrix.index}
+            fetchMatrixData={fetchFn}
+            readOnly
+            enableDateTimeColumn={false}
+            enableTimeSeriesColumns={false}
+            isImportDisabled
+          />
+        ) : (
+          <Skeleton sx={{ height: 1, transform: "none" }} />
+        )}
       </Box>
     </BasicDialog>
   );