Fix sonar issues

Signed-off-by: Ayoub LABIDI <[email protected]>

Author: ayolab

src/components/graph/nodes/labeled-group-node.styles.ts

@@ -9,13 +9,20 @@ import { type MuiStyles } from '@gridsuite/commons-ui';
 import { colors, Theme } from '@mui/material';
 import { zoomStyles } from '../zoom.styles';
 
-export const LABEL_BLOCK_HEIGHT = 30; // px, matches label box vertical size
+export const LABEL_GROUP_OFFSET = 30;
 
-export const getContainerStyle = (theme: Theme, isLight: boolean) => ({
-    ...zoomStyles.labeledGroupBorder(theme),
-    background: theme.tree?.is.minimalDetail ? (isLight ? theme.palette.grey[200] : colors.grey[700]) : 'transparent',
-    borderColor: isLight ? colors.grey[400] : colors.grey[500],
-});
+export const getContainerStyle = (theme: Theme, isLight: boolean) => {
+    let backgroundColor = 'transparent';
+    if (theme.tree?.is.minimalDetail) {
+        backgroundColor = isLight ? theme.palette.grey[200] : colors.grey[700];
+    }
+
+    return {
+        ...zoomStyles.labeledGroupBorder(theme),
+        background: backgroundColor,
+        borderColor: isLight ? colors.grey[400] : colors.grey[500],
+    };
+};
 
 export const labeledGroupNodeStyles = {
     label: (theme) => ({

src/components/graph/nodes/labeled-group-node.tsx

@@ -12,7 +12,7 @@ import { nodeHeight as nodeLayoutHeight, nodeWidth as nodeLayoutWidth } from '..
 import { FormattedMessage } from 'react-intl';
 import { LabeledGroupNodeType } from './labeled-group-node.type';
 import { NODE_HEIGHT, NODE_WIDTH } from './constants';
-import { labeledGroupNodeStyles, getContainerStyle, LABEL_BLOCK_HEIGHT } from './labeled-group-node.styles';
+import { labeledGroupNodeStyles, getContainerStyle, LABEL_GROUP_OFFSET } from './labeled-group-node.styles';
 
 export function LabeledGroupNode({ data }: NodeProps<LabeledGroupNodeType>) {
     const theme = useTheme();
@@ -23,13 +23,13 @@ export function LabeledGroupNode({ data }: NodeProps<LabeledGroupNodeType>) {
     const horizontalPadding = (nodeLayoutWidth - NODE_WIDTH) / 2;
 
     // Adjust position and size to account for border width and label block
-    const labeledGroupTopPosition = data.position.topLeft.row * nodeLayoutHeight - verticalPadding - LABEL_BLOCK_HEIGHT;
+    const labeledGroupTopPosition = data.position.topLeft.row * nodeLayoutHeight - verticalPadding - LABEL_GROUP_OFFSET;
     const labeledGroupLeftPosition = data.position.topLeft.column * nodeLayoutWidth - horizontalPadding;
 
     const labeledGroupHeight =
         (data.position.bottomRight.row - data.position.topLeft.row + 1) * nodeLayoutHeight -
         2 * verticalPadding +
-        2 * LABEL_BLOCK_HEIGHT;
+        2 * LABEL_GROUP_OFFSET;
     const labeledGroupWidth = (data.position.bottomRight.column - data.position.topLeft.column + 1) * nodeLayoutWidth;
 
     const isLight = theme.palette.mode === 'light';

src/components/graph/nodes/network-modification-node.tsx

@@ -49,7 +49,10 @@ const NetworkModificationNode = (props: NodeProps<ModificationNode>) => {
     }, [props.id, selectionForCopy]);
 
     const nodeOpacity = useMemo(() => {
-        return isSelectedForCut() ? (getLocalStorageTheme() === LIGHT_THEME ? 0.3 : 0.6) : 1;
+        if (!isSelectedForCut()) {
+            return 1;
+        }
+        return getLocalStorageTheme() === LIGHT_THEME ? 0.3 : 0.6;
     }, [isSelectedForCut]);
 
     const tooltipContent = useMemo(() => {