Generate charts with data filtered by selected currency (#1602)

* Generate charts with data filtered by selected currency

Pre-commit changes

* Bugfix: refresh chart when USD is selected
This commit is contained in:
Flávio De Melo 2024-11-24 08:55:23 +01:00 committed by GitHub
parent 5fe89e26f9
commit be80cc12a4
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -55,14 +55,14 @@ const DepthChart: React.FC<DepthChartProps> = ({
const [rangeSteps, setRangeSteps] = useState<number>(8);
const [xRange, setXRange] = useState<number>(8);
const [xType, setXType] = useState<string>('premium');
const [currencyCode, setCurrencyCode] = useState<number>(1);
const [currencyCode, setCurrencyCode] = useState<number>(0);
const [center, setCenter] = useState<number>();
const height = maxHeight < 10 ? 10 : maxHeight;
const width = maxWidth < 10 ? 10 : maxWidth > 72.8 ? 72.8 : maxWidth;
useEffect(() => {
setCurrencyCode(fav.currency === 0 ? 1 : fav.currency);
setCurrencyCode(fav.currency); // as selected in BookControl
}, [fav.currency]);
useEffect(() => {
@ -74,7 +74,7 @@ const DepthChart: React.FC<DepthChartProps> = ({
const originalPrice =
(limits[order.currency]?.price ?? 0) * (1 + parseFloat(order.premium) / 100);
const currencyPrice =
(limits[currencyCode]?.price ?? 0) * (1 + parseFloat(order.premium) / 100);
(limits[currencyCode || 1]?.price ?? 0) * (1 + parseFloat(order.premium) / 100);
const originalAmount =
order.has_range && order.max_amount
@ -124,10 +124,22 @@ const DepthChart: React.FC<DepthChartProps> = ({
const generateSeries: () => void = () => {
const sortedOrders: PublicOrder[] =
xType === 'base_price'
? enrichedOrders.sort(
(order1, order2) => (order1?.base_price ?? 0) - (order2?.base_price ?? 0),
)
: enrichedOrders.sort((order1, order2) => order1?.premium - order2?.premium);
? enrichedOrders
.filter(
(order: PublicOrder | null) => currencyCode === 0 || order?.currency == currencyCode,
)
.sort(
(order1: PublicOrder | null, order2: PublicOrder | null) =>
(order1?.base_price ?? 0) - (order2?.base_price ?? 0),
)
: enrichedOrders
.filter(
(order: PublicOrder | null) => currencyCode === 0 || order?.currency == currencyCode,
)
.sort(
(order1: PublicOrder | null, order2: PublicOrder | null) =>
order1?.premium - order2?.premium,
);
const sortedBuyOrders: PublicOrder[] = sortedOrders
.filter((order) => order?.type === 0)
@ -317,7 +329,7 @@ const DepthChart: React.FC<DepthChartProps> = ({
<Grid item>
<Box justifyContent='center'>
{xType === 'base_price'
? `${center} ${String(currencyDict[currencyCode])}`
? `${center} ${String(currencyDict[(currencyCode || 1) as keyof object])}`
: `${String(center.toPrecision(3))}%`}
</Box>
</Grid>