diff --git a/packages/blocks/src/surface-block/canvas-renderer/element-renderer/connector/index.ts b/packages/blocks/src/surface-block/canvas-renderer/element-renderer/connector/index.ts
index aa5720054a03..f359148732e0 100644
--- a/packages/blocks/src/surface-block/canvas-renderer/element-renderer/connector/index.ts
+++ b/packages/blocks/src/surface-block/canvas-renderer/element-renderer/connector/index.ts
@@ -59,7 +59,6 @@ function renderPoints(
   curve: boolean
 ) {
   const { seed, stroke, strokeWidth, roughness, rough } = model;
-  const rc = renderer.rc;
   const realStrokeColor = renderer.getVariableColor(stroke);
 
   if (rough) {
@@ -70,51 +69,54 @@ function renderPoints(
       stroke: realStrokeColor,
       strokeWidth,
     };
+
     if (curve) {
       const b = getBezierParameters(model.absolutePath);
-      rc.path(
-        `M${b[0][0]},${b[0][1]} C${b[1][0]},${b[1][1]} ${b[2][0]},${b[2][1]}  ${b[3][0]},${b[3][1]} `,
+      renderer.rc.path(
+        `M${b[0][0]},${b[0][1]} C${b[1][0]},${b[1][1]} ${b[2][0]},${b[2][1]} ${b[3][0]},${b[3][1]}`,
         options
       );
-    } else {
-      rc.linearPath(points as unknown as [number, number][], options);
+      return;
     }
+
+    renderer.rc.linearPath(points as unknown as [number, number][], options);
+    return;
+  }
+
+  ctx.save();
+  ctx.strokeStyle = realStrokeColor;
+  ctx.lineWidth = strokeWidth;
+  ctx.lineJoin = 'round';
+  dash && ctx.setLineDash([12, 12]);
+  ctx.beginPath();
+  if (curve) {
+    points.forEach((point, index) => {
+      if (index === 0) {
+        ctx.moveTo(point[0], point[1]);
+      } else {
+        const last = points[index - 1];
+        ctx.bezierCurveTo(
+          last.absOut[0],
+          last.absOut[1],
+          point.absIn[0],
+          point.absIn[1],
+          point[0],
+          point[1]
+        );
+      }
+    });
   } else {
-    ctx.save();
-    ctx.strokeStyle = realStrokeColor;
-    ctx.lineWidth = model.strokeWidth;
-    ctx.lineJoin = 'round';
-    dash && ctx.setLineDash([12, 12]);
-    ctx.beginPath();
-    if (curve) {
-      points.forEach((point, index) => {
-        if (index === 0) {
-          ctx.moveTo(point[0], point[1]);
-        } else {
-          const last = points[index - 1];
-          ctx.bezierCurveTo(
-            last.absOut[0],
-            last.absOut[1],
-            point.absIn[0],
-            point.absIn[1],
-            point[0],
-            point[1]
-          );
-        }
-      });
-    } else {
-      points.forEach((point, index) => {
-        if (index === 0) {
-          ctx.moveTo(point[0], point[1]);
-        } else {
-          ctx.lineTo(point[0], point[1]);
-        }
-      });
-    }
-    ctx.stroke();
-    ctx.closePath();
-    ctx.restore();
+    points.forEach((point, index) => {
+      if (index === 0) {
+        ctx.moveTo(point[0], point[1]);
+      } else {
+        ctx.lineTo(point[0], point[1]);
+      }
+    });
   }
+  ctx.stroke();
+  ctx.closePath();
+  ctx.restore();
 }
 
 function renderEndpoint(
diff --git a/packages/blocks/src/surface-block/canvas-renderer/element-renderer/shape/diamond.ts b/packages/blocks/src/surface-block/canvas-renderer/element-renderer/shape/diamond.ts
index c233dc2a8df6..b35097f457cc 100644
--- a/packages/blocks/src/surface-block/canvas-renderer/element-renderer/shape/diamond.ts
+++ b/packages/blocks/src/surface-block/canvas-renderer/element-renderer/shape/diamond.ts
@@ -36,23 +36,23 @@ export function diamond(
   );
 
   if (shapeStyle === 'General') {
-    drawGeneralShape(ctx, model, renderer);
-  } else {
-    rc.polygon(
-      [
-        [renderWidth / 2, 0],
-        [renderWidth, renderHeight / 2],
-        [renderWidth / 2, renderHeight],
-        [0, renderHeight / 2],
-      ],
-      {
-        seed,
-        roughness: shapeStyle === 'Scribbled' ? roughness : 0,
-        strokeLineDash: strokeStyle === 'dash' ? [12, 12] : undefined,
-        stroke: strokeStyle === 'none' ? 'none' : realStrokeColor,
-        strokeWidth,
-        fill: filled ? realFillColor : undefined,
-      }
-    );
+    return drawGeneralShape(ctx, model, renderer);
   }
+
+  rc.polygon(
+    [
+      [renderWidth / 2, 0],
+      [renderWidth, renderHeight / 2],
+      [renderWidth / 2, renderHeight],
+      [0, renderHeight / 2],
+    ],
+    {
+      seed,
+      roughness,
+      strokeLineDash: strokeStyle === 'dash' ? [12, 12] : undefined,
+      stroke: strokeStyle === 'none' ? 'none' : realStrokeColor,
+      strokeWidth,
+      fill: filled ? realFillColor : undefined,
+    }
+  );
 }
diff --git a/packages/blocks/src/surface-block/canvas-renderer/element-renderer/shape/ellipse.ts b/packages/blocks/src/surface-block/canvas-renderer/element-renderer/shape/ellipse.ts
index 8c27db30c038..1fe27f67ea39 100644
--- a/packages/blocks/src/surface-block/canvas-renderer/element-renderer/shape/ellipse.ts
+++ b/packages/blocks/src/surface-block/canvas-renderer/element-renderer/shape/ellipse.ts
@@ -36,16 +36,16 @@ export function ellipse(
   );
 
   if (shapeStyle === 'General') {
-    drawGeneralShape(ctx, model, renderer);
-  } else {
-    rc.ellipse(cx, cy, renderWidth, renderHeight, {
-      seed,
-      roughness: shapeStyle === 'Scribbled' ? roughness : 0,
-      strokeLineDash: strokeStyle === 'dash' ? [12, 12] : undefined,
-      stroke: strokeStyle === 'none' ? 'none' : realStrokeColor,
-      strokeWidth,
-      fill: filled ? realFillColor : undefined,
-      curveFitting: 1,
-    });
+    return drawGeneralShape(ctx, model, renderer);
   }
+
+  rc.ellipse(cx, cy, renderWidth, renderHeight, {
+    seed,
+    roughness,
+    strokeLineDash: strokeStyle === 'dash' ? [12, 12] : undefined,
+    stroke: strokeStyle === 'none' ? 'none' : realStrokeColor,
+    strokeWidth,
+    fill: filled ? realFillColor : undefined,
+    curveFitting: 1,
+  });
 }
