commit

Author: Anchel123

app/components/chat.tsx

@@ -405,7 +405,7 @@ export function Chat({ repo, path, setPath, graph, selectedPathId, isPathRespons
                                     "flex text-wrap border p-2 gap-2 rounded-md",
                                     p.nodes.length === selectedPath?.nodes.length &&
                                     selectedPath?.nodes.every(node => p?.nodes.some((n) => n.id === node.id)) &&
-                                    "border-[#FF66B3] bg-[#FFF0F7]",
+                                    "border-[#ffde21] bg-[#ffde2133]",
                                     message.graphName !== graph.Id && "opacity-50 bg-gray-200"
                                 )}
                                 title={message.graphName !== graph.Id ? `Move to graph ${message.graphName} to use this path` : undefined}

app/components/graphView.tsx

@@ -33,6 +33,7 @@ interface Props {
     setCooldownTime: Dispatch<SetStateAction<number>>
 }
 
+const PATH_COLOR = "#ffde21"
 const NODE_SIZE = 6;
 const PADDING = 2;
 
@@ -142,10 +143,13 @@ export default function GraphView({
                 nodeVisibility="visible"
                 linkVisibility="visible"
                 linkCurvature="curve"
+                linkDirectionalArrowRelPos={1}
+                linkDirectionalArrowColor={(link) => (link.isPath || link.isPathSelected) ? PATH_COLOR : link.color}
+                linkDirectionalArrowLength={(link) => link.source.id === link.target.id ? 0 : (link.id === selectedObj?.id || link.isPathSelected) ? 3 : 2}
                 nodeRelSize={NODE_SIZE}
                 linkLineDash={(link) => (link.isPath && !link.isPathSelected) ? [5, 5] : []}
-                linkColor={(link) => (link.isPath || link.isPathSelected) ? "#FF66B3" : link.color}
-                linkWidth={(link) => (link.id === selectedObj?.id || link.isPathSelected) ? 1 : 0.5}
+                linkColor={(link) => (link.isPath || link.isPathSelected) ? PATH_COLOR : link.color}
+                linkWidth={(link) => (link.id === selectedObj?.id || link.isPathSelected) ? 2 : 1}
                 nodeCanvasObjectMode={() => 'after'}
                 linkCanvasObjectMode={() => 'after'}
                 nodeCanvasObject={(node, ctx) => {
@@ -154,11 +158,11 @@ export default function GraphView({
                     if (isPathResponse) {
                         if (node.isPathSelected) {
                             ctx.fillStyle = node.color;
-                            ctx.strokeStyle = '#FF66B3';
+                            ctx.strokeStyle = PATH_COLOR;
                             ctx.lineWidth = 1
                         } else if (node.isPath) {
                             ctx.fillStyle = node.color;
-                            ctx.strokeStyle = '#FF66B3';
+                            ctx.strokeStyle = PATH_COLOR;
                             ctx.lineWidth = 0.5
                         } else {
                             ctx.fillStyle = '#E5E5E5';
@@ -168,11 +172,11 @@ export default function GraphView({
                     } else if (isPathResponse === undefined) {
                         if (node.isPathSelected) {
                             ctx.fillStyle = node.color;
-                            ctx.strokeStyle = '#FF66B3';
+                            ctx.strokeStyle = PATH_COLOR;
                             ctx.lineWidth = 1
                         } else if (node.isPath) {
                             ctx.fillStyle = node.color;
-                            ctx.strokeStyle = '#FF66B3';
+                            ctx.strokeStyle = PATH_COLOR;
                             ctx.lineWidth = 0.5
                         } else {
                             ctx.fillStyle = node.color;