@gridsuite/commons-ui 0.93.0 → 0.94.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/filter/FilterCreationDialog.d.ts +5 -1
- package/dist/components/filter/FilterCreationDialog.js +17 -8
- package/dist/components/filter/FilterForm.d.ts +1 -1
- package/dist/components/filter/FilterForm.js +7 -18
- package/dist/components/filter/HeaderFilterForm.d.ts +5 -3
- package/dist/components/filter/HeaderFilterForm.js +3 -22
- package/dist/components/filter/expert/ExpertFilterEditionDialog.js +2 -3
- package/dist/components/filter/explicitNaming/ExplicitNamingFilterEditionDialog.js +2 -3
- package/dist/components/treeViewFinder/TreeViewFinder.d.ts +3 -3
- package/dist/components/treeViewFinder/TreeViewFinder.js +46 -32
- package/dist/translations/en/filterEn.d.ts +2 -0
- package/dist/translations/en/filterEn.js +2 -0
- package/dist/translations/fr/filterFr.d.ts +2 -0
- package/dist/translations/fr/filterFr.js +2 -0
- package/package.json +2 -2
|
@@ -8,5 +8,9 @@ export interface FilterCreationDialogProps {
|
|
|
8
8
|
id: UUID;
|
|
9
9
|
equipmentType: string;
|
|
10
10
|
};
|
|
11
|
+
filterType: {
|
|
12
|
+
id: string;
|
|
13
|
+
label: string;
|
|
14
|
+
};
|
|
11
15
|
}
|
|
12
|
-
export declare function FilterCreationDialog({ open, onClose, activeDirectory, language, sourceFilterForExplicitNamingConversion, }: FilterCreationDialogProps): import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
export declare function FilterCreationDialog({ open, onClose, activeDirectory, language, sourceFilterForExplicitNamingConversion, filterType, }: FilterCreationDialogProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
|
-
import { useCallback } from "react";
|
|
2
|
+
import { useCallback, useMemo } from "react";
|
|
3
3
|
import { useForm } from "react-hook-form";
|
|
4
4
|
import { yupResolver } from "@hookform/resolvers/yup";
|
|
5
5
|
import { saveExplicitNamingFilter, saveExpertFilter } from "./utils/filterApi.js";
|
|
@@ -18,7 +18,6 @@ import * as yup from "yup";
|
|
|
18
18
|
const emptyFormData = {
|
|
19
19
|
[FieldConstants.NAME]: "",
|
|
20
20
|
[FieldConstants.DESCRIPTION]: "",
|
|
21
|
-
[FieldConstants.FILTER_TYPE]: FilterType.EXPERT.id,
|
|
22
21
|
[FieldConstants.EQUIPMENT_TYPE]: null,
|
|
23
22
|
...getExplicitNamingFilterEmptyFormData(),
|
|
24
23
|
...getExpertFilterEmptyFormData()
|
|
@@ -26,7 +25,6 @@ const emptyFormData = {
|
|
|
26
25
|
const formSchema = yup.object().shape({
|
|
27
26
|
[FieldConstants.NAME]: yup.string().trim().required("nameEmpty"),
|
|
28
27
|
[FieldConstants.DESCRIPTION]: yup.string().max(MAX_CHAR_DESCRIPTION, "descriptionLimitError"),
|
|
29
|
-
[FieldConstants.FILTER_TYPE]: yup.string().required(),
|
|
30
28
|
[FieldConstants.EQUIPMENT_TYPE]: yup.string().required(),
|
|
31
29
|
...explicitNamingFilterSchema,
|
|
32
30
|
...expertFilterSchema
|
|
@@ -36,7 +34,8 @@ function FilterCreationDialog({
|
|
|
36
34
|
onClose,
|
|
37
35
|
activeDirectory,
|
|
38
36
|
language,
|
|
39
|
-
sourceFilterForExplicitNamingConversion = void 0
|
|
37
|
+
sourceFilterForExplicitNamingConversion = void 0,
|
|
38
|
+
filterType
|
|
40
39
|
}) {
|
|
41
40
|
var _a;
|
|
42
41
|
const { snackError } = useSnackMessage();
|
|
@@ -51,7 +50,7 @@ function FilterCreationDialog({
|
|
|
51
50
|
const isValidating = (_a = errors.root) == null ? void 0 : _a.isValidating;
|
|
52
51
|
const onSubmit = useCallback(
|
|
53
52
|
(filterForm) => {
|
|
54
|
-
if (
|
|
53
|
+
if ((filterType == null ? void 0 : filterType.id) === FilterType.EXPLICIT_NAMING.id) {
|
|
55
54
|
saveExplicitNamingFilter(
|
|
56
55
|
filterForm[FILTER_EQUIPMENTS_ATTRIBUTES],
|
|
57
56
|
true,
|
|
@@ -67,7 +66,7 @@ function FilterCreationDialog({
|
|
|
67
66
|
onClose,
|
|
68
67
|
activeDirectory
|
|
69
68
|
);
|
|
70
|
-
} else if (
|
|
69
|
+
} else if ((filterType == null ? void 0 : filterType.id) === FilterType.EXPERT.id) {
|
|
71
70
|
saveExpertFilter(
|
|
72
71
|
null,
|
|
73
72
|
filterForm[EXPERT_FILTER_QUERY],
|
|
@@ -85,8 +84,17 @@ function FilterCreationDialog({
|
|
|
85
84
|
);
|
|
86
85
|
}
|
|
87
86
|
},
|
|
88
|
-
[activeDirectory, snackError, onClose]
|
|
87
|
+
[activeDirectory, snackError, onClose, filterType]
|
|
89
88
|
);
|
|
89
|
+
const titleId = useMemo(() => {
|
|
90
|
+
if (sourceFilterForExplicitNamingConversion) {
|
|
91
|
+
return "convertIntoExplicitNamingFilter";
|
|
92
|
+
}
|
|
93
|
+
if ((filterType == null ? void 0 : filterType.id) === FilterType.EXPERT.id) {
|
|
94
|
+
return "createNewCriteriaFilter";
|
|
95
|
+
}
|
|
96
|
+
return "createNewExplicitNamingFilter";
|
|
97
|
+
}, [sourceFilterForExplicitNamingConversion, filterType]);
|
|
90
98
|
return /* @__PURE__ */ jsx(
|
|
91
99
|
CustomMuiDialog,
|
|
92
100
|
{
|
|
@@ -95,7 +103,7 @@ function FilterCreationDialog({
|
|
|
95
103
|
onSave: onSubmit,
|
|
96
104
|
formSchema,
|
|
97
105
|
formMethods,
|
|
98
|
-
titleId
|
|
106
|
+
titleId,
|
|
99
107
|
removeOptional: true,
|
|
100
108
|
disabledSave: !!nameError || !!isValidating,
|
|
101
109
|
language,
|
|
@@ -105,6 +113,7 @@ function FilterCreationDialog({
|
|
|
105
113
|
{
|
|
106
114
|
creation: true,
|
|
107
115
|
activeDirectory,
|
|
116
|
+
filterType,
|
|
108
117
|
sourceFilterForExplicitNamingConversion
|
|
109
118
|
}
|
|
110
119
|
)
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { FilterFormProps } from './HeaderFilterForm';
|
|
2
|
-
export declare function FilterForm({ sourceFilterForExplicitNamingConversion, creation, activeDirectory, }: Readonly<FilterFormProps>): import("react/jsx-runtime").JSX.Element;
|
|
2
|
+
export declare function FilterForm({ sourceFilterForExplicitNamingConversion, creation, activeDirectory, filterType, }: Readonly<FilterFormProps>): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,51 +1,40 @@
|
|
|
1
1
|
import { jsxs, Fragment, jsx } from "react/jsx-runtime";
|
|
2
2
|
import { Box } from "@mui/material";
|
|
3
|
-
import { useFormContext, useWatch } from "react-hook-form";
|
|
4
|
-
import { useEffect } from "react";
|
|
5
3
|
import { HeaderFilterForm } from "./HeaderFilterForm.js";
|
|
6
|
-
import { FieldConstants } from "../../utils/constants/fieldConstants.js";
|
|
7
4
|
import { ExplicitNamingFilterForm } from "./explicitNaming/ExplicitNamingFilterForm.js";
|
|
8
5
|
import { ExpertFilterForm } from "./expert/ExpertFilterForm.js";
|
|
9
6
|
import { FilterType } from "./constants/FilterConstants.js";
|
|
10
7
|
import { unscrollableDialogStyles } from "../dialogs/customMuiDialog/CustomMuiDialog.js";
|
|
11
8
|
import "../dialogs/descriptionModificationDialog/DescriptionModificationDialog.js";
|
|
12
9
|
import "../dialogs/elementSaveDialog/ElementSaveDialog.js";
|
|
10
|
+
import "react";
|
|
13
11
|
import "react-intl";
|
|
12
|
+
import "react-hook-form";
|
|
14
13
|
import "@mui/icons-material";
|
|
15
14
|
import "../treeViewFinder/TreeViewFinder.js";
|
|
16
15
|
import "notistack";
|
|
17
16
|
function FilterForm({
|
|
18
17
|
sourceFilterForExplicitNamingConversion,
|
|
19
18
|
creation,
|
|
20
|
-
activeDirectory
|
|
19
|
+
activeDirectory,
|
|
20
|
+
filterType
|
|
21
21
|
}) {
|
|
22
|
-
const { setValue } = useFormContext();
|
|
23
|
-
const filterType = useWatch({ name: FieldConstants.FILTER_TYPE });
|
|
24
|
-
const handleFilterTypeChange = (_event, value) => {
|
|
25
|
-
setValue(FieldConstants.FILTER_TYPE, value);
|
|
26
|
-
};
|
|
27
|
-
useEffect(() => {
|
|
28
|
-
if (sourceFilterForExplicitNamingConversion) {
|
|
29
|
-
setValue(FieldConstants.FILTER_TYPE, FilterType.EXPLICIT_NAMING.id);
|
|
30
|
-
}
|
|
31
|
-
}, [sourceFilterForExplicitNamingConversion, setValue]);
|
|
32
22
|
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
33
23
|
/* @__PURE__ */ jsx(Box, { sx: unscrollableDialogStyles.unscrollableHeader, children: /* @__PURE__ */ jsx(
|
|
34
24
|
HeaderFilterForm,
|
|
35
25
|
{
|
|
36
26
|
creation,
|
|
37
27
|
activeDirectory,
|
|
38
|
-
sourceFilterForExplicitNamingConversion
|
|
39
|
-
handleFilterTypeChange
|
|
28
|
+
sourceFilterForExplicitNamingConversion
|
|
40
29
|
}
|
|
41
30
|
) }),
|
|
42
|
-
filterType === FilterType.EXPLICIT_NAMING.id && /* @__PURE__ */ jsx(
|
|
31
|
+
(filterType == null ? void 0 : filterType.id) === FilterType.EXPLICIT_NAMING.id && /* @__PURE__ */ jsx(
|
|
43
32
|
ExplicitNamingFilterForm,
|
|
44
33
|
{
|
|
45
34
|
sourceFilterForExplicitNamingConversion
|
|
46
35
|
}
|
|
47
36
|
),
|
|
48
|
-
filterType === FilterType.EXPERT.id && /* @__PURE__ */ jsx(ExpertFilterForm, {})
|
|
37
|
+
(filterType == null ? void 0 : filterType.id) === FilterType.EXPERT.id && /* @__PURE__ */ jsx(ExpertFilterForm, {})
|
|
49
38
|
] });
|
|
50
39
|
}
|
|
51
40
|
export {
|
|
@@ -13,16 +13,18 @@ export declare const filterStyles: {
|
|
|
13
13
|
export interface FilterFormProps {
|
|
14
14
|
creation?: boolean;
|
|
15
15
|
activeDirectory?: UUID;
|
|
16
|
+
filterType?: {
|
|
17
|
+
id: string;
|
|
18
|
+
label: string;
|
|
19
|
+
};
|
|
16
20
|
sourceFilterForExplicitNamingConversion?: {
|
|
17
21
|
id: UUID;
|
|
18
22
|
equipmentType: string;
|
|
19
23
|
};
|
|
20
|
-
handleFilterTypeChange?: (event: React.ChangeEvent<HTMLInputElement>, value: string) => void;
|
|
21
24
|
}
|
|
22
25
|
export declare const HeaderFilterSchema: {
|
|
23
26
|
name: yup.StringSchema<string, yup.AnyObject, undefined, "">;
|
|
24
|
-
filterType: yup.StringSchema<string, yup.AnyObject, undefined, "">;
|
|
25
27
|
equipmentType: yup.StringSchema<string, yup.AnyObject, undefined, "">;
|
|
26
28
|
description: yup.StringSchema<string | undefined, yup.AnyObject, undefined, "">;
|
|
27
29
|
};
|
|
28
|
-
export declare function HeaderFilterForm({
|
|
30
|
+
export declare function HeaderFilterForm({ creation, activeDirectory }: Readonly<FilterFormProps>): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsxs, jsx
|
|
1
|
+
import { jsxs, jsx } from "react/jsx-runtime";
|
|
2
2
|
import { Grid } from "@mui/material";
|
|
3
3
|
import { FieldConstants } from "../../utils/constants/fieldConstants.js";
|
|
4
4
|
import { MAX_CHAR_DESCRIPTION } from "../../utils/constants/uiConstants.js";
|
|
@@ -7,7 +7,6 @@ import "@mui/icons-material";
|
|
|
7
7
|
import { ElementType } from "../../utils/types/elementType.js";
|
|
8
8
|
import "../../utils/types/equipmentType.js";
|
|
9
9
|
import "../../utils/yupConfig.js";
|
|
10
|
-
import { FilterType } from "./constants/FilterConstants.js";
|
|
11
10
|
import "react-intl";
|
|
12
11
|
import "react";
|
|
13
12
|
import "react-hook-form";
|
|
@@ -23,7 +22,6 @@ import "../customAGGrid/customAggrid.js";
|
|
|
23
22
|
import "ag-grid-community";
|
|
24
23
|
import "react-papaparse";
|
|
25
24
|
import "react-csv-downloader";
|
|
26
|
-
import { RadioInput } from "../inputs/reactHookForm/booleans/RadioInput.js";
|
|
27
25
|
import "../inputs/reactHookForm/numbers/RangeInput.js";
|
|
28
26
|
import "localized-countries";
|
|
29
27
|
import "localized-countries/data/fr";
|
|
@@ -48,17 +46,10 @@ const filterStyles = {
|
|
|
48
46
|
};
|
|
49
47
|
const HeaderFilterSchema = {
|
|
50
48
|
[FieldConstants.NAME]: yup.string().trim().required("nameEmpty"),
|
|
51
|
-
[FieldConstants.FILTER_TYPE]: yup.string().required(),
|
|
52
49
|
[FieldConstants.EQUIPMENT_TYPE]: yup.string().required(),
|
|
53
50
|
[FieldConstants.DESCRIPTION]: yup.string().max(MAX_CHAR_DESCRIPTION, "descriptionLimitError")
|
|
54
51
|
};
|
|
55
|
-
function HeaderFilterForm({
|
|
56
|
-
sourceFilterForExplicitNamingConversion,
|
|
57
|
-
creation,
|
|
58
|
-
activeDirectory,
|
|
59
|
-
handleFilterTypeChange
|
|
60
|
-
}) {
|
|
61
|
-
const filterTypes = Object.values(FilterType);
|
|
52
|
+
function HeaderFilterForm({ creation, activeDirectory }) {
|
|
62
53
|
return /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, children: [
|
|
63
54
|
/* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsx(
|
|
64
55
|
UniqueNameInput,
|
|
@@ -72,17 +63,7 @@ function HeaderFilterForm({
|
|
|
72
63
|
fullWidth: false
|
|
73
64
|
}
|
|
74
65
|
) }),
|
|
75
|
-
/* @__PURE__ */
|
|
76
|
-
/* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsx(DescriptionField, { expandingTextSx: filterStyles.description }) }),
|
|
77
|
-
creation && !sourceFilterForExplicitNamingConversion && /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsx(
|
|
78
|
-
RadioInput,
|
|
79
|
-
{
|
|
80
|
-
name: FieldConstants.FILTER_TYPE,
|
|
81
|
-
options: filterTypes,
|
|
82
|
-
formProps: { onChange: handleFilterTypeChange }
|
|
83
|
-
}
|
|
84
|
-
) })
|
|
85
|
-
] })
|
|
66
|
+
/* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsx(DescriptionField, { expandingTextSx: filterStyles.description }) })
|
|
86
67
|
] });
|
|
87
68
|
}
|
|
88
69
|
export {
|
|
@@ -7,7 +7,7 @@ import { FetchStatus } from "../../../utils/constants/fetchStatus.js";
|
|
|
7
7
|
import { FieldConstants } from "../../../utils/constants/fieldConstants.js";
|
|
8
8
|
import "../../../utils/yupConfig.js";
|
|
9
9
|
import { CustomMuiDialog } from "../../dialogs/customMuiDialog/CustomMuiDialog.js";
|
|
10
|
-
import {
|
|
10
|
+
import { NO_ITEM_SELECTION_FOR_COPY, FilterType } from "../constants/FilterConstants.js";
|
|
11
11
|
import { FilterForm } from "../FilterForm.js";
|
|
12
12
|
import { saveExpertFilter } from "../utils/filterApi.js";
|
|
13
13
|
import { expertFilterSchema } from "./ExpertFilterForm.js";
|
|
@@ -54,7 +54,6 @@ function ExpertFilterEditionDialog({
|
|
|
54
54
|
reset({
|
|
55
55
|
[FieldConstants.NAME]: name,
|
|
56
56
|
[FieldConstants.DESCRIPTION]: description,
|
|
57
|
-
[FieldConstants.FILTER_TYPE]: FilterType.EXPERT.id,
|
|
58
57
|
[FieldConstants.EQUIPMENT_TYPE]: response[FieldConstants.EQUIPMENT_TYPE],
|
|
59
58
|
[EXPERT_FILTER_QUERY]: importExpertRules(response[EXPERT_FILTER_QUERY])
|
|
60
59
|
});
|
|
@@ -108,7 +107,7 @@ function ExpertFilterEditionDialog({
|
|
|
108
107
|
isDataFetching: dataFetchStatus === FetchStatus.FETCHING,
|
|
109
108
|
language,
|
|
110
109
|
unscrollableFullHeight: true,
|
|
111
|
-
children: isDataReady && /* @__PURE__ */ jsx(FilterForm, { activeDirectory })
|
|
110
|
+
children: isDataReady && /* @__PURE__ */ jsx(FilterForm, { activeDirectory, filterType: FilterType.EXPERT })
|
|
112
111
|
}
|
|
113
112
|
);
|
|
114
113
|
}
|
|
@@ -12,7 +12,7 @@ import { saveExplicitNamingFilter } from "../utils/filterApi.js";
|
|
|
12
12
|
import { explicitNamingFilterSchema } from "./ExplicitNamingFilterForm.js";
|
|
13
13
|
import { FetchStatus } from "../../../utils/constants/fetchStatus.js";
|
|
14
14
|
import { FilterForm } from "../FilterForm.js";
|
|
15
|
-
import {
|
|
15
|
+
import { NO_ITEM_SELECTION_FOR_COPY, FilterType } from "../constants/FilterConstants.js";
|
|
16
16
|
import { HeaderFilterSchema } from "../HeaderFilterForm.js";
|
|
17
17
|
import { FILTER_EQUIPMENTS_ATTRIBUTES } from "./ExplicitNamingFilterConstants.js";
|
|
18
18
|
import * as yup from "yup";
|
|
@@ -55,7 +55,6 @@ function ExplicitNamingFilterEditionDialog({
|
|
|
55
55
|
reset({
|
|
56
56
|
[FieldConstants.NAME]: name,
|
|
57
57
|
[FieldConstants.DESCRIPTION]: description,
|
|
58
|
-
[FieldConstants.FILTER_TYPE]: FilterType.EXPLICIT_NAMING.id,
|
|
59
58
|
[FieldConstants.EQUIPMENT_TYPE]: response[FieldConstants.EQUIPMENT_TYPE],
|
|
60
59
|
[FILTER_EQUIPMENTS_ATTRIBUTES]: (_a2 = response[FILTER_EQUIPMENTS_ATTRIBUTES]) == null ? void 0 : _a2.map((row) => ({
|
|
61
60
|
[FieldConstants.AG_GRID_ROW_UUID]: v4(),
|
|
@@ -109,7 +108,7 @@ function ExplicitNamingFilterEditionDialog({
|
|
|
109
108
|
isDataFetching: dataFetchStatus === FetchStatus.FETCHING,
|
|
110
109
|
language,
|
|
111
110
|
unscrollableFullHeight: true,
|
|
112
|
-
children: isDataReady && /* @__PURE__ */ jsx(FilterForm, { activeDirectory })
|
|
111
|
+
children: isDataReady && /* @__PURE__ */ jsx(FilterForm, { activeDirectory, filterType: FilterType.EXPLICIT_NAMING })
|
|
113
112
|
}
|
|
114
113
|
);
|
|
115
114
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ReactElement } from 'react';
|
|
2
2
|
import { ButtonProps, ModalProps } from '@mui/material';
|
|
3
|
-
import {
|
|
3
|
+
import { SimpleTreeViewClasses } from '@mui/x-tree-view';
|
|
4
4
|
import { UUID } from 'crypto';
|
|
5
5
|
export declare const generateTreeViewFinderClass: (className: string) => string;
|
|
6
6
|
export interface TreeViewFinderNodeProps {
|
|
@@ -18,7 +18,7 @@ export interface TreeViewFinderProps {
|
|
|
18
18
|
selected?: string[];
|
|
19
19
|
expanded?: string[];
|
|
20
20
|
multiSelect?: boolean;
|
|
21
|
-
classes?: Partial<
|
|
21
|
+
classes?: Partial<SimpleTreeViewClasses>;
|
|
22
22
|
className?: string;
|
|
23
23
|
contentText?: string;
|
|
24
24
|
open: ModalProps['open'];
|
|
@@ -28,7 +28,7 @@ export interface TreeViewFinderProps {
|
|
|
28
28
|
title?: string;
|
|
29
29
|
onlyLeaves?: boolean;
|
|
30
30
|
data?: TreeViewFinderNodeProps[];
|
|
31
|
-
onTreeBrowse?: (
|
|
31
|
+
onTreeBrowse?: (itemId: string) => void;
|
|
32
32
|
sortMethod?: (a: TreeViewFinderNodeProps, b: TreeViewFinderNodeProps) => number;
|
|
33
33
|
}
|
|
34
34
|
export declare const TreeViewFinder: import('@emotion/styled').StyledComponent<Readonly<TreeViewFinderProps> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, {}, {}>;
|
|
@@ -2,7 +2,7 @@ import { jsxs, jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import { useState, useRef, useCallback, useEffect } from "react";
|
|
3
3
|
import { useIntl } from "react-intl";
|
|
4
4
|
import { styled, Dialog, DialogTitle, DialogContent, DialogContentText, DialogActions, Button, Typography } from "@mui/material";
|
|
5
|
-
import {
|
|
5
|
+
import { SimpleTreeView, TreeItem } from "@mui/x-tree-view";
|
|
6
6
|
import { ExpandMore, ChevronRight, Check } from "@mui/icons-material";
|
|
7
7
|
import { toNestedGlobalSelectors, makeComposeClasses } from "../../utils/styles.js";
|
|
8
8
|
import { CancelButton } from "../inputs/reactHookForm/utils/CancelButton.js";
|
|
@@ -34,6 +34,12 @@ const defaultStyles = {
|
|
|
34
34
|
};
|
|
35
35
|
const generateTreeViewFinderClass = (className) => `GsiTreeViewFinder-${className}`;
|
|
36
36
|
const composeClasses = makeComposeClasses(generateTreeViewFinderClass);
|
|
37
|
+
function CustomExpandIcon({ className }) {
|
|
38
|
+
return /* @__PURE__ */ jsx(ChevronRight, { className });
|
|
39
|
+
}
|
|
40
|
+
function CustomCollapseIcon({ className }) {
|
|
41
|
+
return /* @__PURE__ */ jsx(ExpandMore, { className });
|
|
42
|
+
}
|
|
37
43
|
function TreeViewFinderComponant(props) {
|
|
38
44
|
const intl = useIntl();
|
|
39
45
|
const {
|
|
@@ -67,7 +73,7 @@ function TreeViewFinderComponant(props) {
|
|
|
67
73
|
return onlyLeaves ? isLeaf(node) : true;
|
|
68
74
|
};
|
|
69
75
|
const isValidationDisabled = () => {
|
|
70
|
-
return (selected == null ? void 0 : selected.length) === 0 || (selected == null ? void 0 : selected.length) === (selectedProp == null ? void 0 : selectedProp.length) && (selected == null ? void 0 : selected.every((
|
|
76
|
+
return (selected == null ? void 0 : selected.length) === 0 || (selected == null ? void 0 : selected.length) === (selectedProp == null ? void 0 : selectedProp.length) && (selected == null ? void 0 : selected.every((itemId) => selectedProp == null ? void 0 : selectedProp.includes(itemId)));
|
|
71
77
|
};
|
|
72
78
|
const computeMapPrintedNodes = useCallback((nodes) => {
|
|
73
79
|
const newMapPrintedNodes = {};
|
|
@@ -79,15 +85,15 @@ function TreeViewFinderComponant(props) {
|
|
|
79
85
|
});
|
|
80
86
|
return newMapPrintedNodes;
|
|
81
87
|
}, []);
|
|
82
|
-
const findParents = (
|
|
88
|
+
const findParents = (itemId, nodes, parentPath = []) => {
|
|
83
89
|
let result = null;
|
|
84
90
|
nodes.some((node) => {
|
|
85
|
-
if (node.id ===
|
|
91
|
+
if (node.id === itemId) {
|
|
86
92
|
result = parentPath;
|
|
87
93
|
return true;
|
|
88
94
|
}
|
|
89
95
|
if (node.children) {
|
|
90
|
-
const childResult = findParents(
|
|
96
|
+
const childResult = findParents(itemId, node.children, [...parentPath, node]);
|
|
91
97
|
if (childResult) {
|
|
92
98
|
result = childResult;
|
|
93
99
|
return true;
|
|
@@ -105,27 +111,27 @@ function TreeViewFinderComponant(props) {
|
|
|
105
111
|
if (!selected) {
|
|
106
112
|
return [];
|
|
107
113
|
}
|
|
108
|
-
return selected.map((
|
|
109
|
-
const selectedNode = mapPrintedNodes[
|
|
114
|
+
return selected.map((itemId) => {
|
|
115
|
+
const selectedNode = mapPrintedNodes[itemId];
|
|
110
116
|
if (!selectedNode) {
|
|
111
117
|
return null;
|
|
112
118
|
}
|
|
113
|
-
const parents = findParents(
|
|
119
|
+
const parents = findParents(itemId, data ?? []);
|
|
114
120
|
return {
|
|
115
121
|
...selectedNode,
|
|
116
122
|
parents: parents ?? []
|
|
117
123
|
};
|
|
118
124
|
}).filter((node) => node !== null);
|
|
119
125
|
};
|
|
120
|
-
const handleNodeToggle = (_e,
|
|
121
|
-
|
|
122
|
-
if (!(expanded == null ? void 0 : expanded.includes(
|
|
123
|
-
onTreeBrowse == null ? void 0 : onTreeBrowse(
|
|
126
|
+
const handleNodeToggle = (_e, itemIds) => {
|
|
127
|
+
itemIds.every((itemId) => {
|
|
128
|
+
if (!(expanded == null ? void 0 : expanded.includes(itemId))) {
|
|
129
|
+
onTreeBrowse == null ? void 0 : onTreeBrowse(itemId);
|
|
124
130
|
return false;
|
|
125
131
|
}
|
|
126
132
|
return true;
|
|
127
133
|
});
|
|
128
|
-
setExpanded(
|
|
134
|
+
setExpanded(itemIds);
|
|
129
135
|
};
|
|
130
136
|
useEffect(() => {
|
|
131
137
|
if (!selectedProp) {
|
|
@@ -148,7 +154,7 @@ function TreeViewFinderComponant(props) {
|
|
|
148
154
|
return;
|
|
149
155
|
}
|
|
150
156
|
if (selectedProp.length > 0 && autoScrollAllowed) {
|
|
151
|
-
const isNodeExpanded = expandedProp == null ? void 0 : expandedProp.every((
|
|
157
|
+
const isNodeExpanded = expandedProp == null ? void 0 : expandedProp.every((itemId) => expanded == null ? void 0 : expanded.includes(itemId));
|
|
152
158
|
const lastScrollRef = scrollRef.current[scrollRef.current.length - 1];
|
|
153
159
|
if (isNodeExpanded && lastScrollRef) {
|
|
154
160
|
lastScrollRef.scrollIntoView({
|
|
@@ -162,8 +168,8 @@ function TreeViewFinderComponant(props) {
|
|
|
162
168
|
}, [expanded, selectedProp, expandedProp, data, autoScrollAllowed]);
|
|
163
169
|
const handleNodeSelect = (_e, values) => {
|
|
164
170
|
if (multiSelect && Array.isArray(values)) {
|
|
165
|
-
setSelected(values.filter((
|
|
166
|
-
} else if (
|
|
171
|
+
setSelected(values.filter((itemId) => isSelectable(mapPrintedNodes[itemId])));
|
|
172
|
+
} else if (typeof values === "string") {
|
|
167
173
|
if (selected == null ? void 0 : selected.includes(values)) {
|
|
168
174
|
setSelected([]);
|
|
169
175
|
} else {
|
|
@@ -192,7 +198,7 @@ function TreeViewFinderComponant(props) {
|
|
|
192
198
|
if (!node) {
|
|
193
199
|
return null;
|
|
194
200
|
}
|
|
195
|
-
if (isSelectable(node) && (selected == null ? void 0 : selected.find((
|
|
201
|
+
if (isSelectable(node) && (selected == null ? void 0 : selected.find((itemId) => itemId === node.id))) {
|
|
196
202
|
return /* @__PURE__ */ jsx(Check, { className: composeClasses(classes, cssLabelIcon) });
|
|
197
203
|
}
|
|
198
204
|
if (node.icon) {
|
|
@@ -207,28 +213,36 @@ function TreeViewFinderComponant(props) {
|
|
|
207
213
|
] });
|
|
208
214
|
};
|
|
209
215
|
const showChevron = (node) => {
|
|
210
|
-
return !!(node.childrenCount
|
|
216
|
+
return !!(node.childrenCount && node.childrenCount > 0);
|
|
211
217
|
};
|
|
212
218
|
const renderTree = (node) => {
|
|
213
219
|
if (!node) {
|
|
214
220
|
return null;
|
|
215
221
|
}
|
|
216
222
|
let childrenNodes = null;
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
}
|
|
222
|
-
childrenNodes = [false];
|
|
223
|
-
}
|
|
223
|
+
const showExpandIcon = showChevron(node);
|
|
224
|
+
if (Array.isArray(node.children) && node.children.length > 0) {
|
|
225
|
+
childrenNodes = node.children.toSorted(sortMethod).map(renderTree);
|
|
226
|
+
} else if (showExpandIcon) {
|
|
227
|
+
childrenNodes = [/* @__PURE__ */ jsx("span", { style: { display: "none" } }, "placeholder")];
|
|
224
228
|
}
|
|
225
229
|
return /* @__PURE__ */ jsx(
|
|
226
230
|
TreeItem,
|
|
227
231
|
{
|
|
228
|
-
|
|
232
|
+
itemId: node.id,
|
|
229
233
|
label: renderTreeItemLabel(node),
|
|
230
|
-
|
|
231
|
-
|
|
234
|
+
slots: {
|
|
235
|
+
expandIcon: CustomExpandIcon,
|
|
236
|
+
collapseIcon: CustomCollapseIcon
|
|
237
|
+
},
|
|
238
|
+
slotProps: {
|
|
239
|
+
expandIcon: {
|
|
240
|
+
className: composeClasses(classes, cssIcon)
|
|
241
|
+
},
|
|
242
|
+
collapseIcon: {
|
|
243
|
+
className: composeClasses(classes, cssIcon)
|
|
244
|
+
}
|
|
245
|
+
},
|
|
232
246
|
ref: (element) => {
|
|
233
247
|
if (selectedProp == null ? void 0 : selectedProp.includes(node.id)) {
|
|
234
248
|
scrollRef.current.push(element);
|
|
@@ -274,11 +288,11 @@ function TreeViewFinderComponant(props) {
|
|
|
274
288
|
/* @__PURE__ */ jsxs(DialogContent, { children: [
|
|
275
289
|
/* @__PURE__ */ jsx(DialogContentText, { children: contentText ?? intl.formatMessage({ id: "treeview_finder/contentText" }, { multiSelect }) }),
|
|
276
290
|
/* @__PURE__ */ jsx(
|
|
277
|
-
|
|
291
|
+
SimpleTreeView,
|
|
278
292
|
{
|
|
279
|
-
expanded,
|
|
280
|
-
|
|
281
|
-
|
|
293
|
+
expandedItems: expanded,
|
|
294
|
+
onExpandedItemsChange: handleNodeToggle,
|
|
295
|
+
onSelectedItemsChange: handleNodeSelect,
|
|
282
296
|
...getTreeViewSelectionProps(),
|
|
283
297
|
children: data && Array.isArray(data) ? data.sort(sortMethod).map((child) => renderTree(child)) : null
|
|
284
298
|
}
|
|
@@ -45,6 +45,8 @@ export declare const filterEn: {
|
|
|
45
45
|
missingDistributionKeyError: string;
|
|
46
46
|
filterCsvFileName: string;
|
|
47
47
|
createNewFilter: string;
|
|
48
|
+
createNewCriteriaFilter: string;
|
|
49
|
+
createNewExplicitNamingFilter: string;
|
|
48
50
|
nameProperty: string;
|
|
49
51
|
Countries: string;
|
|
50
52
|
Countries1: string;
|
|
@@ -39,6 +39,8 @@ const filterEn = {
|
|
|
39
39
|
missingDistributionKeyError: "Missing distribution key",
|
|
40
40
|
filterCsvFileName: "filterCreation",
|
|
41
41
|
createNewFilter: "Create a filter",
|
|
42
|
+
createNewCriteriaFilter: "Create a criteria based filter",
|
|
43
|
+
createNewExplicitNamingFilter: "Create an explicit naming filter",
|
|
42
44
|
nameProperty: "Name",
|
|
43
45
|
Countries: "Countries",
|
|
44
46
|
Countries1: "Countries 1",
|
|
@@ -45,6 +45,8 @@ export declare const filterFr: {
|
|
|
45
45
|
missingDistributionKeyError: string;
|
|
46
46
|
filterCsvFileName: string;
|
|
47
47
|
createNewFilter: string;
|
|
48
|
+
createNewCriteriaFilter: string;
|
|
49
|
+
createNewExplicitNamingFilter: string;
|
|
48
50
|
nameProperty: string;
|
|
49
51
|
Countries: string;
|
|
50
52
|
Countries1: string;
|
|
@@ -39,6 +39,8 @@ const filterFr = {
|
|
|
39
39
|
missingDistributionKeyError: "Clé de répartition manquante",
|
|
40
40
|
filterCsvFileName: "creationFiltre",
|
|
41
41
|
createNewFilter: "Créer un filtre",
|
|
42
|
+
createNewCriteriaFilter: "Créer un filtre par critères",
|
|
43
|
+
createNewExplicitNamingFilter: "Créer un filtre par nommage",
|
|
42
44
|
nameProperty: "Nom",
|
|
43
45
|
Countries: "Pays",
|
|
44
46
|
Countries1: "Pays 1",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gridsuite/commons-ui",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.94.0",
|
|
4
4
|
"description": "common react components for gridsuite applications",
|
|
5
5
|
"author": "gridsuite team",
|
|
6
6
|
"homepage": "https://github.com/gridsuite",
|
|
@@ -58,7 +58,7 @@
|
|
|
58
58
|
"@mui/icons-material": "^5.16.14",
|
|
59
59
|
"@mui/lab": "5.0.0-alpha.175",
|
|
60
60
|
"@mui/material": "^5.16.14",
|
|
61
|
-
"@mui/x-tree-view": "^
|
|
61
|
+
"@mui/x-tree-view": "^7.28.1",
|
|
62
62
|
"ag-grid-community": "^33.0.3",
|
|
63
63
|
"ag-grid-react": "^33.0.4",
|
|
64
64
|
"notistack": "^3.0.2",
|