fix(market-depth): up to date market data, use fixed number of decimals in cummulative vol

libs/datagrid/src/lib/cells/cumulative-vol-cell.tsx

@@ -1,6 +1,6 @@
 import { memo } from 'react';
 import { BID_COLOR, ASK_COLOR } from './vol-cell';
-import { addDecimalsFormatNumber } from '@vegaprotocol/utils';
+import { addDecimalsFixedFormatNumber } from '@vegaprotocol/utils';
 import { NumericCell } from './numeric-cell';
 
 export interface CumulativeVolProps {
@@ -55,7 +55,7 @@ export const CumulativeVol = memo(
         (
         <NumericCell
           value={Number(indicativeVolume)}
-          valueFormatted={addDecimalsFormatNumber(
+          valueFormatted={addDecimalsFixedFormatNumber(
             indicativeVolume,
             positionDecimalPlaces ?? 0
           )}
@@ -67,7 +67,7 @@ export const CumulativeVol = memo(
         {ask ? (
           <NumericCell
             value={ask}
-            valueFormatted={addDecimalsFormatNumber(
+            valueFormatted={addDecimalsFixedFormatNumber(
               ask,
               positionDecimalPlaces ?? 0
             )}
@@ -77,7 +77,7 @@ export const CumulativeVol = memo(
         {bid ? (
           <NumericCell
             value={ask}
-            valueFormatted={addDecimalsFormatNumber(
+            valueFormatted={addDecimalsFixedFormatNumber(
               bid,
               positionDecimalPlaces ?? 0
             )}

libs/market-depth/src/lib/orderbook-manager.tsx

@@ -48,12 +48,12 @@ export const OrderbookManager = ({ marketId }: OrderbookManagerProps) => {
     throttle(() => {
       dataRef.current = {
         ...marketDataRef.current,
-        indicativePrice: marketDataRef.current?.indicativePrice
-          ? getPriceLevel(
-              marketDataRef.current.indicativePrice,
-              resolutionRef.current
-            )
-          : undefined,
+        indicativePrice:
+          marketDataRef.current?.indicativePrice &&
+          getPriceLevel(
+            marketDataRef.current.indicativePrice,
+            resolutionRef.current
+          ),
         midPrice: getMidPrice(
           rawDataRef.current?.depth.sell,
           rawDataRef.current?.depth.buy,
@@ -148,13 +148,12 @@ export const OrderbookManager = ({ marketId }: OrderbookManagerProps) => {
     variables,
   });
 
-  marketDataRef.current = marketData;
+  if (!marketDataRef.current && marketData) {
+    marketDataRef.current = marketData;
+  }
 
   useEffect(() => {
     const throttleRunner = updateOrderbookData.current;
-    if (!marketDataRef.current) {
-      return;
-    }
     if (!data) {
       dataRef.current = { rows: null };
       setOrderbookData(dataRef.current);
@@ -162,10 +161,9 @@ export const OrderbookManager = ({ marketId }: OrderbookManagerProps) => {
     }
     dataRef.current = {
       ...marketDataRef.current,
-      indicativePrice: getPriceLevel(
-        marketDataRef.current.indicativePrice,
-        resolution
-      ),
+      indicativePrice:
+        marketDataRef.current?.indicativePrice &&
+        getPriceLevel(marketDataRef.current.indicativePrice, resolution),
       midPrice: getMidPrice(data.depth.sell, data.depth.buy, resolution),
       rows: compactRows(data.depth.sell, data.depth.buy, resolution),
     };
@@ -175,7 +173,7 @@ export const OrderbookManager = ({ marketId }: OrderbookManagerProps) => {
     return () => {
       throttleRunner.cancel();
     };
-  }, [data, marketData, resolution]);
+  }, [data, resolution]);
 
   useEffect(() => {
     resolutionRef.current = resolution;