🐛 Fix graph flickering on high res displays (#959)

This PR fixes the flickering and improves the performance so panning
around the graph is much smoother than before.



https://github.com/baptisteArno/typebot.io/assets/62795688/56b91e20-1eb0-44b5-9a4a-c07525c2ba48


/claim #575
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

### Summary by CodeRabbit

- Refactor: Improved the Graph component's scaling calculation for
enhanced readability and maintenance.
- Style: Updated the Graph component's style properties to ensure better
compatibility and visual performance on webkit browsers.

These changes aim to enhance the user experience by ensuring the Graph
component displays consistently across different web browsers. The
refactoring of the scaling calculation also makes the code easier to
understand and maintain, potentially leading to quicker updates and bug
fixes in the future.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Baptiste Arnaud <[email protected]>

apps/builder/src/features/graph/components/Graph.tsx

@@ -174,7 +174,9 @@ export const Graph = ({
     let newScale = graphPosition.scale + (delta ?? 0)
     if (scale) {
       const scaleDiff = scale - graphPosition.scale
-      newScale += Math.min(zoomButtonsScaleBlock, Math.abs(scaleDiff)) * Math.sign(scaleDiff)
+      newScale +=
+        Math.min(zoomButtonsScaleBlock, Math.abs(scaleDiff)) *
+        Math.sign(scaleDiff)
     }
 
     if (
@@ -242,6 +244,9 @@ export const Graph = ({
         data-testid="graph"
         style={{
           transform,
+          perspective: 1000,
+          backfaceVisibility: 'hidden',
+          transformStyle: 'preserve-3d',
         }}
         willChange="transform"
         transformOrigin="0px 0px 0px"