@gridsuite/commons-ui 0.228.0 → 0.229.0

package/dist/translations/fr/commonButtonFr.js

@@ -1,6 +1,8 @@
 const commonButtonFr = {
   cancel: "Annuler",
   validate: "Valider",
+  add: "Ajouter",
+  replace: "Remplacer",
   "button.changeType": "Modifier",
   "button.changeOperator": "Modifier",
   "button.restore": "Restaurer"

package/dist/translations/fr/csvFr.d.ts

@@ -5,11 +5,12 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
  */
 export declare const csvFr: {
-    ImportCSV: string;
     noDataInCsvFile: string;
     wrongCsvHeadersError: string;
     keepCSVDataMessage: string;
     GenerateCSV: string;
+    DownloadCSV: string;
     UploadCSV: string;
     uploadMessage: string;
+    tooManyLinesInCsvFile: string;
 };

package/dist/translations/fr/csvFr.js

@@ -1,11 +1,12 @@
 const csvFr = {
-  ImportCSV: "Import CSV",
-  noDataInCsvFile: "Aucune donnée trouvée dans ce fichier",
-  wrongCsvHeadersError: "Les en-têtes du fichier CSV sont incorrects. Utilisez le bouton Générer le modèle CSV pour obtenir le format CSV pris en charge",
+  noDataInCsvFile: 'Aucune donnée trouvée dans le fichier "{filename}"',
+  wrongCsvHeadersError: 'Les en-têtes du fichier "{filename}" sont incorrects. Utilisez le bouton Générer le modèle CSV pour obtenir le format CSV pris en charge',
   keepCSVDataMessage: "Voulez-vous remplacer la liste existante ou y ajouter les nouvelles données ?",
   GenerateCSV: "Générer le modèle CSV",
-  UploadCSV: "Télécharger le CSV",
-  uploadMessage: " Aucun fichier sélectionné"
+  DownloadCSV: "Télécharger en CSV",
+  UploadCSV: "Charger un CSV",
+  uploadMessage: " Aucun fichier sélectionné",
+  tooManyLinesInCsvFile: 'Le nombre de lignes dans le fichier "{filename}" ne doit pas dépasser {value}'
 };
 export {
   csvFr

package/dist/utils/algos.d.ts

@@ -5,3 +5,4 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
  */
 export declare function equalsArray<T>(a: T[] | null, b: T[]): boolean;
+export declare function equalsArrayAnyOrder<T>(a: T[] | null, b: T[] | null): boolean;

package/dist/utils/algos.js

@@ -21,6 +21,18 @@ function equalsArray(a, b) {
   }
   return true;
 }
+function equalsArrayAnyOrder(a, b) {
+  if (a === b) {
+    return true;
+  }
+  if (!a || !b || a.length !== b.length) {
+    return false;
+  }
+  const sortedA = [...a].sort();
+  const sortedB = [...b].sort();
+  return sortedA.every((value, index) => value === sortedB[index]);
+}
 export {
-  equalsArray
+  equalsArray,
+  equalsArrayAnyOrder
 };

package/dist/utils/functions.d.ts

@@ -4,6 +4,11 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
  */
+/**
+ * Returns true when the given form rows contain at least one cell with a
+ * non-empty value (excluding the AG_GRID_ROW_UUID identifier column).
+ */
+export declare const hasNonEmptyRows: (rows: unknown) => boolean;
 /**
  * function to generate a key
  * @returns {number} key

package/dist/utils/functions.js

@@ -1,3 +1,7 @@
+import { FieldConstants } from "./constants/fieldConstants.js";
+const hasNonEmptyRows = (rows) => Array.isArray(rows) && rows.some(
+  (row) => row && Object.keys(row).filter((key) => key !== FieldConstants.AG_GRID_ROW_UUID).some((key) => row[key] !== void 0 && row[key] !== null && String(row[key]).trim().length > 0)
+);
 function keyGenerator() {
   let key = 1;
   return () => {
@@ -19,6 +23,7 @@ const isObjectEmpty = (object) => object && Object.keys(object).length === 0;
 export {
   areArrayElementsUnique,
   arraysContainIdenticalStrings,
+  hasNonEmptyRows,
   isEmpty,
   isObjectEmpty,
   keyGenerator

package/dist/utils/index.js

@@ -1,4 +1,4 @@
-import { equalsArray } from "./algos.js";
+import { equalsArray, equalsArrayAnyOrder } from "./algos.js";
 import { ActivePowerAdornment, AmpereAdornment, KiloAmpereAdornment, KilometerAdornment, MVAPowerAdornment, MicroSusceptanceAdornment, OhmAdornment, PercentageAdornment, ReactivePowerAdornment, SusceptanceAdornment, VoltageAdornment } from "./constants/adornments.js";
 import { FetchStatus } from "./constants/fetchStatus.js";
 import { FieldConstants } from "./constants/fieldConstants.js";
@@ -9,9 +9,9 @@ import { FILTERS, FILTER_ID, FILTER_NAME, ID } from "./constants/filterConstant.
 import { DUPLICATED_PROPS_ERROR, YUP_DEFAULT, YUP_NOT_NULL, YUP_NOT_TYPE_DEFAULT, YUP_NOT_TYPE_NUMBER, YUP_POSITIVE, YUP_REQUIRED } from "./constants/translationKeys.js";
 import { GRIDSUITE_DEFAULT_PRECISION, convertInputValue, convertOutputValue, isBlankOrEmpty, kiloUnitToUnit, microUnitToUnit, roundToDefaultPrecision, roundToPrecision, toModificationOperation, unitToKiloUnit, unitToMicroUnit } from "./conversionUtils.js";
 import { catchErrorHandler, extractErrorMessageDescriptor, snackWithFallback } from "./error.js";
-import { areArrayElementsUnique, arraysContainIdenticalStrings, isEmpty, isObjectEmpty, keyGenerator } from "./functions.js";
+import { areArrayElementsUnique, arraysContainIdenticalStrings, hasNonEmptyRows, isEmpty, isObjectEmpty, keyGenerator } from "./functions.js";
 import { getEquipmentTypeShortLabel } from "./labelUtils.js";
-import { LANG_ENGLISH, LANG_FRENCH, LANG_SYSTEM } from "./langs.js";
+import { LANG_ENGLISH, LANG_FRENCH, LANG_SYSTEM, getCsvDelimiter } from "./langs.js";
 import { getFileIcon } from "./mapper/getFileIcon.js";
 import { equipmentTypesForPredefinedPropertiesMapper } from "./mapper/equipmentTypesForPredefinedPropertiesMapper.js";
 import { copyToClipboard } from "./navigator-clipboard.js";
@@ -150,10 +150,12 @@ export {
   convertOutputValue,
   copyToClipboard,
   equalsArray,
+  equalsArrayAnyOrder,
   equipmentStyles,
   equipmentTypesForPredefinedPropertiesMapper,
   extractErrorMessageDescriptor,
   getConnectionDirectionLabel,
+  getCsvDelimiter,
   getEnergySourceLabel,
   getEquipmentTypeShortLabel,
   getEquipmentsInfosForSearchBar,
@@ -163,6 +165,7 @@ export {
   getLabelOrValue,
   getLoadTypeLabel,
   getObjectId,
+  hasNonEmptyRows,
   isBlankOrEmpty,
   isEmpty,
   isInjection,

package/dist/utils/langs.d.ts

@@ -3,3 +3,4 @@ export declare const LANG_ENGLISH = "en";
 export declare const LANG_FRENCH = "fr";
 export type GsLangUser = typeof LANG_ENGLISH | typeof LANG_FRENCH;
 export type GsLang = GsLangUser | typeof LANG_SYSTEM;
+export declare function getCsvDelimiter(language: string | undefined): ';' | ',';

package/dist/utils/langs.js

@@ -1,8 +1,12 @@
 const LANG_SYSTEM = "sys";
 const LANG_ENGLISH = "en";
 const LANG_FRENCH = "fr";
+function getCsvDelimiter(language) {
+  return language === LANG_FRENCH ? ";" : ",";
+}
 export {
   LANG_ENGLISH,
   LANG_FRENCH,
-  LANG_SYSTEM
+  LANG_SYSTEM,
+  getCsvDelimiter
 };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@gridsuite/commons-ui",
-    "version": "0.228.0",
+    "version": "0.229.0",
     "description": "common react components for gridsuite applications",
     "author": "gridsuite team",
     "homepage": "https://github.com/gridsuite",
@@ -58,7 +58,6 @@
         "mui-nested-menu": "^4.0.1",
         "oidc-client-ts": "^3.5.0",
         "prop-types": "^15.8.1",
-        "react-csv-downloader": "^3.3.0",
         "react-dnd": "^16.0.1",
         "react-dnd-html5-backend": "^16.0.1",
         "react-querybuilder": "^8.11.0",

package/dist/components/composite/agGridTable/BottomRightButtons.d.ts

@@ -1,14 +0,0 @@
-import { FieldValues, UseFieldArrayReturn } from 'react-hook-form';
-export interface BottomRightButtonsProps {
-    name: string;
-    disableUp: boolean;
-    disableDown: boolean;
-    disableDelete: boolean;
-    handleAddRow: () => void;
-    handleDeleteRows: () => void;
-    handleMoveRowUp: () => void;
-    handleMoveRowDown: () => void;
-    useFieldArrayOutput: UseFieldArrayReturn<FieldValues, string, 'id'>;
-    csvProps: any;
-}
-export declare function BottomRightButtons({ name, disableUp, disableDown, disableDelete, handleAddRow, handleDeleteRows, handleMoveRowUp, handleMoveRowDown, useFieldArrayOutput, csvProps, }: BottomRightButtonsProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/composite/agGridTable/BottomRightButtons.js

@@ -1,62 +0,0 @@
-import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import { styled, IconButton, Grid, Box } from "@mui/material";
-import { Upload, ControlPoint, Delete, ArrowCircleUp, ArrowCircleDown } from "@mui/icons-material";
-import { useState } from "react";
-import { useIntl } from "react-intl";
-import { CustomTooltip } from "../../ui/tooltip/CustomTooltip.js";
-import { ErrorInput } from "../../ui/reactHookForm/errorManagement/ErrorInput.js";
-import { FieldErrorAlert } from "../../ui/reactHookForm/errorManagement/FieldErrorAlert.js";
-import { CsvUploader } from "./csvUploader/CsvUploader.js";
-const InnerColoredButton = styled(IconButton)(({ theme }) => {
-  return {
-    color: theme.palette.primary.main
-  };
-});
-function BottomRightButtons({
-  name,
-  disableUp,
-  disableDown,
-  disableDelete,
-  handleAddRow,
-  handleDeleteRows,
-  handleMoveRowUp,
-  handleMoveRowDown,
-  useFieldArrayOutput,
-  csvProps
-}) {
-  const [uploaderOpen, setUploaderOpen] = useState(false);
-  const intl = useIntl();
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs(Grid, { container: true, paddingTop: 1, paddingLeft: 2, children: [
-      /* @__PURE__ */ jsx(Grid, { item: true, xs: 1, children: csvProps && /* @__PURE__ */ jsx(InnerColoredButton, { onClick: () => setUploaderOpen(true), children: /* @__PURE__ */ jsx(
-        CustomTooltip,
-        {
-          title: intl.formatMessage({
-            id: "ImportCSV"
-          }),
-          children: /* @__PURE__ */ jsx(Upload, {})
-        }
-      ) }) }),
-      /* @__PURE__ */ jsxs(Grid, { item: true, xs: 11, sx: { display: "flex", justifyContent: "right" }, children: [
-        /* @__PURE__ */ jsx(InnerColoredButton, { onClick: handleAddRow, children: /* @__PURE__ */ jsx(ControlPoint, {}) }, "addButton"),
-        /* @__PURE__ */ jsx(InnerColoredButton, { onClick: handleDeleteRows, disabled: disableDelete, children: /* @__PURE__ */ jsx(Delete, {}) }, "DeleteButton"),
-        /* @__PURE__ */ jsx(InnerColoredButton, { disabled: disableUp, onClick: handleMoveRowUp, children: /* @__PURE__ */ jsx(ArrowCircleUp, {}) }, "upButton"),
-        /* @__PURE__ */ jsx(InnerColoredButton, { disabled: disableDown, onClick: handleMoveRowDown, children: /* @__PURE__ */ jsx(ArrowCircleDown, {}) }, "downButton")
-      ] })
-    ] }),
-    /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(ErrorInput, { name, InputField: FieldErrorAlert }) }),
-    /* @__PURE__ */ jsx(
-      CsvUploader,
-      {
-        open: uploaderOpen,
-        onClose: () => setUploaderOpen(false),
-        name,
-        useFieldArrayOutput,
-        ...csvProps
-      }
-    )
-  ] });
-}
-export {
-  BottomRightButtons
-};

