@gridsuite/commons-ui 0.179.0 → 0.180.0

package/dist/components/network-modifications/common/connectivity/ConnectivityForm.js

@@ -0,0 +1,267 @@
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { IconButton, Tooltip, Grid } from "@mui/material";
+import { ExploreOutlined, ExploreOffOutlined } from "@mui/icons-material";
+import { useState, useRef, useMemo, useEffect, useCallback } from "react";
+import { useWatch } from "react-hook-form";
+import { useIntl } from "react-intl";
+import { getConnectivityVoltageLevelData, getConnectivityBusBarSectionData } from "./connectivityForm.utils.js";
+import { FieldConstants } from "../../../../utils/constants/fieldConstants.js";
+import "../../../../utils/conversionUtils.js";
+import { getConnectionDirectionLabel, CONNECTION_DIRECTIONS } from "../../../../utils/types/equipmentType.js";
+import { getObjectId, areIdsEqual } from "../../../../utils/ts-utils.js";
+import "../../../../utils/yupConfig.js";
+import "../../../overflowableText/OverflowableText.js";
+import "localized-countries";
+import "localized-countries/data/fr";
+import "localized-countries/data/en";
+import "notistack";
+import "../../../inputs/reactHookForm/provider/CustomFormProvider.js";
+import { useCustomFormContext } from "../../../inputs/reactHookForm/provider/useCustomFormContext.js";
+import "yup";
+import "../../../treeViewFinder/TreeViewFinder.js";
+import "../../../inputs/reactHookForm/agGridTable/BottomRightButtons.js";
+import "../../../customAGGrid/customAggrid.js";
+import "ag-grid-community";
+import "react-papaparse";
+import "react-csv-downloader";
+import { AutocompleteInput } from "../../../inputs/reactHookForm/autocompleteInputs/AutocompleteInput.js";
+import { SwitchInput } from "../../../inputs/reactHookForm/booleans/SwitchInput.js";
+import { TextInput } from "../../../inputs/reactHookForm/text/TextInput.js";
+import { IntegerInput } from "../../../inputs/reactHookForm/numbers/IntegerInput.js";
+import "../../../inputs/reactHookForm/numbers/RangeInput.js";
+import { SelectInput } from "../../../inputs/reactHookForm/selectInputs/SelectInput.js";
+import "@material-symbols/svg-400/outlined/left_panel_open.svg?react";
+import "@material-symbols/svg-400/outlined/arrows_output.svg?react";
+import "@material-symbols/svg-400/outlined/left_panel_close.svg?react";
+import "@material-symbols/svg-400/outlined/add_notes.svg?react";
+import "../../../dialogs/descriptionModificationDialog/DescriptionModificationDialog.js";
+import { CheckboxNullableInput } from "../../../inputs/reactHookForm/CheckboxNullableInput.js";
+import "@react-querybuilder/material";
+import "../../../filter/expert/expertFilterConstants.js";
+import "../../../inputs/reactQueryBuilder/CustomReactQueryBuilder.js";
+import "uuid";
+import "../../../inputs/reactQueryBuilder/PropertyValueEditor.js";
+import "react-querybuilder";
+function ConnectivityForm({
+  id = FieldConstants.CONNECTIVITY,
+  voltageLevelSelectLabel = "VOLTAGE_LEVEL",
+  direction = "row",
+  withDirectionsInfos = true,
+  withPosition = false,
+  newBusOrBusbarSectionOptions = [],
+  onVoltageLevelChangeCallback = void 0,
+  isEquipmentModification = false,
+  previousValues,
+  voltageLevelOptions = [],
+  PositionDiagramPane,
+  fetchBusesOrBusbarSections
+}) {
+  const [busOrBusbarSectionOptions, setBusOrBusbarSectionOptions] = useState([]);
+  const [isDiagramPaneOpen, setIsDiagramPaneOpen] = useState(false);
+  const lastFetchedBusesVlIds = useRef(null);
+  const intl = useIntl();
+  const { getValues, isNodeBuilt, setValue } = useCustomFormContext();
+  const watchVoltageLevelId = useWatch({
+    name: `${id}.${FieldConstants.VOLTAGE_LEVEL}.${FieldConstants.ID}`
+  });
+  const vlOptions = useMemo(
+    () => voltageLevelOptions.map((item) => ({
+      id: item.id,
+      label: item.name ?? ""
+    })),
+    [voltageLevelOptions]
+  );
+  useEffect(() => {
+    if (!fetchBusesOrBusbarSections) {
+      return;
+    }
+    if (watchVoltageLevelId) {
+      const existingVoltageLevelOption = voltageLevelOptions.find((option) => option.id === watchVoltageLevelId);
+      if (existingVoltageLevelOption) {
+        fetchBusesOrBusbarSections(watchVoltageLevelId).then((busesOrbusbarSections) => {
+          lastFetchedBusesVlIds.current = watchVoltageLevelId;
+          setBusOrBusbarSectionOptions(
+            busesOrbusbarSections?.map((busesOrbusbarSection) => ({
+              id: busesOrbusbarSection.id,
+              label: busesOrbusbarSection?.name ?? ""
+            })) || []
+          );
+        });
+      }
+      if (watchVoltageLevelId !== lastFetchedBusesVlIds.current) {
+        setBusOrBusbarSectionOptions([]);
+      }
+    } else {
+      setBusOrBusbarSectionOptions([]);
+    }
+  }, [id, fetchBusesOrBusbarSections, voltageLevelOptions, watchVoltageLevelId]);
+  useEffect(() => {
+    if (newBusOrBusbarSectionOptions?.length > 0) {
+      setBusOrBusbarSectionOptions(newBusOrBusbarSectionOptions);
+    }
+  }, [newBusOrBusbarSectionOptions]);
+  const handleChangeVoltageLevel = useCallback(() => {
+    onVoltageLevelChangeCallback?.();
+    setValue(`${id}.${FieldConstants.BUS_OR_BUSBAR_SECTION}`, null);
+  }, [id, onVoltageLevelChangeCallback, setValue]);
+  useEffect(() => {
+    const currentBusOrBusbarSection = getValues(`${id}.${FieldConstants.BUS_OR_BUSBAR_SECTION}`);
+    if (busOrBusbarSectionOptions?.length > 0 && currentBusOrBusbarSection?.id !== null) {
+      setValue(`${id}.${FieldConstants.BUS_OR_BUSBAR_SECTION}`, currentBusOrBusbarSection);
+    }
+  }, [busOrBusbarSectionOptions, setValue, id, getValues]);
+  const newVoltageLevelField = /* @__PURE__ */ jsx(
+    AutocompleteInput,
+    {
+      isOptionEqualToValue: areIdsEqual,
+      outputTransform: (value) => {
+        if (typeof value === "string") {
+          const data = getConnectivityVoltageLevelData({ voltageLevelId: value });
+          return { id: data?.id ?? "", label: "" };
+        }
+        return value;
+      },
+      previousValue: isEquipmentModification ? previousValues?.voltageLevelId : void 0,
+      onChangeCallback: handleChangeVoltageLevel,
+      allowNewValue: true,
+      forcePopupIcon: true,
+      selectOnFocus: true,
+      name: `${id}.${FieldConstants.VOLTAGE_LEVEL}`,
+      label: voltageLevelSelectLabel,
+      options: vlOptions,
+      getOptionLabel: getObjectId,
+      size: "small"
+    }
+  );
+  const previousConnectedField = useMemo(() => {
+    if (!isEquipmentModification) {
+      return null;
+    }
+    return previousValues?.terminalConnected ? intl.formatMessage({ id: "connected" }) : intl.formatMessage({ id: "disconnected" });
+  }, [intl, previousValues, isEquipmentModification]);
+  const connectedField = isEquipmentModification ? /* @__PURE__ */ jsx(
+    CheckboxNullableInput,
+    {
+      name: `${id}.${FieldConstants.CONNECTED}`,
+      label: "connected",
+      previousValue: previousConnectedField ?? void 0
+    }
+  ) : /* @__PURE__ */ jsx(SwitchInput, { name: `${id}.${FieldConstants.CONNECTED}`, label: "connected" });
+  const newBusOrBusbarSectionField = /* @__PURE__ */ jsx(
+    AutocompleteInput,
+    {
+      allowNewValue: true,
+      forcePopupIcon: true,
+      name: `${id}.${FieldConstants.BUS_OR_BUSBAR_SECTION}`,
+      label: "BusBarBus",
+      options: busOrBusbarSectionOptions,
+      previousValue: isEquipmentModification ? previousValues?.busOrBusbarSectionId : void 0,
+      getOptionLabel: getObjectId,
+      isOptionEqualToValue: areIdsEqual,
+      inputTransform: (value) => value ?? "",
+      outputTransform: (value) => {
+        if (typeof value === "string") {
+          const data = getConnectivityBusBarSectionData({ busbarSectionId: value });
+          return { id: data?.id ?? "", label: "" };
+        }
+        return value;
+      },
+      size: "small"
+    }
+  );
+  const newConnectionNameField = /* @__PURE__ */ jsx(
+    TextInput,
+    {
+      name: `${id}.${FieldConstants.CONNECTION_NAME}`,
+      label: "ConnectionName",
+      previousValue: isEquipmentModification ? previousValues?.connectablePosition?.connectionName ?? void 0 : void 0
+    }
+  );
+  const previousConnectionDirectionLabel = isEquipmentModification ? getConnectionDirectionLabel(previousValues?.connectablePosition?.connectionDirection) ?? null : null;
+  const newConnectionDirectionField = /* @__PURE__ */ jsx(
+    SelectInput,
+    {
+      name: `${id}.${FieldConstants.CONNECTION_DIRECTION}`,
+      label: "ConnectionDirection",
+      options: Object.values(CONNECTION_DIRECTIONS),
+      previousValue: (previousConnectionDirectionLabel && intl.formatMessage({
+        id: previousConnectionDirectionLabel
+      })) ?? void 0,
+      fullWidth: true,
+      size: "small"
+    }
+  );
+  const handleClickOpenDiagramPane = useCallback(() => {
+    setIsDiagramPaneOpen(true);
+  }, []);
+  const handleCloseDiagramPane = useCallback(() => {
+    setIsDiagramPaneOpen(false);
+  }, []);
+  const newConnectionPositionField = /* @__PURE__ */ jsx(
+    IntegerInput,
+    {
+      name: `${id}.${FieldConstants.CONNECTION_POSITION}`,
+      label: "ConnectionPosition",
+      previousValue: isEquipmentModification ? previousValues?.connectablePosition?.connectionPosition ?? void 0 : void 0,
+      clearable: true
+    }
+  );
+  const voltageLevelForPositionIcon = useMemo(
+    () => watchVoltageLevelId ?? (isEquipmentModification ? previousValues?.voltageLevelId : void 0),
+    [watchVoltageLevelId, isEquipmentModification, previousValues?.voltageLevelId]
+  );
+  const getPositionIconTooltipMessageId = useMemo(() => {
+    if (!isNodeBuilt) {
+      return "NodeNotBuildPositionMessage";
+    }
+    if (voltageLevelForPositionIcon) {
+      return "DisplayTakenPositions";
+    }
+    return "NoVoltageLevelPositionMessage";
+  }, [isNodeBuilt, voltageLevelForPositionIcon]);
+  const newPositionIconField = /* @__PURE__ */ jsx(
+    IconButton,
+    {
+      ...isNodeBuilt && voltageLevelForPositionIcon && { onClick: handleClickOpenDiagramPane },
+      disableRipple: !isNodeBuilt || !voltageLevelForPositionIcon,
+      edge: "start",
+      children: /* @__PURE__ */ jsx(
+        Tooltip,
+        {
+          title: intl.formatMessage({
+            id: getPositionIconTooltipMessageId
+          }),
+          children: isNodeBuilt && voltageLevelForPositionIcon ? /* @__PURE__ */ jsx(ExploreOutlined, { color: "action" }) : /* @__PURE__ */ jsx(ExploreOffOutlined, { color: "action" })
+        }
+      )
+    }
+  );
+  const gridSize = direction && (direction === "column" || direction === "column-reverse") ? 24 : 12;
+  const conditionalSize = withPosition && withDirectionsInfos ? 8 : gridSize;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(Grid, { container: true, direction: direction || "row", spacing: 2, columns: 24, children: [
+      /* @__PURE__ */ jsx(Grid, { item: true, xs: conditionalSize, sx: { align: "start" }, children: newVoltageLevelField }),
+      /* @__PURE__ */ jsx(Grid, { item: true, xs: conditionalSize, sx: { align: "start" }, children: newBusOrBusbarSectionField }),
+      withDirectionsInfos && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(Grid, { item: true, xs: conditionalSize, sx: { align: "start" }, children: connectedField }),
+        /* @__PURE__ */ jsx(Grid, { item: true, xs: conditionalSize, sx: { align: "start" }, children: newConnectionNameField }),
+        /* @__PURE__ */ jsx(Grid, { item: true, xs: conditionalSize, sx: { align: "start" }, children: newConnectionDirectionField }),
+        withPosition && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Grid, { xs: conditionalSize - 1, item: true, sx: { align: "start" }, children: newConnectionPositionField }),
+          PositionDiagramPane && /* @__PURE__ */ jsx(Grid, { xs: 1, item: true, sx: { align: "start" }, children: newPositionIconField })
+        ] })
+      ] })
+    ] }),
+    PositionDiagramPane && /* @__PURE__ */ jsx(
+      PositionDiagramPane,
+      {
+        open: isDiagramPaneOpen,
+        onClose: handleCloseDiagramPane,
+        voltageLevelId: voltageLevelForPositionIcon
+      }
+    )
+  ] });
+}
+export {
+  ConnectivityForm
+};

