Skip to content

Commit

Permalink
Merge remote-tracking branch 'origin/limit-sets-ui' into limit-sets-ui
Browse files Browse the repository at this point in the history
  • Loading branch information
Mathieu-Deharbe committed Dec 19, 2024
2 parents 9b5d9b8 + 2a8a00d commit 8005507
Show file tree
Hide file tree
Showing 15 changed files with 250 additions and 518 deletions.
86 changes: 23 additions & 63 deletions src/components/app.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -27,23 +27,11 @@ import { FormattedMessage } from 'react-intl';
import {
APP_NAME,
COMMON_APP_NAME,
PARAM_CENTER_LABEL,
PARAM_COMPONENT_LIBRARY,
PARAM_DEVELOPER_MODE,
PARAM_DIAGONAL_LABEL,
PARAM_FAVORITE_CONTINGENCY_LISTS,
PARAM_FLUX_CONVENTION,
PARAM_INIT_NAD_WITH_GEO_DATA,
PARAM_LANGUAGE,
PARAM_LIMIT_REDUCTION,
PARAM_LINE_FLOW_ALERT_THRESHOLD,
PARAM_LINE_FLOW_COLOR_MODE,
PARAM_LINE_FLOW_MODE,
PARAM_LINE_FULL_PATH,
PARAM_LINE_PARALLEL_PATH,
PARAM_MAP_BASEMAP,
PARAM_MAP_MANUAL_REFRESH,
PARAM_SUBSTATION_LAYOUT,
PARAM_THEME,
PARAM_USE_NAME,
} from '../utils/config-params';
Expand All @@ -64,30 +52,20 @@ import {
changeLockedColumns,
changeReorderedColumns,
limitReductionModified,
selectCenterLabelState,
selectComponentLibrary,
selectComputedLanguage,
selectDiagonalLabelState,
selectEnableDeveloperMode,
selectFavoriteContingencyLists,
selectFluxConvention,
selectInitNadWithGeoData,
selectLanguage,
selectLimitReduction,
selectLineFlowAlertThreshold,
selectLineFlowColorMode,
selectLineFlowMode,
selectLineFullPathState,
selectLineParallelPathState,
selectMapBaseMap,
selectMapManualRefresh,
selectSubstationLayout,
selectTheme,
selectUseName,
setOptionalServices,
setParamsLoaded,
setUpdateNetworkVisualizationParameters,
} from '../redux/actions';
import { NOTIFICATIONS_URL_KEYS } from './utils/notificationsProvider-utils';
import { getNetworkVisualizationParameters } from '../services/study/study-config.ts';

const noUserManager = { instance: null, error: null };

