Fix the mouse cursors on NADs (#3297)

* Fix the mouse cursors on NADs

---------

Signed-off-by: BOUTIER Charly <[email protected]>

Author: EstherDarkish

src/components/grid-layout/cards/diagrams/diagram-styles.ts

@@ -104,6 +104,20 @@ export const styles = {
             transform: 'unset !important',
         },
     },
+    nadDefaultCursors: {
+        '& .nad-branch-edges .nad-edge-path, & .nad-3wt-edges .nad-edge-path, & .nad-branch-edges .nad-winding, & .nad-3wt-nodes .nad-winding, & .nad-edge-infos':
+            {
+                cursor: 'context-menu',
+            },
+    },
+    nadEditModeCursors: {
+        '& .nad-label-box, & .nad-vl-nodes .nad-busnode': {
+            cursor: 'grab',
+        },
+        '& .nad-edge-infos': {
+            cursor: 'default',
+        },
+    },
     paperBorders: (theme) => ({
         borderLeft: '1px solid ' + theme.palette.action.disabled,
         borderBottom: '1px solid ' + theme.palette.action.disabledBackground,

src/components/grid-layout/cards/diagrams/networkAreaDiagram/network-area-diagram-content.tsx

@@ -393,7 +393,8 @@ function NetworkAreaDiagramContent(props: NetworkAreaDiagramContentProps) {
                     styles.divDiagram,
                     styles.divNetworkAreaDiagram,
                     loadFlowStatus !== RunningStatus.SUCCEED ? styles.divDiagramInvalid : undefined,
-                    isEditNadMode && !showLabels ? styles.hideLabels : undefined
+                    isEditNadMode && !showLabels ? styles.hideLabels : undefined,
+                    isEditNadMode ? styles.nadEditModeCursors : styles.nadDefaultCursors
                 )}
             />
             <DiagramControls

src/index.css

@@ -162,6 +162,7 @@ code {
     stroke: none;
     fill: black;
     font: 11px 'Verdana';
+    cursor: context-menu !important;
 }
 .sld-graph-label {
     stroke: none;
@@ -300,6 +301,7 @@ code {
 .sld-voltage-level:has(circle.sld-bus-8:hover, .sld-bus-8.sld-busbar-section:hover) .sld-bus-8.sld-busbar-section,
 .sld-voltage-level:has(circle.sld-bus-9:hover, .sld-bus-9.sld-busbar-section:hover) .sld-bus-9.sld-busbar-section {
     stroke-width: 5px;
+    cursor: context-menu !important;
 }
 .sld-voltage-level:has(circle.sld-bus-0:hover, .sld-bus-0.sld-busbar-section:hover) .sld-bus-0.sld-wire,
 .sld-voltage-level:has(circle.sld-bus-1:hover, .sld-bus-1.sld-busbar-section:hover) .sld-bus-1.sld-wire,

src/nad-index.css

@@ -1,9 +1,5 @@
 .nad-branch-edges .nad-edge-path,
-.nad-3wt-edges .nad-edge-path {
-    stroke: var(--vl-color, lightgrey);
-    stroke-width: 0.25%;
-    fill: none;
-}
+.nad-3wt-edges .nad-edge-path,
 .nad-branch-edges .nad-winding,
 .nad-3wt-nodes .nad-winding {
     stroke: var(--vl-color, lightgrey);
@@ -67,7 +63,7 @@ foreignObject.nad-text-nodes {
     width: max-content;
     padding: 10px;
     border-radius: 10px;
-    cursor: grab;
+    cursor: default;
     border: 2px solid rgba(0,0,0,0);
 }
 .nad-legend-square {