package/dist/components/network-modifications/common/connectivity/connectivity.type.d.ts

@@ -0,0 +1,34 @@
+import { Identifiable } from '../../../../utils';
+export interface ConnectablePositionFormInfos {
+    connectionDirection: string | null;
+    connectionName?: string | null;
+    connectionPosition?: number | null;
+}
+export interface ConnectablePositionInfos {
+    connectionDirection: string | null;
+    connectionName?: string | null;
+    connectionPosition?: number | null;
+}
+export interface Connectivity {
+    voltageLevel: {
+        id?: string;
+    };
+    busOrBusbarSection: {
+        id?: string;
+    };
+    connectionDirection?: string;
+    connectionName?: string;
+    connectionPosition?: number;
+    terminalConnected?: boolean;
+}
+type PositionDiagramPaneType = React.ComponentType<{
+    open: boolean;
+    onClose: () => void;
+    voltageLevelId: string;
+}>;
+export interface ConnectivityNetworkProps {
+    voltageLevelOptions?: Identifiable[];
+    PositionDiagramPane?: PositionDiagramPaneType;
+    fetchBusesOrBusbarSections?: (voltageLevelId: string) => Promise<Identifiable[]>;
+}
+export {};

package/dist/components/network-modifications/common/connectivity/connectivity.type.js

