From 7b351967cca0dd4be7cd6139a56dfc0e467f39d1 Mon Sep 17 00:00:00 2001
From: Paulo Gustavo Veiga <pveiga@wisemapping.com>
Date: Sat, 17 Dec 2022 21:17:36 -0800
Subject: [PATCH] Fix connexion and relationship render.

---
 .../mindplot/src/components/ConnectionLine.ts | 13 ++-------
 .../src/components/peer/svg/CurvedLinePeer.js | 29 +++++++++----------
 2 files changed, 16 insertions(+), 26 deletions(-)

diff --git a/packages/mindplot/src/components/ConnectionLine.ts b/packages/mindplot/src/components/ConnectionLine.ts
index 9775bcf1..efcc481c 100644
--- a/packages/mindplot/src/components/ConnectionLine.ts
+++ b/packages/mindplot/src/components/ConnectionLine.ts
@@ -51,17 +51,10 @@ class ConnectionLine {
     this._targetTopic = targetNode;
     this._sourceTopic = sourceNode;
 
-    let line: Line;
     const ctrlPoints = this._getCtrlPoints(sourceNode, targetNode);
-    if (targetNode.getType() === 'CentralTopic') {
-      line = this._createLine(LineType.CURVED);
-      line.setSrcControlPoint(ctrlPoints[0]);
-      line.setDestControlPoint(ctrlPoints[1]);
-    } else {
-      line = this._createLine(LineType.SIMPLE_CURVED);
-      line.setSrcControlPoint(ctrlPoints[0]);
-      line.setDestControlPoint(ctrlPoints[1]);
-    }
+    const line = this._createLine(LineType.SIMPLE_CURVED);
+    line.setSrcControlPoint(ctrlPoints[0]);
+    line.setDestControlPoint(ctrlPoints[1]);
     // Set line styles ...
     const strokeColor = ConnectionLine.getStrokeColor();
     line.setStroke(1, 'solid', strokeColor, 1);
diff --git a/packages/web2d/src/components/peer/svg/CurvedLinePeer.js b/packages/web2d/src/components/peer/svg/CurvedLinePeer.js
index 87a535a6..fd9ab141 100644
--- a/packages/web2d/src/components/peer/svg/CurvedLinePeer.js
+++ b/packages/web2d/src/components/peer/svg/CurvedLinePeer.js
@@ -149,26 +149,23 @@ class CurvedLinePeer extends ElementPeer {
     if ($defined(this._x1) && $defined(this._y1) && $defined(this._x2) && $defined(this._y2)) {
       this._calculateAutoControlPoints(avoidControlPointFix);
 
-      const path = `M${this._x1.toFixed(2)},${this._y1.toFixed()} C${(
-        this._control1.x + this._x1
-      ).toFixed(2)},${this._control1.y + this._y1} ${(this._control2.x + this._x2).toFixed()},${(
-        this._control2.y + this._y2
-      ).toFixed(2)} ${this._x2.toFixed(2)},${this._y2.toFixed()}${this._lineStyle
-        ? ` ${(this._control2.x + this._x2).toFixed()},${(
-          this._control2.y +
-          this._y2 +
-          3
-        ).toFixed(2)} ${(this._control1.x + this._x1).toFixed()},${(
-          this._control1.y +
-          this._y1 +
-          5
-        ).toFixed(2)} ${this._x1.toFixed(2)},${(this._y1 + 7).toFixed(2)} Z`
-        : ''
-        }`;
+      const moveTo = CurvedLinePeer._pointToStr(this._x1, this._y1);
+      const curveP1 = CurvedLinePeer._pointToStr(this._control1.x + this._x1, this._control1.y + this._y1);
+      const curveP2 = CurvedLinePeer._pointToStr(this._control2.x + this._x2, this._control2.y + this._y2);
+      const curveP3 = CurvedLinePeer._pointToStr(this._x2, this._y2);
+      const curveP4 = CurvedLinePeer._pointToStr(this._control2.x + this._x2, this._control2.y + this._y2 + 3);
+      const curveP5 = CurvedLinePeer._pointToStr(this._control1.x + this._x1, this._control1.y + this._y1 + 5);
+      const curveP6 = CurvedLinePeer._pointToStr(this._x1, this._y1 + 7);
+
+      const path = `M${moveTo} C${curveP1} ${curveP2} ${curveP3} ${this._lineStyle ? ` ${curveP4} ${curveP5} ${curveP6} Z` : ''}`;
       this._native.setAttribute('d', path);
     }
   }
 
+  static _pointToStr(x, y) {
+    return `${(x).toFixed(3)},${(y).toFixed(3)} `;
+  }
+
   _updateStyle() {
     let style = '';
     for (const key in this._style) {