Merge branch 'main' into mulan/ct-997-condense-orderbook-view-to-not-…

…be-scrollable2
dydxprotocol · Jul 24, 2024 · bd4078e · bd4078e
2 parents fef31d4 + 7fb7beb
commit bd4078e
Showing 1 changed file with 10 additions and 23 deletions.
diff --git a/src/hooks/Orderbook/useDrawOrderbook.ts b/src/hooks/Orderbook/useDrawOrderbook.ts
@@ -48,6 +48,8 @@ enum OrderbookRowAnimationType {
   NONE,
 }
 
+const GRADIENT_MULTIPLIER = 1.3;
+
 export type Rekt = { x1: number; x2: number; y1: number; y2: number };
 
 export const useDrawOrderbook = ({
@@ -104,28 +106,26 @@ export const useDrawOrderbook = ({
 
   const drawBars = useCallback(
     ({
-      barType,
       ctx,
-      depthOrSizeValue,
-      gradientMultiplier,
+      value,
+      gradientMultiplier = GRADIENT_MULTIPLIER,
       histogramAccentColor,
       histogramSide: inHistogramSide,
       rekt,
     }: {
-      barType: 'depth' | 'size';
       ctx: CanvasRenderingContext2D;
-      depthOrSizeValue: number;
-      gradientMultiplier: number;
+      value: number;
+      gradientMultiplier?: number;
       histogramAccentColor: string;
       histogramSide: 'left' | 'right';
       rekt: Rekt;
     }) => {
       const { x1, x2, y1, y2 } = rekt;
 
       // X values
-      const maxHistogramBarWidth = x2 - x1 - (barType === 'size' ? 8 : 2);
-      const barWidth = depthOrSizeValue
-        ? Math.min((depthOrSizeValue / histogramRange) * maxHistogramBarWidth, maxHistogramBarWidth)
+      const maxHistogramBarWidth = x2 - x1 - 2;
+      const barWidth = value
+        ? Math.min((value / histogramRange) * maxHistogramBarWidth, maxHistogramBarWidth)
         : 0;
 
       const { gradient, bar } = getHistogramXValues({
@@ -318,27 +318,14 @@ export const useDrawOrderbook = ({
       // Depth Bar
       if (depth) {
         drawBars({
-          barType: 'depth',
           ctx,
-          depthOrSizeValue: depth,
-          gradientMultiplier: 1.3,
+          value: depth,
           histogramAccentColor,
           histogramSide,
           rekt,
         });
       }
 
-      // Size Bar
-      drawBars({
-        barType: 'size',
-        ctx,
-        depthOrSizeValue: size,
-        gradientMultiplier: 5,
-        histogramAccentColor,
-        histogramSide,
-        rekt,
-      });
-
       if (mine && mine > 0) {
         drawMineCircle({ ctx, rekt });
       }