Merge pull request #41 from interactivethings/feat/team-communication

Feat/team communication
interactivethings · Oct 2, 2024 · a217377 · a217377
2 parents 97b5499 + 15b6b61
commit a217377
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 33 deletions.
diff --git a/components/team-communication/internal/TeamDefs.tsx b/components/team-communication/internal/TeamDefs.tsx
@@ -15,43 +15,27 @@ const TeamDefs: FC<ITeamDefsProps> = ({ edges }) => {
               id={`source-${String(edge.source.id)}-${
                 edge.source.color.split('#')[1]
               }-${edge.target.color.split('#')[1]}`}
-              x1={edge.source.x > edge.target.x ? '100%' : '0'}
-              y1={edge.source.y > edge.target.y ? '100%' : '0'}
-              x2={edge.source.x > edge.target.x ? '0' : '100%'}
-              y2={edge.source.y > edge.target.y ? '0' : '100%'}
+              gradientUnits="userSpaceOnUse"
+              x1={edge.source.x}
+              y1={edge.source.y}
+              x2={edge.target.x}
+              y2={edge.target.y}
             >
-              <stop offset="0%" stopOpacity={1} stopColor={edge.source.color} />
-              <stop
-                offset="75%"
-                stopOpacity={1}
-                stopColor={edge.source.color}
-              />
-              <stop
-                offset="100%"
-                stopOpacity={1}
-                stopColor={edge.target.color}
-              />
+              <stop offset="0%" stopColor={edge.source.color} />
+              <stop offset="100%" stopColor={edge.target.color} />
             </linearGradient>
             <linearGradient
               id={`target-${String(edge.target.id)}-${
                 edge.target.color.split('#')[1]
               }-${edge.source.color.split('#')[1]}`}
-              x1={edge.target.x > edge.source.x ? '100%' : '0'}
-              y1={edge.target.y > edge.source.y ? '100%' : '0'}
-              x2={edge.target.x > edge.source.x ? '0' : '100%'}
-              y2={edge.target.y > edge.source.y ? '0' : '100%'}
+              gradientUnits="userSpaceOnUse"
+              x1={edge.target.x}
+              y1={edge.target.y}
+              x2={edge.source.x}
+              y2={edge.source.y}
             >
-              <stop offset="0%" stopOpacity={1} stopColor={edge.target.color} />
-              <stop
-                offset="75%"
-                stopOpacity={1}
-                stopColor={edge.target.color}
-              />
-              <stop
-                offset="100%"
-                stopOpacity={1}
-                stopColor={edge.source.color}
-              />
+              <stop offset="0%" stopColor={edge.target.color} />
+              <stop offset="100%" stopColor={edge.source.color} />
             </linearGradient>
           </Fragment>
         );

diff --git a/components/team-communication/internal/TeamEdges.tsx b/components/team-communication/internal/TeamEdges.tsx
@@ -110,9 +110,9 @@ const TeamEdges: FC<ITeamEdgesProps> = ({
                 animate={{
                   pathLength: resetPath ? 0 : 1, // Reset to 0 if resetPath is true, then back to 1
                   strokeWidth: resetPath ? 5 : 1,
-                  opacity: hover !== '' && hover !== sourceNode.id ? 0.2 : 1,
+                  opacity: hover !== '' && hover !== sourceNode.id ? 0.1 : 1,
                   stroke:
-                    hover === targetNode.id
+                    hover === sourceNode.id
                       ? 'white'
                       : `url(#source-${sourceNode.id}-${
                           sourceNode.color.split('#')[1]
@@ -171,7 +171,7 @@ const TeamEdges: FC<ITeamEdgesProps> = ({
                 animate={{
                   pathLength: resetPath ? 0 : 1, // Reset to 0 if resetPath is true, then back to 1
                   strokeWidth: resetPath ? 5 : 1,
-                  opacity: hover !== '' && hover !== targetNode.id ? 0.2 : 1,
+                  opacity: hover !== '' && hover !== targetNode.id ? 0.1 : 1,
                   stroke:
                     hover === targetNode.id
                       ? 'white'