@gridsuite/commons-ui 0.110.0 → 0.112.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/csvDownloader/csv-export.d.ts +2 -0
- package/dist/components/csvDownloader/csv-export.js +22 -0
- package/dist/components/csvDownloader/csv-export.type.d.ts +13 -0
- package/dist/components/csvDownloader/csv-export.type.js +1 -0
- package/dist/components/csvDownloader/export-csv-button.d.ts +7 -0
- package/dist/components/csvDownloader/export-csv-button.js +33 -0
- package/dist/components/csvDownloader/index.d.ts +10 -0
- package/dist/components/csvDownloader/index.js +8 -0
- package/dist/components/csvDownloader/use-csv-export.d.ts +4 -0
- package/dist/components/csvDownloader/use-csv-export.js +52 -0
- package/dist/components/index.d.ts +1 -0
- package/dist/components/index.js +6 -0
- package/dist/index.js +6 -0
- package/dist/translations/en/tableEn.d.ts +1 -0
- package/dist/translations/en/tableEn.js +2 -1
- package/dist/translations/fr/tableFr.d.ts +1 -0
- package/dist/translations/fr/tableFr.js +2 -1
- package/package.json +1 -1
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import { useCallback } from "react";
|
|
3
|
+
import { useCsvExport } from "./use-csv-export.js";
|
|
4
|
+
import { ExportCsvButton } from "./export-csv-button.js";
|
|
5
|
+
function CsvExport({
|
|
6
|
+
columns,
|
|
7
|
+
tableNamePrefix = "",
|
|
8
|
+
tableName,
|
|
9
|
+
disabled,
|
|
10
|
+
skipColumnHeaders = false,
|
|
11
|
+
language,
|
|
12
|
+
exportDataAsCsv
|
|
13
|
+
}) {
|
|
14
|
+
const { downloadCSVData } = useCsvExport();
|
|
15
|
+
const download = useCallback(() => {
|
|
16
|
+
downloadCSVData({ columns, tableName, tableNamePrefix, skipColumnHeaders, language, exportDataAsCsv });
|
|
17
|
+
}, [downloadCSVData, columns, tableName, tableNamePrefix, skipColumnHeaders, language, exportDataAsCsv]);
|
|
18
|
+
return /* @__PURE__ */ jsx(ExportCsvButton, { disabled, onClick: download });
|
|
19
|
+
}
|
|
20
|
+
export {
|
|
21
|
+
CsvExport
|
|
22
|
+
};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { ColDef, CsvExportParams } from 'ag-grid-community';
|
|
2
|
+
import { GsLang } from '../../utils';
|
|
3
|
+
export type CsvDownloadProps = {
|
|
4
|
+
columns: ColDef[];
|
|
5
|
+
tableName: string;
|
|
6
|
+
tableNamePrefix?: string;
|
|
7
|
+
skipColumnHeaders?: boolean;
|
|
8
|
+
language: GsLang;
|
|
9
|
+
exportDataAsCsv: (params?: CsvExportParams) => void;
|
|
10
|
+
};
|
|
11
|
+
export type CsvExportProps = CsvDownloadProps & {
|
|
12
|
+
disabled: boolean;
|
|
13
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export interface ExportButtonProps {
|
|
2
|
+
disabled?: boolean;
|
|
3
|
+
onClick: () => void;
|
|
4
|
+
isDownloadLoading?: boolean;
|
|
5
|
+
isDownloadSuccessful?: boolean;
|
|
6
|
+
}
|
|
7
|
+
export declare function ExportCsvButton({ onClick, disabled, isDownloadLoading: isCsvLoading, isDownloadSuccessful, }: Readonly<ExportButtonProps>): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { jsxs, jsx } from "react/jsx-runtime";
|
|
2
|
+
import { Box, IconButton, CircularProgress } from "@mui/material";
|
|
3
|
+
import { FormattedMessage } from "react-intl";
|
|
4
|
+
import { Check, GetApp } from "@mui/icons-material";
|
|
5
|
+
function ExportCsvButton({
|
|
6
|
+
onClick,
|
|
7
|
+
disabled = false,
|
|
8
|
+
isDownloadLoading: isCsvLoading = false,
|
|
9
|
+
isDownloadSuccessful = false
|
|
10
|
+
}) {
|
|
11
|
+
return /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", alignItems: "center" }, children: [
|
|
12
|
+
/* @__PURE__ */ jsx(FormattedMessage, { id: "MuiVirtualizedTable/exportCSV" }),
|
|
13
|
+
/* @__PURE__ */ jsxs(Box, { sx: { position: "relative" }, children: [
|
|
14
|
+
/* @__PURE__ */ jsx(IconButton, { disabled, "aria-label": "exportCSVButton", onClick, children: isDownloadSuccessful ? /* @__PURE__ */ jsx(Check, {}) : /* @__PURE__ */ jsx(GetApp, {}) }),
|
|
15
|
+
isCsvLoading && /* @__PURE__ */ jsx(
|
|
16
|
+
CircularProgress,
|
|
17
|
+
{
|
|
18
|
+
size: 30,
|
|
19
|
+
sx: {
|
|
20
|
+
position: "absolute",
|
|
21
|
+
top: "50%",
|
|
22
|
+
left: "50%",
|
|
23
|
+
marginTop: "-15px",
|
|
24
|
+
marginLeft: "-15px"
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
)
|
|
28
|
+
] })
|
|
29
|
+
] });
|
|
30
|
+
}
|
|
31
|
+
export {
|
|
32
|
+
ExportCsvButton
|
|
33
|
+
};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright (c) 2025, RTE (http://www.rte-france.com)
|
|
3
|
+
* This Source Code Form is subject to the terms of the Mozilla Public
|
|
4
|
+
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
|
5
|
+
* file, You can obtain one at http://mozilla.org/MPL/2.0/.
|
|
6
|
+
*/
|
|
7
|
+
export * from './csv-export';
|
|
8
|
+
export * from './csv-export.type';
|
|
9
|
+
export * from './export-csv-button';
|
|
10
|
+
export * from './use-csv-export';
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import { useCallback } from "react";
|
|
2
|
+
import { useIntl } from "react-intl";
|
|
3
|
+
import "../../utils/conversionUtils.js";
|
|
4
|
+
import { LANG_FRENCH } from "../../utils/langs.js";
|
|
5
|
+
import "react/jsx-runtime";
|
|
6
|
+
import "@mui/icons-material";
|
|
7
|
+
import "../../utils/types/equipmentType.js";
|
|
8
|
+
import "../../utils/yupConfig.js";
|
|
9
|
+
const NA_VALUE = "N/A";
|
|
10
|
+
const formatNAValue = (value, intl) => {
|
|
11
|
+
return value === NA_VALUE ? intl.formatMessage({ id: "export/undefined" }) : value;
|
|
12
|
+
};
|
|
13
|
+
const useCsvExport = () => {
|
|
14
|
+
const intl = useIntl();
|
|
15
|
+
const getCSVFilename = useCallback((tableName) => {
|
|
16
|
+
return tableName.trim().replace(/[\\/:"*?<>|\s]/g, "-").substring(0, 27);
|
|
17
|
+
}, []);
|
|
18
|
+
const downloadCSVData = useCallback(
|
|
19
|
+
(props) => {
|
|
20
|
+
const hasColId = (colId) => {
|
|
21
|
+
return colId !== void 0;
|
|
22
|
+
};
|
|
23
|
+
const processCell = (params) => {
|
|
24
|
+
if (params.column.getColId() === "limitName") {
|
|
25
|
+
return formatNAValue(params.value, intl);
|
|
26
|
+
}
|
|
27
|
+
if (props.language === LANG_FRENCH && typeof params.value === "number") {
|
|
28
|
+
return params.value.toString().replace(".", ",");
|
|
29
|
+
}
|
|
30
|
+
return params.value;
|
|
31
|
+
};
|
|
32
|
+
const prefix = props.tableNamePrefix ?? "";
|
|
33
|
+
props.exportDataAsCsv({
|
|
34
|
+
suppressQuotes: false,
|
|
35
|
+
columnSeparator: props.language === LANG_FRENCH ? ";" : ",",
|
|
36
|
+
columnKeys: props.columns.map((col) => col.colId).filter(hasColId),
|
|
37
|
+
skipColumnHeaders: props.skipColumnHeaders,
|
|
38
|
+
processHeaderCallback: (params) => {
|
|
39
|
+
var _a;
|
|
40
|
+
return ((_a = params.column.getColDef().headerComponentParams) == null ? void 0 : _a.displayName) ?? params.column.getColDef().headerName ?? params.column.getColId();
|
|
41
|
+
},
|
|
42
|
+
fileName: prefix.concat(getCSVFilename(props.tableName)),
|
|
43
|
+
processCellCallback: processCell
|
|
44
|
+
});
|
|
45
|
+
},
|
|
46
|
+
[getCSVFilename, intl]
|
|
47
|
+
);
|
|
48
|
+
return { downloadCSVData };
|
|
49
|
+
};
|
|
50
|
+
export {
|
|
51
|
+
useCsvExport
|
|
52
|
+
};
|
|
@@ -8,6 +8,7 @@ export * from './announcement';
|
|
|
8
8
|
export * from './authentication';
|
|
9
9
|
export * from './cardErrorBoundary';
|
|
10
10
|
export * from './checkBoxList';
|
|
11
|
+
export * from './csvDownloader';
|
|
11
12
|
export * from './customAGGrid';
|
|
12
13
|
export * from './dialogs';
|
|
13
14
|
export * from './directoryItemSelector/DirectoryItemSelector';
|
package/dist/components/index.js
CHANGED
|
@@ -14,6 +14,9 @@ import { dispatchUser, getPreLoginPath, handleSigninCallback, handleSilentRenewC
|
|
|
14
14
|
import { UserManagerMock } from "./authentication/utils/userManagerMock.js";
|
|
15
15
|
import { CardErrorBoundary } from "./cardErrorBoundary/CardErrorBoundary.js";
|
|
16
16
|
import { CheckBoxList } from "./checkBoxList/CheckBoxList.js";
|
|
17
|
+
import { CsvExport } from "./csvDownloader/csv-export.js";
|
|
18
|
+
import { ExportCsvButton } from "./csvDownloader/export-csv-button.js";
|
|
19
|
+
import { useCsvExport } from "./csvDownloader/use-csv-export.js";
|
|
17
20
|
import { CUSTOM_AGGRID_THEME, styles } from "./customAGGrid/customAggrid.style.js";
|
|
18
21
|
import { CustomAGGrid } from "./customAGGrid/customAggrid.js";
|
|
19
22
|
import { CustomMuiDialog, unscrollableDialogStyles } from "./dialogs/customMuiDialog/CustomMuiDialog.js";
|
|
@@ -197,6 +200,7 @@ export {
|
|
|
197
200
|
CountryValueEditor,
|
|
198
201
|
CreateParameterDialog,
|
|
199
202
|
CriteriaBasedForm,
|
|
203
|
+
CsvExport,
|
|
200
204
|
CsvUploader,
|
|
201
205
|
CustomAGGrid,
|
|
202
206
|
CustomAgGridTable,
|
|
@@ -252,6 +256,7 @@ export {
|
|
|
252
256
|
ExpertFilterForm,
|
|
253
257
|
ExplicitNamingFilterEditionDialog,
|
|
254
258
|
ExplicitNamingFilterForm,
|
|
259
|
+
ExportCsvButton,
|
|
255
260
|
FIELDS_OPTIONS,
|
|
256
261
|
FILTERS,
|
|
257
262
|
FILTER_EQUIPMENTS,
|
|
@@ -487,6 +492,7 @@ export {
|
|
|
487
492
|
toFormValuesLimitReductions,
|
|
488
493
|
unscrollableDialogStyles,
|
|
489
494
|
useConvertValue,
|
|
495
|
+
useCsvExport,
|
|
490
496
|
useCustomFormContext,
|
|
491
497
|
useElementSearch,
|
|
492
498
|
useGlobalAnnouncement,
|
package/dist/index.js
CHANGED
|
@@ -15,6 +15,9 @@ import { dispatchUser, getPreLoginPath, handleSigninCallback, handleSilentRenewC
|
|
|
15
15
|
import { UserManagerMock } from "./components/authentication/utils/userManagerMock.js";
|
|
16
16
|
import { CardErrorBoundary } from "./components/cardErrorBoundary/CardErrorBoundary.js";
|
|
17
17
|
import { CheckBoxList } from "./components/checkBoxList/CheckBoxList.js";
|
|
18
|
+
import { CsvExport } from "./components/csvDownloader/csv-export.js";
|
|
19
|
+
import { ExportCsvButton } from "./components/csvDownloader/export-csv-button.js";
|
|
20
|
+
import { useCsvExport } from "./components/csvDownloader/use-csv-export.js";
|
|
18
21
|
import { CUSTOM_AGGRID_THEME, styles } from "./components/customAGGrid/customAggrid.style.js";
|
|
19
22
|
import { CustomAGGrid } from "./components/customAGGrid/customAggrid.js";
|
|
20
23
|
import { CustomMuiDialog, unscrollableDialogStyles } from "./components/dialogs/customMuiDialog/CustomMuiDialog.js";
|
|
@@ -301,6 +304,7 @@ export {
|
|
|
301
304
|
CountryValueEditor,
|
|
302
305
|
CreateParameterDialog,
|
|
303
306
|
CriteriaBasedForm,
|
|
307
|
+
CsvExport,
|
|
304
308
|
CsvUploader,
|
|
305
309
|
CustomAGGrid,
|
|
306
310
|
CustomAgGridTable,
|
|
@@ -364,6 +368,7 @@ export {
|
|
|
364
368
|
ExpertFilterForm,
|
|
365
369
|
ExplicitNamingFilterEditionDialog,
|
|
366
370
|
ExplicitNamingFilterForm,
|
|
371
|
+
ExportCsvButton,
|
|
367
372
|
ExtendedEquipmentType,
|
|
368
373
|
FIELDS_OPTIONS,
|
|
369
374
|
FILTERS,
|
|
@@ -786,6 +791,7 @@ export {
|
|
|
786
791
|
updateVoltageInitParameters,
|
|
787
792
|
useConfidentialityWarning,
|
|
788
793
|
useConvertValue,
|
|
794
|
+
useCsvExport,
|
|
789
795
|
useCustomFormContext,
|
|
790
796
|
useDebounce,
|
|
791
797
|
useElementSearch,
|