chore: gate ohlc behind statsig ff (#1164)

dydxprotocol · Oct 17, 2024 · 002a9a5 · 002a9a5
1 parent 0803b1b
commit 002a9a5
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 20 deletions.
diff --git a/src/constants/statsig.ts b/src/constants/statsig.ts
@@ -13,6 +13,7 @@ export enum StatsigFlags {
   ffLimitOrdersFromChart = 'ff_limit_orders_from_chart',
   ffEnableLimitClose = 'ff_enable_limit_close',
   ffEnableTimestampNonce = 'ff_enable_timestamp_nonce',
+  ffEnableOhlc = 'ff_enable_ohlc',
 }
 
 export type StatsigDynamicConfigType = Record<StatsigDynamicConfigs, any>;

diff --git a/src/hooks/tradingView/useTradingView.ts b/src/hooks/tradingView/useTradingView.ts
@@ -12,6 +12,7 @@ import {
 import { DEFAULT_RESOLUTION } from '@/constants/candles';
 import { TOGGLE_ACTIVE_CLASS_NAME } from '@/constants/charts';
 import { STRING_KEYS, SUPPORTED_LOCALE_BASE_TAGS } from '@/constants/localization';
+import { StatsigFlags } from '@/constants/statsig';
 import { tooltipStrings } from '@/constants/tooltips';
 import type { TvWidget } from '@/constants/tvchart';
 
@@ -25,7 +26,7 @@ import { getTvChartConfig } from '@/state/tradingViewSelectors';
 
 import { getSavedResolution, getWidgetOptions, getWidgetOverrides } from '@/lib/tradingView/utils';
 
-import { useAllStatsigGateValues } from '../useStatsig';
+import { useAllStatsigGateValues, useStatsigGateValue } from '../useStatsig';
 import { useStringGetter } from '../useStringGetter';
 import { useURLConfigs } from '../useURLConfigs';
 import { useTradingViewLimitOrder } from './useTradingViewLimitOrder';
@@ -75,6 +76,7 @@ export const useTradingView = ({
   const selectedNetwork = useAppSelector(getSelectedNetwork);
 
   const savedTvChartConfig = useAppSelector(getTvChartConfig);
+  const ffEnableOrderbookCandles = useStatsigGateValue(StatsigFlags.ffEnableOhlc);
 
   const savedResolution = useMemo(
     () => getSavedResolution({ savedConfig: savedTvChartConfig }),
@@ -149,23 +151,25 @@ export const useTradingView = ({
               }),
             });
 
-            // Orderbook Candles (OHLC)
-            const getOhlcTooltipString = tooltipStrings.ohlc;
-            const { title: ohlcTitle, body: ohlcBody } = getOhlcTooltipString({
-              stringGetter,
-              stringParams: {},
-              urlConfigs,
-              featureFlags,
-            });
-
-            initializeToggle({
-              toggleRef: orderbookCandlesToggleRef,
-              tvWidget: tvWidgetRef.current,
-              isOn: orderbookCandlesToggleOn,
-              setToggleOn: setOrderbookCandlesToggleOn,
-              label: `${ohlcTitle}*`,
-              tooltip: ohlcBody as string,
-            });
+            if (ffEnableOrderbookCandles) {
+              // Orderbook Candles (OHLC)
+              const getOhlcTooltipString = tooltipStrings.ohlc;
+              const { title: ohlcTitle, body: ohlcBody } = getOhlcTooltipString({
+                stringGetter,
+                stringParams: {},
+                urlConfigs,
+                featureFlags,
+              });
+
+              initializeToggle({
+                toggleRef: orderbookCandlesToggleRef,
+                tvWidget: tvWidgetRef.current,
+                isOn: orderbookCandlesToggleOn,
+                setToggleOn: setOrderbookCandlesToggleOn,
+                label: `${ohlcTitle}*`,
+                tooltip: ohlcBody as string,
+              });
+            }
 
             // Buy/Sell Marks
             initializeToggle({

diff --git a/src/hooks/tradingView/useTradingViewToggles.tsx b/src/hooks/tradingView/useTradingViewToggles.tsx
@@ -1,10 +1,16 @@
 import { useState } from 'react';
 
+import { StatsigFlags } from '@/constants/statsig';
+
+import { useStatsigGateValue } from '../useStatsig';
+
 export const useTradingViewToggles = () => {
+  const ffEnableOrderbookCandles = useStatsigGateValue(StatsigFlags.ffEnableOhlc);
   // When the orderbook candles (displayed as OHLC) toggle is on, empty (0 trade) candles in markets will show
   // O(pen) H(igh) L(ow) C(lose) data via orderbook mid-price.
   // Otherwise, candles calculate OHLC data from historical trades.
-  const [orderbookCandlesToggleOn, setOrderbookCandlesToggleOn] = useState(true);
+  const [orderbookCandlesToggleOn, setOrderbookCandlesToggleOn] =
+    useState(ffEnableOrderbookCandles);
   const [orderLinesToggleOn, setOrderLinesToggleOn] = useState(true);
   const [buySellMarksToggleOn, setBuySellMarksToggleOn] = useState(true);
 

diff --git a/src/lib/abacus/websocket.ts b/src/lib/abacus/websocket.ts
@@ -28,7 +28,7 @@ class AbacusWebsocket implements Omit<AbacusWebsocketProtocol, '__doNotUseOrImpl
 
   private isConnecting: boolean = false;
 
-  orderbookCandlesToggleOn: boolean = true;
+  orderbookCandlesToggleOn: boolean = false;
 
   connect(url: string, connected: (p0: boolean) => void, received: (p0: string) => void): void {
     this.url = url;