@@ -0,0 +1 @@
+

package/dist/components/network-modifications/common/connectivity/connectivityForm.utils.d.ts

@@ -0,0 +1,241 @@
+import { VoltageLevelFormInfos } from '../../voltage-level/voltage-level.type';
+import { FieldConstants } from '../../../../utils';
+export declare const getConnectivityPropertiesValidationSchema: (isEquipmentModification?: boolean) => {
+    voltageLevel: import('yup').ObjectSchema<{
+        id: string | undefined;
+    } | null, import('yup').AnyObject, {
+        id: undefined;
+    }, "">;
+    busOrBusbarSection: import('yup').ObjectSchema<{
+        id: string | undefined;
+    } | null, import('yup').AnyObject, {
+        id: undefined;
+    }, "">;
+};
+export declare const getConnectivityWithPositionSchema: (isEquipmentModification?: boolean) => import('yup').ObjectSchema<{
+    voltageLevel: {
+        id?: string | undefined;
+    } | null;
+    busOrBusbarSection: {
+        id?: string | undefined;
+    } | null;
+    connectionDirection: string | null | undefined;
+    connectionName: string | undefined;
+    connectionPosition: number | null | undefined;
+    terminalConnected: boolean | null | undefined;
+}, import('yup').AnyObject, {
+    voltageLevel: {
+        id: undefined;
+    };
+    busOrBusbarSection: {
+        id: undefined;
+    };
+    connectionDirection: undefined;
+    connectionName: undefined;
+    connectionPosition: undefined;
+    terminalConnected: undefined;
+}, "">;
+export declare const getConnectivityWithPositionValidationSchema: (isEquipmentModification?: boolean, id?: FieldConstants) => {
+    [x: string]: import('yup').ObjectSchema<{
+        voltageLevel: {
+            id?: string | undefined;
+        } | null;
+        busOrBusbarSection: {
+            id?: string | undefined;
+        } | null;
+        connectionDirection: string | null | undefined;
+        connectionName: string | undefined;
+        connectionPosition: number | null | undefined;
+        terminalConnected: boolean | null | undefined;
+    }, import('yup').AnyObject, {
+        voltageLevel: {
+            id: undefined;
+        };
+        busOrBusbarSection: {
+            id: undefined;
+        };
+        connectionDirection: undefined;
+        connectionName: undefined;
+        connectionPosition: undefined;
+        terminalConnected: undefined;
+    }, "">;
+};
+export declare const getCon1andCon2WithPositionValidationSchema: (isEquipmentModification?: boolean, id?: FieldConstants) => {
+    [x: string]: import('yup').ObjectSchema<{
+        [x: string]: {
+            terminalConnected?: boolean | null | undefined;
+            connectionDirection?: string | null | undefined;
+            connectionName?: string | undefined;
+            connectionPosition?: number | null | undefined;
+            busOrBusbarSection: {
+                id?: string | undefined;
+            } | null;
+            voltageLevel: {
+                id?: string | undefined;
+            } | null;
+        };
+    }, import('yup').AnyObject, {
+        [x: string]: {
+            voltageLevel: {
+                id: undefined;
+            };
+            busOrBusbarSection: {
+                id: undefined;
+            };
+            connectionDirection: undefined;
+            connectionName: undefined;
+            connectionPosition: undefined;
+            terminalConnected: undefined;
+        };
+    }, "">;
+};
+export declare const getConnectivityWithoutPositionValidationSchema: (id?: FieldConstants) => {
+    [x: string]: import('yup').ObjectSchema<{
+        voltageLevel: {
+            id?: string | undefined;
+        } | null;
+        busOrBusbarSection: {
+            id?: string | undefined;
+        } | null;
+    }, import('yup').AnyObject, {
+        voltageLevel: {
+            id: undefined;
+        };
+        busOrBusbarSection: {
+            id: undefined;
+        };
+    }, "">;
+};
+export declare const getConnectivityPropertiesEmptyFormData: (isEquipmentModification?: boolean) => {
+    voltageLevel: null;
+    busOrBusbarSection: null;
+    terminalConnected: boolean | null;
+};
+export declare const getConnectivityWithPositionEmptyFormDataProps: (isEquipmentModification?: boolean) => {
+    connectionDirection: null;
+    connectionName: string;
+    connectionPosition: null;
+    voltageLevel: null;
+    busOrBusbarSection: null;
+    terminalConnected: boolean | null;
+};
+export declare const getConnectivityWithPositionEmptyFormData: (isEquipmentModification?: boolean, id?: FieldConstants) => {
+    [x: string]: {
+        connectionDirection: null;
+        connectionName: string;
+        connectionPosition: null;
+        voltageLevel: null;
+        busOrBusbarSection: null;
+        terminalConnected: boolean | null;
+    };
+};
+export declare const getCont1Cont2WithPositionEmptyFormData: (isEquipmentModification?: boolean, id?: FieldConstants) => {
+    [x: string]: {
+        [x: string]: {
+            connectionDirection: null;
+            connectionName: string;
+            connectionPosition: null;
+            voltageLevel: null;
+            busOrBusbarSection: null;
+            terminalConnected: boolean | null;
+        };
+    };
+};
+export declare const getConnectivityWithoutPositionEmptyFormData: (id?: FieldConstants) => {
+    [x: string]: {
+        voltageLevel: null;
+        busOrBusbarSection: null;
+        terminalConnected: boolean | null;
+    };
+};
+export declare const getConnectivityVoltageLevelData: ({ voltageLevelId }: {
+    voltageLevelId?: string | null;
+}) => {
+    id: string;
+} | null;
+export declare const getConnectivityBusBarSectionData: ({ busbarSectionId }: {
+    busbarSectionId?: string | null;
+}) => {
+    id: string;
+} | null;
+export declare const getConnectivityPropertiesData: ({ voltageLevelId, busbarSectionId, }: {
+    voltageLevelId?: string | null;
+    busbarSectionId?: string | null;
+}) => {
+    voltageLevel: {
+        id: string;
+    } | null;
+    busOrBusbarSection: {
+        id: string;
+    } | null;
+};
+export declare const getNewVoltageLevelData: (newVoltageLevel: VoltageLevelFormInfos) => {
+    id: string;
+    name: string;
+    substationId: string | null | undefined;
+    topologyKind: string | null | undefined;
+};
+export declare const getConnectivityData: ({ voltageLevelId, busbarSectionId }: {
+    voltageLevelId?: string | null;
+    busbarSectionId?: string | null;
+}, id?: FieldConstants) => {
+    [x: string]: {
+        voltageLevel: {
+            id: string;
+        } | null;
+        busOrBusbarSection: {
+            id: string;
+        } | null;
+    };
+};
+export declare const getConnectivityFormDataProps: ({ voltageLevelId, busbarSectionId, connectionDirection, connectionName, connectionPosition, terminalConnected, isEquipmentModification, }: {
+    voltageLevelId?: string | null;
+    busbarSectionId?: string | null;
+    connectionDirection?: string | null;
+    connectionName?: string | null;
+    connectionPosition?: number | null;
+    terminalConnected?: boolean | null;
+    isEquipmentModification?: boolean;
+}) => {
+    connectionDirection: string | null;
+    connectionName: string;
+    connectionPosition: number | null;
+    terminalConnected: boolean | null;
+    voltageLevel: {
+        id: string;
+    } | null;
+    busOrBusbarSection: {
+        id: string;
+    } | null;
+};
+export declare const getConnectivityFormData: ({ voltageLevelId, busbarSectionId, connectionDirection, connectionName, connectionPosition, terminalConnected, isEquipmentModification, }: {
+    voltageLevelId?: string | null;
+    busbarSectionId?: string | null;
+    connectionDirection?: string | null;
+    connectionName?: string | null;
+    connectionPosition?: number | null;
+    terminalConnected?: boolean | null;
+    isEquipmentModification?: boolean;
+}, id?: FieldConstants) => {
+    [x: string]: {
+        connectionDirection: string | null;
+        connectionName: string;
+        connectionPosition: number | null;
+        terminalConnected: boolean | null;
+        voltageLevel: {
+            id: string;
+        } | null;
+        busOrBusbarSection: {
+            id: string;
+        } | null;
+    };
+};
+export declare const createConnectivityData: (equipmentToModify: any, index: number) => {
+    busbarSectionId: any;
+    connectionDirection: any;
+    connectionName: any;
+    connectionPosition: any;
+    voltageLevelId: any;
+    terminalConnected: any;
+    isEquipmentModification: boolean;
+};