From 37e5d7b0d94b805c0a883e23da93135263cb28ba Mon Sep 17 00:00:00 2001
From: haikdc <haikdecie@gmail.com>
Date: Fri, 20 Mar 2026 23:11:55 -0700
Subject: [PATCH] [Haik]: fixed dashboard lag on drag for both cards and
 linkages

---
 .../src/app/pages/Dashboard/Dashboard.tsx     | 26 ++++++-------------
 1 file changed, 8 insertions(+), 18 deletions(-)

diff --git a/frontend/src/app/pages/Dashboard/Dashboard.tsx b/frontend/src/app/pages/Dashboard/Dashboard.tsx
index 3f12c354..d20b6b97 100644
--- a/frontend/src/app/pages/Dashboard/Dashboard.tsx
+++ b/frontend/src/app/pages/Dashboard/Dashboard.tsx
@@ -1237,10 +1237,8 @@ const DashboardInner: React.FC = () => {
                       transition: `opacity ${TETHER_FADE_MS}ms ease-out`,
                     }}
                   >
-                    <motion.path
-                      initial={false}
-                      animate={{ d: t.path }}
-                      transition={{ type: 'spring', stiffness: 200, damping: 25, mass: 0.8 }}
+                    <path
+                      d={t.path}
                       fill="none"
                       stroke={c.accent.primary}
                       strokeWidth={8}
@@ -1249,10 +1247,8 @@ const DashboardInner: React.FC = () => {
                       opacity={0.2}
                       filter="url(#tether-glow-f)"
                     />
-                    <motion.path
-                      initial={false}
-                      animate={{ d: t.path }}
-                      transition={{ type: 'spring', stiffness: 200, damping: 25, mass: 0.8 }}
+                    <path
+                      d={t.path}
                       fill="none"
                       stroke={c.accent.primary}
                       strokeWidth={2}
@@ -1262,10 +1258,8 @@ const DashboardInner: React.FC = () => {
                       markerEnd="url(#tether-arrow)"
                       style={{ animation: 'tether-pulse 2s ease-in-out infinite' }}
                     />
-                    <motion.path
-                      initial={false}
-                      animate={{ d: t.path }}
-                      transition={{ type: 'spring', stiffness: 200, damping: 25, mass: 0.8 }}
+                    <path
+                      d={t.path}
                       fill="none"
                       stroke={c.accent.primary}
                       strokeWidth={1.5}
@@ -1276,11 +1270,7 @@ const DashboardInner: React.FC = () => {
                       style={{ animation: 'tether-flow 0.6s linear infinite' }}
                     />
                     {t.label && (
-                      <motion.g
-                        initial={false}
-                        animate={{ x: t.labelX, y: t.labelY }}
-                        transition={{ type: 'spring', stiffness: 200, damping: 25, mass: 0.8 }}
-                      >
+                      <g transform={`translate(${t.labelX},${t.labelY})`}>
                         <rect
                           x={-4}
                           y={-14}
@@ -1303,7 +1293,7 @@ const DashboardInner: React.FC = () => {
                         >
                           {t.label}
                         </text>
-                      </motion.g>
+                      </g>
                     )}
                   </g>
                 ))}