adding new point creates tangent handle lines + snapping handle tangents not working

1 files changed, 10 insertions, 2 deletions

diff --git a/src/client/views/InkControls.tsx b/src/client/views/InkControls.tsx
index 4d8b2c6b5..da7b0df16 100644
--- a/src/client/views/InkControls.tsx
+++ b/src/client/views/InkControls.tsx
@@ -30,12 +30,18 @@ export class InkControls extends React.Component<InkControlProps> {
             InkStrokeProperties.Instance.moveControl(0, 0, 1);
             const controlUndo = UndoManager.StartBatch("DocDecs set radius");
             const screenScale = this.props.ScreenToLocalTransform().Scale;
+            const order = controlIndex % 4;
+            const handleIndexA  = order === 2 ? controlIndex - 1 : controlIndex - 2;
+            const handleIndexB = order === 2 ? controlIndex + 2 : controlIndex + 1;
             setupMoveUpEvents(this, e,
                 (e: PointerEvent, down: number[], delta: number[]) => {
                     InkStrokeProperties.Instance?.moveControl(-delta[0] * screenScale, -delta[1] * screenScale, controlIndex);
                     return false;
                 },
-                () => controlUndo?.end(), emptyFunction);
+                () => controlUndo?.end(), action((e: PointerEvent, doubleTap: boolean | undefined) =>
+                { if (doubleTap && InkStrokeProperties.Instance?._brokenIndices.includes(controlIndex)) {
+                    InkStrokeProperties.Instance?.snapHandleTangent(controlIndex, handleIndexA, handleIndexB);
+                }}));
         }
     }
 
@@ -112,7 +118,9 @@ export class InkControls extends React.Component<InkControlProps> {
                             width={this._overControl === i ? strokeWidth * 1.5 : strokeWidth} 
                             strokeWidth={strokeWidth / 6} stroke="#1F85DE" 
                             fill={formatInstance?._currentPoint === control.I ? "#1F85DE" : "white"}
-                            onPointerDown={(e) => { this.changeCurrPoint(control.I); this.onControlDown(e, control.I); }} 
+                            onPointerDown={(e) => { 
+                                this.changeCurrPoint(control.I); 
+                                this.onControlDown(e, control.I); }} 
                             onMouseEnter={() => this.onEnterControl(i)} 
                             onMouseLeave={this.onLeaveControl} 
                             pointerEvents="all"