From e29fde0daab778fa4d6ad344f4bd8994d60ea0b8 Mon Sep 17 00:00:00 2001 From: Poafs1 Date: Tue, 19 Mar 2024 17:20:26 +0700 Subject: [PATCH 1/6] refactor(components): bonded token change add link to transactions tab --- .../bonded-token-changes/VotingPowerChart.tsx | 83 ++++++++++++++----- .../components/validator-overview/index.tsx | 1 + 2 files changed, 64 insertions(+), 20 deletions(-) diff --git a/src/lib/pages/validator-details/components/bonded-token-changes/VotingPowerChart.tsx b/src/lib/pages/validator-details/components/bonded-token-changes/VotingPowerChart.tsx index 69f785ca9..37ade764f 100644 --- a/src/lib/pages/validator-details/components/bonded-token-changes/VotingPowerChart.tsx +++ b/src/lib/pages/validator-details/components/bonded-token-changes/VotingPowerChart.tsx @@ -2,7 +2,9 @@ import { Box, Flex, Heading, Text } from "@chakra-ui/react"; import type { BigSource } from "big.js"; import type { ScriptableContext, TooltipModel } from "chart.js"; +import { useInternalNavigate } from "lib/app-provider"; import { LineChart } from "lib/components/chart/LineChart"; +import { CustomIcon } from "lib/components/icon"; import { Loading } from "lib/components/Loading"; import { ErrorFetching } from "lib/components/state"; import { useValidatorHistoricalPowers } from "lib/services/validatorService"; @@ -17,13 +19,17 @@ interface VotingPowerChartProps { validatorAddress: ValidatorAddr; singleStakingDenom: Option; assetInfos: Option; + isOverview?: boolean; } export const VotingPowerChart = ({ validatorAddress, singleStakingDenom, assetInfos, + isOverview, }: VotingPowerChartProps) => { + const navigate = useInternalNavigate(); + const { data: historicalPowers, isLoading } = useValidatorHistoricalPowers(validatorAddress); @@ -115,27 +121,64 @@ export const VotingPowerChart = ({ rounded={8} w="100%" > - - - {singleStakingDenom - ? "Current Bonded Token" - : "Current Voting Powers"} - - - {currentPrice} {currency} - - - = 0 ? "success.main" : "error.main"} + + + + {singleStakingDenom + ? "Current Bonded Token" + : "Current Voting Powers"} + + + {currentPrice} {currency} + + + = 0 ? "success.main" : "error.main"} + > + {diffInLast24Hr >= 0 + ? `+${handleFormatValue(diffInLast24Hr)}` + : `-${handleFormatValue(-diffInLast24Hr)}`} + {" "} + {currency} in last 24 hr + + + {isOverview && ( + p": { color: "secondary.light" }, + }} + onClick={() => + navigate({ + pathname: "/validators/[validatorAddress]/[tab]", + query: { + validatorAddress, + tab: "bonded-token-changes", + }, + options: { shallow: true }, + }) + } > - {diffInLast24Hr >= 0 - ? `+${handleFormatValue(diffInLast24Hr)}` - : `-${handleFormatValue(-diffInLast24Hr)}`} - {" "} - {currency} in last 24 hr - + + See all related transactions + + + + )} )} From 468a0479603d04498f79ece2d2e27bc0118d2f43 Mon Sep 17 00:00:00 2001 From: Poafs1 Date: Tue, 19 Mar 2024 17:24:09 +0700 Subject: [PATCH 2/6] feat: update changelog --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index e8f6fa427..cef685c5e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -39,6 +39,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Features +- [#833](https://github.com/alleslabs/celatone-frontend/pull/833) Add link to transactions page to current bonded token component - [#832](https://github.com/alleslabs/celatone-frontend/pull/832) Add bonded token changes delegation related transactions - [#831](https://github.com/alleslabs/celatone-frontend/pull/831) Update zod schema to apply with new validator delegation related txs api spec - [#828](https://github.com/alleslabs/celatone-frontend/pull/828) Add validator detail voting power overview section with data from APIs From c8c2ada71d57123759ca58365a33e21bbd58ecbc Mon Sep 17 00:00:00 2001 From: Poafs1 Date: Wed, 20 Mar 2024 13:43:47 +0700 Subject: [PATCH 3/6] feat(components): change button to ghost variant --- .../bonded-token-changes/VotingPowerChart.tsx | 52 +++++++------------ 1 file changed, 20 insertions(+), 32 deletions(-) diff --git a/src/lib/pages/validator-details/components/bonded-token-changes/VotingPowerChart.tsx b/src/lib/pages/validator-details/components/bonded-token-changes/VotingPowerChart.tsx index 37ade764f..17b360740 100644 --- a/src/lib/pages/validator-details/components/bonded-token-changes/VotingPowerChart.tsx +++ b/src/lib/pages/validator-details/components/bonded-token-changes/VotingPowerChart.tsx @@ -1,4 +1,4 @@ -import { Box, Flex, Heading, Text } from "@chakra-ui/react"; +import { Box, Button, Flex, Heading, Text } from "@chakra-ui/react"; import type { BigSource } from "big.js"; import type { ScriptableContext, TooltipModel } from "chart.js"; @@ -145,39 +145,27 @@ export const VotingPowerChart = ({ {isOverview && ( - p": { color: "secondary.light" }, - }} - onClick={() => - navigate({ - pathname: "/validators/[validatorAddress]/[tab]", - query: { - validatorAddress, - tab: "bonded-token-changes", - }, - options: { shallow: true }, - }) - } - > - + + )} From 184e8f0b0c3335006bbb745b1327f0455a4d4788 Mon Sep 17 00:00:00 2001 From: Poafs1 Date: Wed, 20 Mar 2024 14:06:27 +0700 Subject: [PATCH 4/6] feat(components): use button size md instead of sm --- .../components/bonded-token-changes/VotingPowerChart.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/lib/pages/validator-details/components/bonded-token-changes/VotingPowerChart.tsx b/src/lib/pages/validator-details/components/bonded-token-changes/VotingPowerChart.tsx index 17b360740..dc571cbbe 100644 --- a/src/lib/pages/validator-details/components/bonded-token-changes/VotingPowerChart.tsx +++ b/src/lib/pages/validator-details/components/bonded-token-changes/VotingPowerChart.tsx @@ -148,8 +148,8 @@ export const VotingPowerChart = ({ - + )} From 32231dcb25e42ec30edc1c938e1a00cabb604283 Mon Sep 17 00:00:00 2001 From: Poafs1 Date: Thu, 21 Mar 2024 11:05:25 +0700 Subject: [PATCH 6/6] feat(components): fix pr comments --- .../components/bonded-token-changes/VotingPowerChart.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/lib/pages/validator-details/components/bonded-token-changes/VotingPowerChart.tsx b/src/lib/pages/validator-details/components/bonded-token-changes/VotingPowerChart.tsx index a4c0db6db..ab4beeb3c 100644 --- a/src/lib/pages/validator-details/components/bonded-token-changes/VotingPowerChart.tsx +++ b/src/lib/pages/validator-details/components/bonded-token-changes/VotingPowerChart.tsx @@ -2,6 +2,7 @@ import { Box, Button, Flex, Heading, Text } from "@chakra-ui/react"; import type { BigSource } from "big.js"; import type { ScriptableContext, TooltipModel } from "chart.js"; +import { TabIndex } from "../../types"; import { useInternalNavigate } from "lib/app-provider"; import { LineChart } from "lib/components/chart/LineChart"; import { CustomIcon } from "lib/components/icon"; @@ -155,7 +156,7 @@ export const VotingPowerChart = ({ pathname: "/validators/[validatorAddress]/[tab]", query: { validatorAddress, - tab: "bonded-token-changes", + tab: TabIndex.BondedTokenChanges, }, options: { shallow: true }, })