From f2d445467efc154fd90e4f101fd30dc7b7c1b88c Mon Sep 17 00:00:00 2001 From: readme-bot Date: Wed, 6 Dec 2023 00:23:37 +0300 Subject: [PATCH 1/3] fix refresh issue --- src/components/coin-analytics.tsx | 9 ++++----- src/middlelayers/charts.ts | 9 +++++---- 2 files changed, 9 insertions(+), 9 deletions(-) diff --git a/src/components/coin-analytics.tsx b/src/components/coin-analytics.tsx index 8810a96..be0c310 100644 --- a/src/components/coin-analytics.tsx +++ b/src/components/coin-analytics.tsx @@ -121,7 +121,7 @@ const App = ({ const profit = useMemo( () => calculateProfit(breakevenPrice), - [breakevenPrice] + [breakevenPrice, symbol] ); const costPrice = useMemo(() => calculateCostPrice(actions), [actions]); @@ -154,10 +154,9 @@ const App = ({ const profitRate = useMemo( () => - ( - ((latestPrice - breakevenPrice) / (breakevenPrice || 0.0000000000001)) * - 100 - ).toFixed(2), + breakevenPrice === 0 + ? "∞" + : (((latestPrice - breakevenPrice) / breakevenPrice) * 100).toFixed(2), [breakevenPrice, latestPrice] ); diff --git a/src/middlelayers/charts.ts b/src/middlelayers/charts.ts index e78a70c..cddb971 100644 --- a/src/middlelayers/charts.ts +++ b/src/middlelayers/charts.ts @@ -397,9 +397,9 @@ export async function queryLastRefreshAt(): Promise { return timestampToDate(new Date(assets[0][0].createdAt).getTime(), true) } -function getCoins(assets: AssetModel[][]): string[] { +function getCoins(assets: AssetModel[][], size = 10): string[] { // only take top 10 coins in each item - return _(assets).map(as => _(as).sortBy('value').reverse().take(10).value()).flatten().map(a => a.symbol).uniq().value() + return _(assets).map(as => _(as).sortBy('value').reverse().take(size > 0 ? size : _(as).size()).value()).flatten().map(a => a.symbol).uniq().value() } export async function queryAssetChange(size = 10): Promise { @@ -450,7 +450,7 @@ export async function queryLatestAssetsPercentage(): Promise { - const querySize = size * 2 + const querySize = size const assets = groupAssetModelsListBySymbol(await queryAssets(querySize) || []) if (!assets) { @@ -459,7 +459,8 @@ export async function queryCoinsAmountChange(size = 10): Promise Date: Wed, 6 Dec 2023 00:28:17 +0300 Subject: [PATCH 2/3] add pagination for history --- src/components/coin-analytics.tsx | 135 +++++++++++++++++++----------- 1 file changed, 87 insertions(+), 48 deletions(-) diff --git a/src/components/coin-analytics.tsx b/src/components/coin-analytics.tsx index be0c310..a6c0a4f 100644 --- a/src/components/coin-analytics.tsx +++ b/src/components/coin-analytics.tsx @@ -31,7 +31,11 @@ import { import { getImageApiPath } from "@/utils/app"; import { WalletAnalyzer } from "@/middlelayers/wallet"; import { timestampToDate } from "@/utils/date"; -import { Pencil2Icon } from "@radix-ui/react-icons"; +import { + ChevronLeftIcon, + ChevronRightIcon, + Pencil2Icon, +} from "@radix-ui/react-icons"; import { Input } from "./ui/input"; import { Dialog, @@ -64,6 +68,10 @@ const App = ({ }) => { const { symbol } = useParams() as { symbol: string }; const navigate = useNavigate(); + const pageSize = 20; + + const [dataPage, setDataPage] = useState(0); + const [maxDataPage, setMaxDataPage] = useState(0); const [actions, setActions] = useState([]); const [latestAsset, setLatestAsset] = useState(); @@ -103,6 +111,12 @@ const App = ({ }); setWalletAliasMap(wam); }); + + // update max page + // - 0.000000000001 is for float number precision + const mp = Math.floor(actions.length / pageSize - 0.000000000001); + // set max data page + setMaxDataPage(mp >= 0 ? mp : 0); }, [actions]); const breakevenPrice = useMemo( @@ -430,6 +444,27 @@ const App = ({ +
+ +
+ {dataPage + 1} {"/"} {maxDataPage + 1} +
+ +
@@ -440,57 +475,61 @@ const App = ({ - {actions.map((act, i) => ( - - -
-
- {act.amount > 0 ? "+" : "-"} - {/* use pretty price to avoid amount is supper small */} - {prettyPriceNumberToLocaleString( - Math.abs(act.amount) - )} -
-
- - -
-
-
{currency.symbol}
-
+ {actions + .slice(dataPage * pageSize, (dataPage + 1) * pageSize) + .map((act, i) => ( + + +
+
+ {act.amount > 0 ? "+" : "-"} + {/* use pretty price to avoid amount is supper small */} {prettyPriceNumberToLocaleString( - currencyWrapper(currency)(act.price) + Math.abs(act.amount) )}
- { - setUpdatePriceIndex(i); - setUpdatePriceValue(act.price); - setUpdatePriceDialogOpen(true); - }} - /> -
- - -
- {timestampToDate( - new Date(act.changedAt).getTime(), - true - )} -
- - -
- {act.wallet ? walletAliasMap[act.wallet] || "" : ""} -
- - - ))} + + +
+
+
+ {currency.symbol} +
+
+ {prettyPriceNumberToLocaleString( + currencyWrapper(currency)(act.price) + )} +
+
+ { + setUpdatePriceIndex(i); + setUpdatePriceValue(act.price); + setUpdatePriceDialogOpen(true); + }} + /> +
+ + +
+ {timestampToDate( + new Date(act.changedAt).getTime(), + true + )} +
+ + +
+ {act.wallet ? walletAliasMap[act.wallet] || "" : ""} +
+ + + ))}
From 83fa6165ecd938e5e40d094e9147fb7a3b476f91 Mon Sep 17 00:00:00 2001 From: readme-bot Date: Wed, 6 Dec 2023 00:30:05 +0300 Subject: [PATCH 3/3] tweak --- src/components/coin-analytics.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/coin-analytics.tsx b/src/components/coin-analytics.tsx index a6c0a4f..18d381f 100644 --- a/src/components/coin-analytics.tsx +++ b/src/components/coin-analytics.tsx @@ -284,7 +284,6 @@ const App = ({
- {/* TODO: quick switch coin */} Symbol -
+