Kieran/snort
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: formatting

Browse Source
This commit is contained in:
Kieran
2024-01-26 11:18:06 +00:00
parent 7a6637a86f
commit d3e6ddc64c
8 changed files with 80 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

112
packages/app/src/Pages/wallet/price-chart.tsx
View File

@ -4,31 +4,36 @@ import { Line, LineChart, ResponsiveContainer, Tooltip, XAxis, YAxis } from "rec
import { useRateHistory } from "@/Hooks/useRates";
export default function PriceChart({ interval, range }: { interval: number, range: number }) {
export default function PriceChart({ interval, range }: { interval: number; range: number }) {
const history = useRateHistory("BTCUSD", range, true);
const reduced = useMemo(() => {
let min = Number.MAX_SAFE_INTEGER, max = 0;
let minAsk = Number.MAX_SAFE_INTEGER, maxAsk = 0;
const ret = history.reduce((acc, v) => {
const key = v.time - (v.time % interval);
acc[key] ??= { time: key, ask: 0, bid: 0 };
acc[key].ask = v.ask;
acc[key].bid = v.bid;
if (key < min) {
min = key
}
if (key > max) {
max = key;
}
if (v.ask > maxAsk) {
maxAsk = v.ask;
}
if (v.ask < minAsk) {
minAsk = v.ask;
}
return acc;
}, {} as Record<string, { time: number, ask: number | null, bid: number | null }>);
let min = Number.MAX_SAFE_INTEGER,
max = 0;
let minAsk = Number.MAX_SAFE_INTEGER,
maxAsk = 0;
const ret = history.reduce(
(acc, v) => {
const key = v.time - (v.time % interval);
acc[key] ??= { time: key, ask: 0, bid: 0 };
acc[key].ask = v.ask;
acc[key].bid = v.bid;
if (key < min) {
min = key;
}
if (key > max) {
max = key;
}
if (v.ask > maxAsk) {
maxAsk = v.ask;
}
if (v.ask < minAsk) {
minAsk = v.ask;
}
return acc;
},
{} as Record<string, { time: number; ask: number | null; bid: number | null }>,
);
for (let x = min; x < max; x += interval) {
ret[x] ??= { time: x, ask: null, bid: null };
@ -37,38 +42,37 @@ export default function PriceChart({ interval, range }: { interval: number, rang
}, [history, interval]);
const lastRate = useMemo(() => {
return history.reduce((acc, v) => {
if (acc.time < v.time) {
acc = v;
}
return acc;
}, { time: 0, ask: 0, bid: 0 } as { time: number, ask: number, bid: number })
return history.reduce(
(acc, v) => {
if (acc.time < v.time) {
acc = v;
}
return acc;
},
{ time: 0, ask: 0, bid: 0 } as { time: number; ask: number; bid: number },
);
}, [history]);
return <>
<h3 className="text-right">
<FormattedNumber value={lastRate.ask} style="currency" currency="USD" />
</h3>
<ResponsiveContainer height={250}>
<LineChart data={Object.values(reduced.data)}>
<XAxis
dataKey="time"
type="number"
scale="time"
domain={["dataMin", "dataMax"]}
hide={true}
/>
<YAxis
dataKey="ask"
type="number"
scale="auto"
domain={["dataMin - 100", "dataMax + 100"]}
tickFormatter={v => Number(v).toLocaleString()}
hide={true}
/>
<Tooltip content={() => ""} />
<Line dataKey="ask" type="monotone" dot={false} connectNulls={false} stroke="var(--primary-bg)" />
</LineChart>
</ResponsiveContainer>
</>;
return (
<>
<h3 className="text-right">
<FormattedNumber value={lastRate.ask} style="currency" currency="USD" />
</h3>
<ResponsiveContainer height={250}>
<LineChart data={Object.values(reduced.data)}>
<XAxis dataKey="time" type="number" scale="time" domain={["dataMin", "dataMax"]} hide={true} />
<YAxis
dataKey="ask"
type="number"
scale="auto"
domain={["dataMin - 100", "dataMax + 100"]}
tickFormatter={v => Number(v).toLocaleString()}
hide={true}
/>
<Tooltip content={() => ""} />
<Line dataKey="ask" type="monotone" dot={false} connectNulls={false} stroke="var(--primary-bg)" />
</LineChart>
</ResponsiveContainer>
</>
);
}