Merge branch 'shared' into ascend

SRI-International · Aug 22, 2024 · 17700a1 · 17700a1
2 parents 01216b6 + deac3ec
commit 17700a1
Show file tree

Hide file tree

Showing 4 changed files with 32 additions and 16 deletions.
diff --git a/src/components/Details/DetailsComponent.tsx b/src/components/Details/DetailsComponent.tsx
@@ -89,7 +89,12 @@ export const DetailsComponent = () => {
    */
   function getRows(data: any) {
     if (data == null) return;
-    return Object.entries(data).sort().map(e => {
+    const rows = Object.entries(data);
+    const nameRow = rows.find(([key]) => key === 'name');
+    const otherRows = rows.filter(([key]) => key !== 'name');
+    const sortedRows = otherRows.sort((a, b) => a[0].localeCompare(b[0]));
+    const finalRows = nameRow ? [nameRow, ...sortedRows] : sortedRows;
+    return finalRows.map(e => {
       return <TableRow>
         <TableCell style={{ width: 1 }}><strong>{String(e[0])}</strong></TableCell>
         <TableCell style={{ paddingRight: 5 }}>

diff --git a/src/components/Details/QueryComponent.tsx b/src/components/Details/QueryComponent.tsx
@@ -8,7 +8,7 @@ import axios from "axios";
 import { COMMON_GREMLIN_ERROR, QUERY_ENDPOINT } from "../../constants";
 import { onFetchQuery } from "../../logics/actionHelper";
 import { RootState } from "../../app/store";
-import { highlightNodesAndEdges } from "../../logics/graphImpl/visImpl";
+// import { highlightNodesAndEdges } from "../../logics/graphImpl/visImpl";
 
 const Query = ({ }) => {
   const dispatch = useDispatch()
@@ -24,7 +24,7 @@ const Query = ({ }) => {
 
   function sendQuery() {
     dispatch(setError(null));
-    highlightNodesAndEdges(null, null);
+    // highlightNodesAndEdges(null, null);
     axios
       .post(
         QUERY_ENDPOINT,

diff --git a/src/components/Details/WorkspacesComponent.tsx b/src/components/Details/WorkspacesComponent.tsx
@@ -82,7 +82,7 @@ export const Workspaces = () => {
     for (let i= 0; i < ids.length; i += chunksize) {
       const chunk = ids.slice(i, i + chunksize)
       const withinStep = `within(${chunk.map(id => `'${id}'`).join(', ')})`;
-      const query = `g.V().hasId(${withinStep})`;
+      const query = `g.V().has('layout_id', ${withinStep})`;
       axios
         .post(
           QUERY_ENDPOINT,

diff --git a/src/logics/graphImpl/cytoImpl.ts b/src/logics/graphImpl/cytoImpl.ts
@@ -52,13 +52,16 @@ function toCyNode(n: NodeData): cy.NodeDefinition {
     group: "nodes",
     data: { ...n, id: n.id!.toString() },
     style: {
-      'background-color': color,
-      'background-opacity': 0.7,
-      'border-width': '3px',
+      'width': 41,
+      'height': 41,
       'border-color': color,
+      'border-width': '0px',
+      'background-color': color,
+      'background-opacity': 0,
       'background-image': getIcon(n.type),
       'background-fit': 'contain',
-      'text-max-width' : '100px',
+      //'font-size': '0px',
+      'text-max-width' : '80px',
       'text-wrap': 'wrap',
       'text-valign': 'bottom'
     },
@@ -109,7 +112,9 @@ export function getCytoGraph(container?: HTMLElement, data?: GraphData, options?
           style: {
             width: 1,
             "curve-style": "bezier",
-            "target-arrow-shape": 'triangle',
+	    "target-arrow-shape": 'triangle',
+	    //"font-size": "0px",
+	    "text-rotation": "autorotate",
             "label": "data(label)"
           }
         }
@@ -150,7 +155,7 @@ export function getCytoGraph(container?: HTMLElement, data?: GraphData, options?
           },
           enabled: true // whether the command is selectable
         },
-      ], // function( ele ){ return [ /*...*/ ] }, // a function that returns commands or a promise of commands
+    ], // function( ele ){ return [ /*...*/ ] }, // a function that returns commands or a promise of commands
     })
 
     layout.start()
@@ -229,11 +234,10 @@ export function getCytoGraph(container?: HTMLElement, data?: GraphData, options?
         graph.remove(n)
       }
     }
-    const nodeIds = graph.nodes().map(x => x.id())
     for (let e of edges) {
       if (!graph.edges().map(x => x.id()).includes(e.data.id!) && graph.$id(e.data.target).size() > 0) {
         const sourceNodeID = e.data.source
-        if (!nodeIds.includes(sourceNodeID)) {
+        if (!graph.nodes().map(x => x.id()).includes(sourceNodeID)) {
           continue;
         }
         graph.add(e)
@@ -299,12 +303,19 @@ export function applyLayout(name: string) {
 export function getNodePositions() {
   layout?.stop()
   store.dispatch(setIsPhysicsEnabled(false))
-  let positions: Record<string, { x: number, y: number }> = {};
+  let positions: Record<string, { node_id: string, name: string, x: number, y: number}> = {};
+  let nodemaps:  Record<string, { name: string, layout_id:string }> = {};
+
   graph?.nodes().forEach(node => {
-    positions[node.data('id')] = Object.assign({}, node.position())
+    const node_name = node.data('properties').name;
+    const node_id = node.data('id');
+    const node_position = node.position();
+    positions[node.data('properties').layout_id] = {node_id: node_id, name: node_name, x: node_position.x, y: node_position.y}
   })
   return {
     layout: positions,
+    nodemap: nodemaps,
+    //layout: layouts,
     zoom: graph?.zoom(),
     view: Object.assign({}, graph?.pan())
   };
@@ -314,7 +325,7 @@ export function setNodePositions(workspace: Workspace | undefined) {
   layout?.stop()
   store.dispatch(setIsPhysicsEnabled(false))
   graph?.nodes().forEach(node => {
-    let newPosition = workspace?.layout[node.data('id')]
+    let newPosition = workspace?.layout[node.data('properties').layout_id]
     if (newPosition !== undefined) node.position(newPosition);
   })
   graph?.zoom(workspace?.zoom)
@@ -345,4 +356,4 @@ export function exportIMG() {
   document.body.appendChild(link);
   link.click();
   document.body.removeChild(link);
-}
+}