LaconicNetwork/dydx-v4-web
6
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Update drawnText color on theme change

Browse Source
This commit is contained in:
jaredvu 2023-11-26 17:31:08 -08:00
parent fad4284ed5
commit a54653242e
No known key found for this signature in database
GPG Key ID: B9FE2F3F0A5D523C
1 changed files with 8 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/hooks/orderbook/useDrawOrderbookHistograms.ts
View File

@ -11,6 +11,7 @@ import { ROW_HEIGHT, ROW_PADDING_RIGHT, type RowData } from '@/views/Orderbook/O
import { MustBigNumber } from '@/lib/numbers';
import { log } from '@/lib/telemetry';
import { Colors } from '@/styles/colors';
export const useDrawOrderbookHistograms = ({
data,
@ -27,7 +28,7 @@ export const useDrawOrderbookHistograms = ({
to?: 'left' | 'right';
hoveredRow?: number;
}) => {
const selectedTheme = useSelector(getAppTheme);
const theme = useSelector(getAppTheme);
const canvasRef = useRef<HTMLCanvasElement>(null);
const hoverCanvasRef = useRef<HTMLCanvasElement>(null);
const canvas = canvasRef.current;
@ -169,10 +170,11 @@ export const useDrawOrderbookHistograms = ({
mine?: Nullable<number>;
}) => {
const y = getYFromIndex(idx, 'text');
const textColor = Colors[theme].text2;
// Size text
if (size) {
ctx.fillStyle = 'white';
ctx.fillStyle = textColor;
ctx.fillText(
MustBigNumber(size).toFormat(stepSizeDecimals ?? TOKEN_DECIMALS, formatOptions),
getXByColumn({ canvasWidth, colIdx: 0 }) - ROW_PADDING_RIGHT,
@ -182,7 +184,7 @@ export const useDrawOrderbookHistograms = ({
// Price text
if (price) {
ctx.fillStyle = 'white';
ctx.fillStyle = textColor;
ctx.fillText(
MustBigNumber(price).toFormat(tickSizeDecimals ?? SMALL_USD_DECIMALS, formatOptions),
getXByColumn({ canvasWidth, colIdx: 1 }) - ROW_PADDING_RIGHT,
@ -192,7 +194,7 @@ export const useDrawOrderbookHistograms = ({
// Mine text
if (mine) {
ctx.fillStyle = 'white';
ctx.fillStyle = textColor;
ctx.fillText(
MustBigNumber(mine).toFormat(stepSizeDecimals ?? TOKEN_DECIMALS, formatOptions),
getXByColumn({ canvasWidth, colIdx: 2 }) - ROW_PADDING_RIGHT,
@ -200,7 +202,7 @@ export const useDrawOrderbookHistograms = ({
);
}
},
[LOCALE_DECIMAL_SEPARATOR]
[theme, LOCALE_DECIMAL_SEPARATOR, tickSizeDecimals, stepSizeDecimals]
);
/**
@ -317,16 +319,7 @@ export const useDrawOrderbookHistograms = ({
mine,
});
});
}, [
canvasWidth,
data,
drawText,
histogramRange,
selectedTheme,
stepSizeDecimals,
tickSizeDecimals,
to,
]);
}, [canvasWidth, data, drawText, histogramRange, stepSizeDecimals, tickSizeDecimals, to]);
return { canvasRef, hoverCanvasRef };
};