package/dist/components/composite/agGridTable/csvUploader/CsvUploader.d.ts

@@ -1,15 +0,0 @@
-import { GsLang } from '../../../../utils';
-export interface CsvUploaderProps {
-    name: string;
-    onClose: () => void;
-    open: boolean;
-    title: string[];
-    fileHeaders: string[];
-    fileName: string;
-    csvData: unknown;
-    validateData: (rows: string[][]) => boolean;
-    getDataFromCsv: any;
-    useFieldArrayOutput: any;
-    language: GsLang;
-}
-export declare function CsvUploader({ name, onClose, open, title, fileHeaders, fileName, csvData, validateData, getDataFromCsv, useFieldArrayOutput, language, }: Readonly<CsvUploaderProps>): import("react/jsx-runtime").JSX.Element;

package/dist/components/composite/agGridTable/csvUploader/CsvUploader.js

@@ -1,182 +0,0 @@
-import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import { Dialog, DialogTitle, DialogContent, Grid, Button, Alert, DialogActions, DialogContentText } from "@mui/material";
-import { useCSVReader, RECORD_SEP, UNIT_SEP } from "react-papaparse";
-import React, { useState, useMemo } from "react";
-import { useIntl, FormattedMessage } from "react-intl";
-import CsvDownloader from "react-csv-downloader";
-import { useWatch } from "react-hook-form";
-import { FieldConstants } from "../../../../utils/constants/fieldConstants.js";
-import "../../../../utils/conversionUtils.js";
-import "../../../../utils/types/equipmentType.js";
-import { LANG_FRENCH } from "../../../../utils/langs.js";
-import "@mui/icons-material";
-import { CancelButton } from "../../../ui/reactHookForm/utils/CancelButton.js";
-import "yup";
-function CsvUploader({
-  name,
-  onClose,
-  open,
-  title,
-  fileHeaders,
-  fileName,
-  csvData,
-  validateData = () => true,
-  getDataFromCsv,
-  useFieldArrayOutput,
-  language
-}) {
-  const watchTableValues = useWatch({ name });
-  const { append, replace } = useFieldArrayOutput;
-  const [createError, setCreateError] = React.useState("");
-  const intl = useIntl();
-  const { CSVReader } = useCSVReader();
-  const [importedData, setImportedData] = useState([]);
-  const [isConfirmationPopupOpen, setIsConfirmationPopupOpen] = useState(false);
-  const data = useMemo(() => {
-    const newData = [...[fileHeaders]];
-    if (Array.isArray(csvData)) {
-      csvData.forEach((row) => newData.push([row]));
-    }
-    return newData;
-  }, [csvData, fileHeaders]);
-  const handleClose = () => {
-    onClose();
-    setCreateError("");
-  };
-  const validateCsvFile = (rows) => {
-    if (rows.length === 0) {
-      setCreateError(intl.formatMessage({ id: "noDataInCsvFile" }));
-      return false;
-    }
-    for (let i = 0; i < fileHeaders.length; i++) {
-      if (fileHeaders[i] !== "" && rows[0][i] !== fileHeaders[i]) {
-        setCreateError(intl.formatMessage({ id: "wrongCsvHeadersError" }));
-        return false;
-      }
-    }
-    return validateData(rows);
-  };
-  const getResultsFromImportedData = () => {
-    return importedData.filter((row) => {
-      if (row[0].startsWith("#")) {
-        return false;
-      }
-      return row.some((column) => !!column?.trim());
-    });
-  };
-  const handleFileSubmit = (keepTableValues) => {
-    if (importedData.length !== 0) {
-      const result = getResultsFromImportedData();
-      if (validateCsvFile(result)) {
-        result.splice(0, 1);
-        const dataFromCsv = getDataFromCsv(result);
-        if (keepTableValues) {
-          append(dataFromCsv);
-        } else {
-          replace(dataFromCsv);
-        }
-        handleClose();
-      }
-    } else {
-      setCreateError(intl.formatMessage({ id: "noDataInCsvFile" }));
-    }
-  };
-  const handleOpenCSVConfirmationDataDialog = () => {
-    const isValuesInTable = Array.isArray(watchTableValues) && watchTableValues.some(
-      (val) => val && Object.keys(val).filter((key) => key !== FieldConstants.AG_GRID_ROW_UUID).some((e) => val[e] !== void 0 && val[e] !== null && String(val[e]).trim().length > 0)
-    );
-    if (isValuesInTable && getResultsFromImportedData().length > 0) {
-      setIsConfirmationPopupOpen(true);
-    } else {
-      setIsConfirmationPopupOpen(false);
-      handleFileSubmit(false);
-    }
-  };
-  const handleAddPopupConfirmation = () => {
-    handleFileSubmit(true);
-    setIsConfirmationPopupOpen(false);
-  };
-  const handleReplacePopupConfirmation = () => {
-    handleFileSubmit(false);
-    setIsConfirmationPopupOpen(false);
-  };
-  const handleCancelDialog = () => {
-    setIsConfirmationPopupOpen(false);
-  };
-  const renderConfirmationCsvData = () => {
-    return /* @__PURE__ */ jsxs(Dialog, { open: isConfirmationPopupOpen, "aria-labelledby": "dialog-confirmation-csv-data", children: [
-      /* @__PURE__ */ jsx(DialogTitle, { id: "dialog-confirmation-csv-data", children: "Confirmation" }),
-      /* @__PURE__ */ jsx(DialogContent, { children: /* @__PURE__ */ jsx(DialogContentText, { children: intl.formatMessage({ id: "keepCSVDataMessage" }) }) }),
-      /* @__PURE__ */ jsxs(DialogActions, { children: [
-        /* @__PURE__ */ jsx(CancelButton, { onClick: handleCancelDialog }),
-        /* @__PURE__ */ jsx(Button, { onClick: () => handleReplacePopupConfirmation(), variant: "outlined", children: /* @__PURE__ */ jsx(FormattedMessage, { id: "replace" }) }),
-        /* @__PURE__ */ jsx(Button, { onClick: () => handleAddPopupConfirmation(), variant: "outlined", children: /* @__PURE__ */ jsx(FormattedMessage, { id: "add" }) })
-      ] })
-    ] });
-  };
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs(Dialog, { open, onClose: handleClose, fullWidth: true, children: [
-      /* @__PURE__ */ jsx(DialogTitle, { children: title }),
-      /* @__PURE__ */ jsx(DialogContent, { children: /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, children: [
-          /* @__PURE__ */ jsx(Grid, { container: true, item: true, children: /* @__PURE__ */ jsx(Grid, { item: true, xs: 6, children: /* @__PURE__ */ jsx(
-            CsvDownloader,
-            {
-              datas: data,
-              filename: fileName,
-              separator: language === LANG_FRENCH ? ";" : ",",
-              children: /* @__PURE__ */ jsx(Button, { variant: "contained", children: /* @__PURE__ */ jsx(FormattedMessage, { id: "GenerateCSV" }) })
-            }
-          ) }) }),
-          /* @__PURE__ */ jsx(Grid, { container: true, item: true, spacing: 3, children: /* @__PURE__ */ jsx(
-            CSVReader,
-            {
-              onUploadAccepted: (results) => {
-                setImportedData([...results.data]);
-                setCreateError("");
-              },
-              config: {
-                // We use | for multi values in one cell, then we remove it from the default value for this config, to avoid delimiter autodetection
-                delimitersToGuess: [",", "	", ";", RECORD_SEP, UNIT_SEP],
-                delimiter: language === LANG_FRENCH ? ";" : ","
-              },
-              children: ({ getRootProps, acceptedFile }) => /* @__PURE__ */ jsxs(Grid, { item: true, children: [
-                /* @__PURE__ */ jsx(Button, { ...getRootProps(), variant: "contained", children: /* @__PURE__ */ jsx(FormattedMessage, { id: "UploadCSV" }) }),
-                /* @__PURE__ */ jsx(
-                  "span",
-                  {
-                    style: {
-                      marginLeft: "10px",
-                      fontWeight: "bold"
-                    },
-                    children: acceptedFile ? acceptedFile.name : intl.formatMessage({
-                      id: "uploadMessage"
-                    })
-                  }
-                )
-              ] })
-            }
-          ) })
-        ] }),
-        createError !== "" && /* @__PURE__ */ jsx(Alert, { severity: "error", children: createError })
-      ] }) }),
-      /* @__PURE__ */ jsxs(DialogActions, { children: [
-        /* @__PURE__ */ jsx(CancelButton, { onClick: handleClose }),
-        /* @__PURE__ */ jsx(
-          Button,
-          {
-            variant: "outlined",
-            onClick: () => handleOpenCSVConfirmationDataDialog(),
-            disabled: createError !== "",
-            "data-testid": "ValidateButton",
-            children: /* @__PURE__ */ jsx(FormattedMessage, { id: "validate" })
-          }
-        )
-      ] })
-    ] }),
-    renderConfirmationCsvData()
-  ] });
-}
-export {
-  CsvUploader
-};

package/dist/components/composite/agGridTable/csvUploader/index.js

@@ -1,4 +0,0 @@
-import { CsvUploader } from "./CsvUploader.js";
-export {
-  CsvUploader
-};