- {data.map((data, i) => (
-
- ))}
+ const isContinuousMode =
+ marketTradingMode === Schema.MarketTradingMode.TRADING_MODE_CONTINUOUS;
+ const tableHeader = useMemo(() => {
+ return (
+
+ {isContinuousMode ? (
+
{t('Bid / Ask vol')}
+ ) : (
+ <>
+
{t('Bid vol')}
+
{t('Ask vol')}
+ >
+ )}
+
{t('Price')}
+
+ {t('Cumulative vol')}
+
- ) : null;
+ );
+ }, [isContinuousMode]);
+
+ const OrderBookRowComponent = isContinuousMode
+ ? OrderbookContinuousRow
+ : OrderbookRow;
+
+ const tableBody = data?.length ? (
+
+ {data.map((data, i) => (
+
+ ))}
+
+ ) : null;
const c = theme === 'dark' ? colors.neutral[600] : colors.neutral[300];
- const gradientStyles = `linear-gradient(${c},${c}) 24.6% 0/1px 100% no-repeat, linear-gradient(${c},${c}) 50% 0/1px 100% no-repeat, linear-gradient(${c},${c}) 75.2% 0/1px 100% no-repeat`;
+ const gradientStyles = isContinuousMode
+ ? `linear-gradient(${c},${c}) 33.4% 0/1px 100% no-repeat, linear-gradient(${c},${c}) 66.7% 0/1px 100% no-repeat`
+ : `linear-gradient(${c},${c}) 25% 0/1px 100% no-repeat, linear-gradient(${c},${c}) 50% 0/1px 100% no-repeat, linear-gradient(${c},${c}) 75% 0/1px 100% no-repeat`;
const resolutions = new Array(decimalPlaces + 1)
.fill(null)
@@ -531,21 +574,11 @@ export const Orderbook = ({
/* eslint-disable jsx-a11y/no-static-element-interactions */
return (
setDebug(!debug)}
>
-
-
{t('Bid vol')}
-
{t('Ask vol')}
-
{t('Price')}
-
- {t('Cumulative vol')}
-
-
+ {tableHeader}