ci(release): publish latest release

RELEASE

@@ -1,6 +1,6 @@
 IPFS hash of the deployment:
-- CIDv0: `Qmbi7qUw2KPYEeiRDwq1p9QFH7aNAbCfL6JT7qVeF6PUum`
-- CIDv1: `bafybeiggu7gmcacpa2plvge7vi5dv6quztwe52x7e7edrnnv35xgzipxqa`
+- CIDv0: `Qme3taNpEsZnMw9J6veC7Zy2mC3qpe7otuikyy6AN9j4ED`
+- CIDv1: `bafybeihjn7f5lga2wsadipjb5bi7vuwcqnlpltcr54enkvhak2lr6hbmli`
 
 The latest release is always mirrored at [app.uniswap.org](https://app.uniswap.org).
 
@@ -10,10 +10,15 @@ You can also access the Uniswap Interface from an IPFS gateway.
 Your Uniswap settings are never remembered across different URLs.
 
 IPFS gateways:
-- https://bafybeiggu7gmcacpa2plvge7vi5dv6quztwe52x7e7edrnnv35xgzipxqa.ipfs.dweb.link/
-- https://bafybeiggu7gmcacpa2plvge7vi5dv6quztwe52x7e7edrnnv35xgzipxqa.ipfs.cf-ipfs.com/
-- [ipfs://Qmbi7qUw2KPYEeiRDwq1p9QFH7aNAbCfL6JT7qVeF6PUum/](ipfs://Qmbi7qUw2KPYEeiRDwq1p9QFH7aNAbCfL6JT7qVeF6PUum/)
+- https://bafybeihjn7f5lga2wsadipjb5bi7vuwcqnlpltcr54enkvhak2lr6hbmli.ipfs.dweb.link/
+- https://bafybeihjn7f5lga2wsadipjb5bi7vuwcqnlpltcr54enkvhak2lr6hbmli.ipfs.cf-ipfs.com/
+- [ipfs://Qme3taNpEsZnMw9J6veC7Zy2mC3qpe7otuikyy6AN9j4ED/](ipfs://Qme3taNpEsZnMw9J6veC7Zy2mC3qpe7otuikyy6AN9j4ED/)
 
-### 5.59.1 (2024-11-20)
+### 5.59.2 (2024-11-21)
+
+
+### Bug Fixes
+
+* **web:** round rect bug prod (#13972) 8ff327e
 
 

VERSION

@@ -1 +1 @@
-web/5.59.1
+web/5.59.2

apps/web/src/components/Charts/LiquidityChart/renderer.tsx

@@ -1,4 +1,5 @@
 import { ColumnPosition, calculateColumnPositionsInPlace, positionsBox } from 'components/Charts/VolumeChart/utils'
+import { roundRect } from 'components/Charts/utils'
 import { BitmapCoordinatesRenderingScope, CanvasRenderingTarget2D } from 'fancy-canvas'
 import {
   CustomData,
@@ -109,9 +110,7 @@ export class LiquidityBarSeriesRenderer<TData extends LiquidityBarData> implemen
 
         // Draw background highlight bar
         ctx.fillStyle = this._options.highlightColor
-        ctx.beginPath()
-        ctx.roundRect(column.left + margin, highlightOffset, widthWithMargin, highlightLength, 8)
-        ctx.fill()
+        roundRect(ctx, column.left + margin, highlightOffset, widthWithMargin, highlightLength, 8)
 
         ctx.globalAlpha = 1
       } else {
@@ -131,9 +130,7 @@ export class LiquidityBarSeriesRenderer<TData extends LiquidityBarData> implemen
       }
 
       // Draw bar
-      ctx.beginPath()
-      ctx.roundRect(column.left + margin, totalBox.position, widthWithMargin, totalBox.length, 8)
-      ctx.fill()
+      roundRect(ctx, column.left + margin, totalBox.position, widthWithMargin, totalBox.length, 8)
 
       // Reset opacity
       ctx.globalAlpha = 1

apps/web/src/components/Charts/PriceChart/RoundedCandlestickSeries/renderer.ts

@@ -4,6 +4,7 @@
 import { RoundedCandleSeriesOptions } from 'components/Charts/PriceChart/RoundedCandlestickSeries/rounded-candles-series'
 import { positionsLine } from 'components/Charts/VolumeChart/CrosshairHighlightPrimitive'
 import { positionsBox } from 'components/Charts/VolumeChart/utils'
+import { roundRect } from 'components/Charts/utils'
 import { BitmapCoordinatesRenderingScope, CanvasRenderingTarget2D } from 'fancy-canvas'
 import {
   CandlestickData,
@@ -123,20 +124,14 @@ export class RoundedCandleSeriesRenderer<TData extends CandlestickData<UTCTimest
 
       ctx.fillStyle = bar.isUp ? this._options.upColor : this._options.downColor
 
-      // roundRect might need to polyfilled for older browsers
-      if (ctx.roundRect) {
-        ctx.beginPath()
-        ctx.roundRect(
-          linePositions.position,
-          verticalPositions.position,
-          linePositions.length,
-          Math.max(verticalPositions.length, 1),
-          radius,
-        )
-        ctx.fill()
-      } else {
-        ctx.fillRect(linePositions.position, verticalPositions.position, linePositions.length, verticalPositions.length)
-      }
+      roundRect(
+        ctx,
+        linePositions.position,
+        verticalPositions.position,
+        linePositions.length,
+        Math.max(verticalPositions.length, 1),
+        radius,
+      )
     }
   }
 }

apps/web/src/components/Charts/VolumeChart/CrosshairHighlightPrimitive.tsx

@@ -2,6 +2,7 @@
  * Copied from https://github.com/tradingview/lightweight-charts/blob/master/plugin-examples/src/plugins/highlight-bar-crosshair/highlight-bar-crosshair.ts.
  * Modifications are called out with comments.
  */
+import { roundRect } from 'components/Charts/utils'
 import { CanvasRenderingTarget2D } from 'fancy-canvas'
 import {
   CrosshairMode,
@@ -83,7 +84,6 @@ class CrosshairHighlightPaneRenderer implements ISeriesPrimitivePaneRenderer {
       const crosshairXPosition = crosshairPos.position + margin
 
       // Modification: use centered 2px wide line to top
-      ctx.beginPath()
       if (this._data.useThinCrosshair) {
         ctx.fillRect(
           crosshairXPosition + crosshairPos.length / 2,
@@ -92,14 +92,14 @@ class CrosshairHighlightPaneRenderer implements ISeriesPrimitivePaneRenderer {
           scope.bitmapSize.height - crosshairYPosition,
         )
       } else {
-        ctx.roundRect(
+        roundRect(
+          ctx,
           crosshairXPosition,
           crosshairYPosition,
           crosshairPos.length,
           scope.bitmapSize.height - crosshairYPosition,
           9,
         )
-        ctx.fill()
       }
 
       // Modification: lower opacity of all content outside the highlight bar

apps/web/src/components/Charts/VolumeChart/renderer.tsx

@@ -8,6 +8,7 @@ import {
   isStackedHistogramData,
   positionsBox,
 } from 'components/Charts/VolumeChart/utils'
+import { roundRect } from 'components/Charts/utils'
 import { BitmapCoordinatesRenderingScope, CanvasRenderingTarget2D } from 'fancy-canvas'
 import {
   CustomData,
@@ -129,14 +130,12 @@ export class CustomHistogramSeriesRenderer<TData extends CustomHistogramData> im
 
       // Modification: draw rounded rect corresponding to total volume
       const totalBox = positionsBox(zeroY, stack.ys[stack.ys.length - 1], renderingScope.verticalPixelRatio)
-      ctx.beginPath()
 
       if (this._background) {
         ctx.fillStyle = this._background
       }
 
-      ctx.roundRect(column.left + margin, totalBox.position, width - margin, totalBox.length, 4)
-      ctx.fill()
+      roundRect(ctx, column.left + margin, totalBox.position, width - margin, totalBox.length, 4)
 
       // Modification: draw the stack's boxes atop the total volume bar, resulting in the top and bottom boxes being rounded
       ctx.globalCompositeOperation = 'source-atop'

apps/web/src/components/Charts/utils.tsx

@@ -43,3 +43,21 @@ export function formatTickMarks(time: UTCTimestamp, tickMarkType: TickMarkType,
       return date.toLocaleString(locale, { hour: 'numeric', minute: 'numeric', second: '2-digit' })
   }
 }
+
+export function roundRect(
+  ctx: CanvasRenderingContext2D,
+  x: number,
+  y: number,
+  w: number,
+  h: number,
+  radii?: number | DOMPointInit | Iterable<number | DOMPointInit> | undefined,
+): void {
+  // roundRect might need to polyfilled for older browsers
+  if (ctx.roundRect) {
+    ctx.beginPath()
+    ctx.roundRect(x, y, w, h, radii)
+    ctx.fill()
+  } else {
+    ctx.fillRect(x, y, w, h)
+  }
+}