feat: make edges not clickable

Author: sanjayankur31

assets/cy-style.json

@@ -18,7 +18,8 @@
         "line-color": "#e2e2e2",
         "target-arrow-color": "#e2e2e2",
         "color": "#1984c5",
-        "edge-text-rotation": "autorotate"
+        "edge-text-rotation": "autorotate",
+        "events": "no"
     }
   },
   {

graph.js

@@ -299,7 +299,12 @@ function newEdge(name, relation) {
             id: name + " → " + relation["name"],
             source: name,
             target: relation["name"],
-            label: relation["description"]
+            label: relation["description"],
+            style: {
+                "event": "no",
+                "selectable": false,
+                "grabbable": false
+            },
         }
     }
 }

index.js

@@ -19,8 +19,8 @@ function showDetails(data, connected) {
         details_top.innerHTML += "<ul>";
         details_top.innerHTML += "<li>Use the 'Toggle Filters' button to activate the simulation engine filter.</li>";
         details_top.innerHTML += "<li>Select what simulation engines you would like to show in the graph.</li>";
-        details_top.innerHTML += "<li>Select a node/edge to see its ecosystem in the graph.</li>";
-        details_top.innerHTML += "<li>Double click/tap on a node/edge to see details of the tool.</li>";
+        details_top.innerHTML += "<li>Select a node to see its ecosystem in the graph.</li>";
+        details_top.innerHTML += "<li>Double click/tap on a node to see details of the tool.</li>";
         details_top.innerHTML += "<li>Click outside to unselect nodes.</li>";
         details_top.innerHTML += "</ul>";
         details_top.innerHTML += "<h3 class='mt-3'>Contributing</h2>";