Expand All @@ -97,6 +75,7 @@ const App = () => {
const { snackError } = useSnackMessage();

const user = useSelector((state) => state.user);
const studyUuid = useSelector((state) => state.studyUuid);
const tablesNamesIndexes = useSelector((state) => state.tables.namesIndexes);
const tablesDefinitionIndexes = useSelector((state) => state.tables.definitionIndexes);

Expand All @@ -114,6 +93,14 @@ const App = () => {

const [tabIndex, setTabIndex] = useState(0);

const updateNetworkVisualizationsParams = useCallback(
(params) => {
console.debug('received network visualizations parameters : ', params);
dispatch(setUpdateNetworkVisualizationParameters(params));
},
[dispatch]
);

const updateParams = useCallback(
(params) => {
console.debug('received UI parameters : ', params);
Expand All @@ -133,51 +120,15 @@ const App = () => {
dispatch(selectLanguage(param.value));
dispatch(selectComputedLanguage(getComputedLanguage(param.value)));
break;
case PARAM_CENTER_LABEL:
dispatch(selectCenterLabelState(param.value === 'true'));
break;
case PARAM_DIAGONAL_LABEL:
dispatch(selectDiagonalLabelState(param.value === 'true'));
break;
case PARAM_LIMIT_REDUCTION:
dispatch(selectLimitReduction(param.value));
break;
case PARAM_LINE_FLOW_ALERT_THRESHOLD:
dispatch(selectLineFlowAlertThreshold(param.value));
break;
case PARAM_LINE_FLOW_COLOR_MODE:
dispatch(selectLineFlowColorMode(param.value));
break;
case PARAM_LINE_FLOW_MODE:
dispatch(selectLineFlowMode(param.value));
break;
case PARAM_FLUX_CONVENTION:
dispatch(selectFluxConvention(param.value));
break;
case PARAM_DEVELOPER_MODE:
dispatch(selectEnableDeveloperMode(param.value === 'true'));
break;
case PARAM_INIT_NAD_WITH_GEO_DATA:
dispatch(selectInitNadWithGeoData(param.value === 'true'));
break;
case PARAM_LINE_FULL_PATH:
dispatch(selectLineFullPathState(param.value === 'true'));
break;
case PARAM_LINE_PARALLEL_PATH:
dispatch(selectLineParallelPathState(param.value === 'true'));
break;
case PARAM_SUBSTATION_LAYOUT:
dispatch(selectSubstationLayout(param.value));
break;
case PARAM_COMPONENT_LIBRARY:
dispatch(selectComponentLibrary(param.value));
break;
case PARAM_MAP_MANUAL_REFRESH:
dispatch(selectMapManualRefresh(param.value === 'true'));
break;
case PARAM_MAP_BASEMAP:
dispatch(selectMapBaseMap(param.value));
break;
case PARAM_USE_NAME:
dispatch(selectUseName(param.value === 'true'));
break;
Expand Down Expand Up @@ -343,7 +294,11 @@ const App = () => {
}, [initialMatchSilentRenewCallbackUrl, dispatch, initialMatchSigninCallbackUrl]);

useEffect(() => {
if (user !== null) {
if (user !== null && studyUuid !== null) {
const fetchNetworkVisualizationParametersPromise = getNetworkVisualizationParameters(studyUuid).then(
(params) => updateNetworkVisualizationsParams(params)
);

const fetchCommonConfigPromise = fetchConfigParameters(COMMON_APP_NAME).then((params) =>
updateParams(params)
);
Expand Down Expand Up @@ -409,7 +364,12 @@ const App = () => {
// This might not be necessary but allows to gradually migrate parts
// of the code that don't subscribe to exactly the parameters they need.
// Code that depends on this could be rewritten to depend on what it acually needs.
Promise.all([fetchCommonConfigPromise, fetchAppConfigPromise, fetchOptionalServices])
Promise.all([
fetchNetworkVisualizationParametersPromise,
fetchCommonConfigPromise,
fetchAppConfigPromise,
fetchOptionalServices,
])
.then(() => {
dispatch(setParamsLoaded());
})
Expand All @@ -420,7 +380,7 @@ const App = () => {
})
);
}
}, [user, dispatch, updateParams, snackError]);
}, [user, studyUuid, dispatch, updateParams, snackError, updateNetworkVisualizationsParams]);

const onChangeTab = useCallback((newTabIndex) => {
setTabIndex(newTabIndex);
Expand Down
61 changes: 36 additions & 25 deletions src/components/diagrams/diagram-pane.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,15 +7,7 @@

import { Fragment, useCallback, useEffect, useRef, useState } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import {
PARAM_CENTER_LABEL,
PARAM_COMPONENT_LIBRARY,
PARAM_DIAGONAL_LABEL,
PARAM_INIT_NAD_WITH_GEO_DATA,
PARAM_LANGUAGE,
PARAM_SUBSTATION_LAYOUT,
PARAM_USE_NAME,
} from '../../utils/config-params';
import { PARAM_LANGUAGE, PARAM_USE_NAME } from '../../utils/config-params';
import { Box, Chip, Stack, Theme } from '@mui/material';
import ArrowUpwardIcon from '@mui/icons-material/ArrowUpward';
import TimelineIcon from '@mui/icons-material/Timeline';
Expand Down Expand Up @@ -60,11 +52,8 @@ const useDisplayView = (studyUuid: UUID, currentNode: CurrentTreeNode) => {
const { snackError } = useSnackMessage();
const paramUseName = useSelector((state: AppState) => state[PARAM_USE_NAME]);
const { getNameOrId } = useNameOrId();
const centerName = useSelector((state: AppState) => state[PARAM_CENTER_LABEL]);
const diagonalName = useSelector((state: AppState) => state[PARAM_DIAGONAL_LABEL]);
const substationLayout = useSelector((state: AppState) => state[PARAM_SUBSTATION_LAYOUT]);
const componentLibrary = useSelector((state: AppState) => state[PARAM_COMPONENT_LIBRARY]);
const language = useSelector((state: AppState) => state[PARAM_LANGUAGE]);
const networkVisuParams = useSelector((state: AppState) => state.networkVisualizationsParameters);

const checkAndGetVoltageLevelSingleLineDiagramUrl = useCallback(
(voltageLevelId: UUID) =>
Expand All @@ -74,14 +63,22 @@ const useDisplayView = (studyUuid: UUID, currentNode: CurrentTreeNode) => {
currentNode?.id,
voltageLevelId,
paramUseName,
centerName,
diagonalName,
componentLibrary,
networkVisuParams.singleLineDiagramParameters.centerLabel,
networkVisuParams.singleLineDiagramParameters.diagonalLabel,
networkVisuParams.singleLineDiagramParameters.componentLibrary,
SLD_DISPLAY_MODE.STATE_VARIABLE,
language
)
: null,
[currentNode, studyUuid, paramUseName, centerName, diagonalName, componentLibrary, language]
[
currentNode,
studyUuid,
paramUseName,
networkVisuParams.singleLineDiagramParameters.centerLabel,
networkVisuParams.singleLineDiagramParameters.diagonalLabel,
networkVisuParams.singleLineDiagramParameters.componentLibrary,
language,
]
);

const checkAndGetSubstationSingleLineDiagramUrl = useCallback(
Expand All @@ -92,22 +89,36 @@ const useDisplayView = (studyUuid: UUID, currentNode: CurrentTreeNode) => {
currentNode?.id,
voltageLevelId,
paramUseName,
centerName,
diagonalName,
substationLayout,
componentLibrary,
networkVisuParams.singleLineDiagramParameters.centerLabel,
networkVisuParams.singleLineDiagramParameters.diagonalLabel,
networkVisuParams.singleLineDiagramParameters.substationLayout,
networkVisuParams.singleLineDiagramParameters.componentLibrary,
language
)
: null,
[centerName, componentLibrary, diagonalName, studyUuid, substationLayout, paramUseName, currentNode, language]
[
networkVisuParams.singleLineDiagramParameters.centerLabel,
networkVisuParams.singleLineDiagramParameters.componentLibrary,
networkVisuParams.singleLineDiagramParameters.diagonalLabel,
studyUuid,
networkVisuParams.singleLineDiagramParameters.substationLayout,
paramUseName,
currentNode,
language,
]
);
const initNadWithGeoData = useSelector((state: AppState) => state[PARAM_INIT_NAD_WITH_GEO_DATA]);
const checkAndGetNetworkAreaDiagramUrl = useCallback(
(voltageLevelsIds: UUID[], depth: number) =>
isNodeBuilt(currentNode)
? getNetworkAreaDiagramUrl(studyUuid, currentNode?.id, voltageLevelsIds, depth, initNadWithGeoData)
? getNetworkAreaDiagramUrl(
studyUuid,
currentNode?.id,
voltageLevelsIds,
depth,
networkVisuParams.networkAreaDiagramParameters.initNadWithGeoData
)
: null,
[studyUuid, currentNode, initNadWithGeoData]
[studyUuid, currentNode, networkVisuParams.networkAreaDiagramParameters.initNadWithGeoData]
);

// this callback returns a promise
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,6 @@ import { mergeSx } from '../../utils/functions';
import ComputingType from '../../computing-status/computing-type';
import { AppState } from 'redux/reducer';
import { storeNetworkAreaDiagramNodeMovement } from '../../../redux/actions';
import { PARAM_INIT_NAD_WITH_GEO_DATA } from '../../../utils/config-params';
import { getNadIdentifier } from '../diagram-utils';
import EquipmentPopover from 'components/tooltips/equipment-popover';
import { UUID } from 'crypto';
Expand Down Expand Up @@ -156,16 +155,16 @@ function NetworkAreaDiagramContent(props: NetworkAreaDiagramContentProps) {
const loadFlowStatus = useSelector((state: AppState) => state.computingStatus[ComputingType.LOAD_FLOW]);
const nadNodeMovements = useSelector((state: AppState) => state.nadNodeMovements);
const diagramStates = useSelector((state: AppState) => state.diagramStates);
const initNadWithGeoData = useSelector((state: AppState) => state[PARAM_INIT_NAD_WITH_GEO_DATA]);
const networkVisuParams = useSelector((state: AppState) => state.networkVisualizationsParameters);
const [shouldDisplayTooltip, setShouldDisplayTooltip] = useState(false);
const [anchorPosition, setAnchorPosition] = useState({ top: 0, left: 0 });
const [hoveredEquipmentId, setHoveredEquipmentId] = useState('');
const [hoveredEquipmentType, setHoveredEquipmentType] = useState('');
const studyUuid = useSelector((state: AppState) => state.studyUuid);

const nadIdentifier = useMemo(() => {
return getNadIdentifier(diagramStates, initNadWithGeoData);
}, [diagramStates, initNadWithGeoData]);
return getNadIdentifier(diagramStates, networkVisuParams.networkAreaDiagramParameters.initNadWithGeoData);
}, [diagramStates, networkVisuParams.networkAreaDiagramParameters.initNadWithGeoData]);

const onMoveNodeCallback = useCallback(
(equipmentId: string, nodeId: string, x: number, y: number, xOrig: number, yOrig: number) => {
Expand Down
29 changes: 15 additions & 14 deletions src/components/diagrams/singleLineDiagram/position-diagram-pane.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,13 +8,7 @@
import Dialog from '@mui/material/Dialog';
import { useCallback, useEffect, useState } from 'react';
import { useSelector } from 'react-redux';
import {
PARAM_CENTER_LABEL,
PARAM_COMPONENT_LIBRARY,
PARAM_DIAGONAL_LABEL,
PARAM_LANGUAGE,
PARAM_USE_NAME,
} from '../../../utils/config-params';
import { PARAM_LANGUAGE, PARAM_USE_NAME } from '../../../utils/config-params';
import PositionDiagram from './position-diagram';
import { SLD_DISPLAY_MODE } from '../../network/constants';
import { DiagramType } from '../diagram-common';
Expand All @@ -39,10 +33,8 @@ const PositionDiagramPane: FC<PositionDiagramPaneProps> = ({
studyUuid,
}) => {
const useName = useSelector((state: AppState) => state[PARAM_USE_NAME]);
const centerName = useSelector((state: AppState) => state[PARAM_CENTER_LABEL]);
const diagonalName = useSelector((state: AppState) => state[PARAM_DIAGONAL_LABEL]);
const componentLibrary = useSelector((state: AppState) => state[PARAM_COMPONENT_LIBRARY]);
const language = useSelector((state: AppState) => state[PARAM_LANGUAGE]);
const networkVisuParams = useSelector((state: AppState) => state.networkVisualizationsParameters);

const [svgUrl, setSvgUrl] = useState<string | null>(null);
const handleClose = () => {
Expand All @@ -57,13 +49,22 @@ const PositionDiagramPane: FC<PositionDiagramPaneProps> = ({
currentNodeUuid,
voltageLevelId?.id,
useName,
centerName,
diagonalName,
componentLibrary,
networkVisuParams.singleLineDiagramParameters.centerLabel,
networkVisuParams.singleLineDiagramParameters.diagonalLabel,
networkVisuParams.singleLineDiagramParameters.componentLibrary,
SLD_DISPLAY_MODE.FEEDER_POSITION,
language
),
[studyUuid, currentNodeUuid, voltageLevelId?.id, useName, centerName, diagonalName, componentLibrary, language]
[
studyUuid,
currentNodeUuid,
voltageLevelId?.id,
useName,
networkVisuParams.singleLineDiagramParameters.centerLabel,
networkVisuParams.singleLineDiagramParameters.diagonalLabel,
networkVisuParams.singleLineDiagramParameters.componentLibrary,
language,
]
);

useEffect(() => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -49,15 +49,15 @@ export const networkVisualizationParametersSchema = yup.object().shape({
[PARAM_LINE_PARALLEL_PATH]: yup.boolean(),
[PARAM_LINE_FLOW_MODE]: yup.string(),
[PARAM_LINE_FLOW_COLOR_MODE]: yup.string(),
[PARAM_LINE_FLOW_ALERT_THRESHOLD]: yup.number().positive(),
[PARAM_LINE_FLOW_ALERT_THRESHOLD]: yup.number().positive().max(100),
[PARAM_MAP_MANUAL_REFRESH]: yup.boolean(),
[PARAM_MAP_BASEMAP]: yup.string(),
}),
[TabValue.SINGLE_LINE_DIAGRAM]: yup.object().shape({
[PARAM_DIAGONAL_LABEL]: yup.boolean(),
[PARAM_CENTER_LABEL]: yup.boolean(),
[PARAM_SUBSTATION_LAYOUT]: yup.string(),
[PARAM_COMPONENT_LIBRARY]: yup.string().nullable(),
[PARAM_COMPONENT_LIBRARY]: yup.string(),
}),
[TabValue.NETWORK_AREA_DIAGRAM]: yup.object().shape({
[PARAM_INIT_NAD_WITH_GEO_DATA]: yup.boolean(),
Expand Down
Loading

0 comments on commit 8005507

Please sign in to comment.