diff --git a/packages/blocks/src/surface-block/canvas-renderer/element-renderer/shape/rect.ts b/packages/blocks/src/surface-block/canvas-renderer/element-renderer/shape/rect.ts
index caa6fc5c8d08..961e76eb2c28 100644
--- a/packages/blocks/src/surface-block/canvas-renderer/element-renderer/shape/rect.ts
+++ b/packages/blocks/src/surface-block/canvas-renderer/element-renderer/shape/rect.ts
@@ -44,10 +44,11 @@ export function rect(
   );
 
   if (shapeStyle === 'General') {
-    drawGeneralShape(ctx, model, renderer);
-  } else {
-    rc.path(
-      `
+    return drawGeneralShape(ctx, model, renderer);
+  }
+
+  rc.path(
+    `
       M ${r} 0
       L ${renderWidth - r} 0
       C ${renderWidth - K_RECT * r} 0 ${renderWidth} ${
@@ -65,14 +66,13 @@ export function rect(
       C 0 ${K_RECT * r} ${K_RECT * r} 0 ${r} 0
       Z
       `,
-      {
-        seed,
-        roughness: shapeStyle === 'Scribbled' ? roughness : 0,
-        strokeLineDash: strokeStyle === 'dash' ? [12, 12] : undefined,
-        stroke: strokeStyle === 'none' ? 'none' : realStrokeColor,
-        strokeWidth,
-        fill: filled ? realFillColor : undefined,
-      }
-    );
-  }
+    {
+      seed,
+      roughness,
+      strokeLineDash: strokeStyle === 'dash' ? [12, 12] : undefined,
+      stroke: strokeStyle === 'none' ? 'none' : realStrokeColor,
+      strokeWidth,
+      fill: filled ? realFillColor : undefined,
+    }
+  );
 }
diff --git a/packages/blocks/src/surface-block/canvas-renderer/element-renderer/shape/triangle.ts b/packages/blocks/src/surface-block/canvas-renderer/element-renderer/shape/triangle.ts
index ed6d037010a4..1d3868f85644 100644
--- a/packages/blocks/src/surface-block/canvas-renderer/element-renderer/shape/triangle.ts
+++ b/packages/blocks/src/surface-block/canvas-renderer/element-renderer/shape/triangle.ts
@@ -36,22 +36,22 @@ export function triangle(
   );
 
   if (shapeStyle === 'General') {
-    drawGeneralShape(ctx, model, renderer);
-  } else {
-    rc.polygon(
-      [
-        [renderWidth / 2, 0],
-        [renderWidth, renderHeight],
-        [0, renderHeight],
-      ],
-      {
-        seed,
-        roughness: shapeStyle === 'Scribbled' ? roughness : 0,
-        strokeLineDash: strokeStyle === 'dash' ? [12, 12] : undefined,
-        stroke: strokeStyle === 'none' ? 'none' : realStrokeColor,
-        strokeWidth,
-        fill: filled ? realFillColor : undefined,
-      }
-    );
+    return drawGeneralShape(ctx, model, renderer);
   }
+
+  rc.polygon(
+    [
+      [renderWidth / 2, 0],
+      [renderWidth, renderHeight],
+      [0, renderHeight],
+    ],
+    {
+      seed,
+      roughness,
+      strokeLineDash: strokeStyle === 'dash' ? [12, 12] : undefined,
+      stroke: strokeStyle === 'none' ? 'none' : realStrokeColor,
+      strokeWidth,
+      fill: filled ? realFillColor : undefined,
+    }
+  );
 }