From 221149c0c6b3e0f1152f212fc665ce2967ead316 Mon Sep 17 00:00:00 2001 From: Kilter Date: Thu, 22 Jun 2023 16:31:09 -0500 Subject: [PATCH 1/4] Fixes field on blocks proposer column --- .../tables/LatestBlocksTable/index.tsx | 7 ++++--- src/components/tables/types.ts | 8 +++++++- src/components/views/LatestBlocksSP.tsx | 18 +++++++++++++++--- src/utils/strings.ts | 4 ++++ 4 files changed, 30 insertions(+), 7 deletions(-) create mode 100644 src/utils/strings.ts diff --git a/src/components/tables/LatestBlocksTable/index.tsx b/src/components/tables/LatestBlocksTable/index.tsx index bf1f8e3..de9cf2d 100644 --- a/src/components/tables/LatestBlocksTable/index.tsx +++ b/src/components/tables/LatestBlocksTable/index.tsx @@ -14,6 +14,7 @@ import { useSearchInput } from '@/hooks/useSearchInput' import { addEthSuffix } from '@/utils/web3' import { toFixedNoTrailingZeros } from '@/utils/decimals' import { getBeaconChainExplorer } from '@/utils/config' +import { shortenEthAddress } from '@/utils/strings' import type { Block } from '../types' const columnHelper = createColumnHelper() @@ -43,10 +44,10 @@ const getColumns = (blackExplorerUrl?: string) => [ return ( - {proposer.toLocaleString()} + {shortenEthAddress(proposer.validatorKey.toLocaleString())} ) }, @@ -96,7 +97,7 @@ export function LatestBlocksTable({ () => data ?.filter((row) => { - const address = row.proposer.toLowerCase() + const address = row.proposer.withdrawalAddress.toLowerCase() const search = debouncedSearchInput.toLowerCase() return ( address.includes(search) && diff --git a/src/components/tables/types.ts b/src/components/tables/types.ts index 74a067d..ae364d7 100644 --- a/src/components/tables/types.ts +++ b/src/components/tables/types.ts @@ -2,12 +2,18 @@ import type { Warnings } from './MyValidatorsTable/components/WarningIcon' export interface Block { slot: number - proposer: `0x${string}` + proposer: Proposer rewardType: 'vanila' | 'mev' | '' reward: number blockType: 'okpoolproposal' | 'missedproposal' | 'wrongfeerecipient' } +interface Proposer { + withdrawalAddress: `0x${string}` + validatorKey: `0x${string}` + validatorIndex: number +} + export interface Validator { address: `0x${string}` pending: number diff --git a/src/components/views/LatestBlocksSP.tsx b/src/components/views/LatestBlocksSP.tsx index 09ca00d..d89d393 100644 --- a/src/components/views/LatestBlocksSP.tsx +++ b/src/components/views/LatestBlocksSP.tsx @@ -16,10 +16,22 @@ export function LatestBlocksSP() { if (data) { blocks = data.map( - ({ slot, withdrawalAddress, rewardType, rewardWei, blockType }) => ({ + ({ + slot, + withdrawalAddress, + validatorKey, + validatorIndex, + rewardType, + rewardWei, + blockType, + }) => ({ blockType, slot, - proposer: withdrawalAddress as `0x${string}`, + proposer: { + withdrawalAddress: withdrawalAddress as `0x${string}`, + validatorKey: validatorKey as `0x${string}`, + validatorIndex: validatorIndex as number, + }, rewardType, reward: weiToEth(rewardWei), }) @@ -29,7 +41,7 @@ export function LatestBlocksSP() { return (
diff --git a/src/utils/strings.ts b/src/utils/strings.ts new file mode 100644 index 0000000..b132937 --- /dev/null +++ b/src/utils/strings.ts @@ -0,0 +1,4 @@ +export const shortenEthAddress = (address: string) => + address + ? `${address.substring(0, 6)}...${address.substring(address.length - 4)}` + : '' From 657884f0edce94484d6fa9b34a1ab7f3373677da Mon Sep 17 00:00:00 2001 From: Kilter Date: Thu, 22 Jun 2023 16:38:49 -0500 Subject: [PATCH 2/4] fixes storybook --- .../LatestBlockTable.stories.ts | 84 ++++++++++++++++--- .../tables/LatestBlocksTable/index.tsx | 2 +- src/utils/strings.ts | 4 - 3 files changed, 73 insertions(+), 17 deletions(-) delete mode 100644 src/utils/strings.ts diff --git a/src/components/tables/LatestBlocksTable/LatestBlockTable.stories.ts b/src/components/tables/LatestBlocksTable/LatestBlockTable.stories.ts index b8e4128..ad9b979 100644 --- a/src/components/tables/LatestBlocksTable/LatestBlockTable.stories.ts +++ b/src/components/tables/LatestBlocksTable/LatestBlockTable.stories.ts @@ -5,84 +5,144 @@ import type { Meta, StoryObj } from '@storybook/react' const data: Block[] = [ { slot: 1, - proposer: '0x00005ea00ac477b1030ce78506496e8c2de24bf5', + proposer: { + withdrawalAddress: '0x00005ea00ac477b1030ce78506496e8c2de24bf5', + validatorKey: + '0xa62c5914723e36eef425e1ada8b42aa24d2b1fd4f3025e5fc814f78212b7edfd3dfc5e09609de0d6a3de28d3a10bc7cb', + validatorIndex: 1, + }, rewardType: 'mev', reward: 0.32, blockType: 'okpoolproposal', }, { slot: 2, - proposer: '0x00005ea00ac477b1030ce78506496e8c2de24bf5', + proposer: { + withdrawalAddress: '0x00005ea00ac477b1030ce78506496e8c2de24bf5', + validatorKey: + '0xa62c5914723e36eef425e1ada8b42aa24d2b1fd4f3025e5fc814f78212b7edfd3dfc5e09609de0d6a3de28d3a10bc7cb', + validatorIndex: 1, + }, rewardType: 'vanila', reward: 2.12, blockType: 'missedproposal', }, { slot: 3, - proposer: '0x7915e43086Cd78Be341Df73726C0947B6334b978', + proposer: { + withdrawalAddress: '0x00005ea00ac477b1030ce78506496e8c2de24bf5', + validatorKey: + '0xa62c5914723e36eef425e1ada8b42aa24d2b1fd4f3025e5fc814f78212b7edfd3dfc5e09609de0d6a3de28d3a10bc7cb', + validatorIndex: 1, + }, rewardType: 'mev', reward: 0.32, blockType: 'wrongfeerecipient', }, { slot: 4, - proposer: '0x00005ea00ac477b1030ce78506496e8c2de24bf5', + proposer: { + withdrawalAddress: '0x00005ea00ac477b1030ce78506496e8c2de24bf5', + validatorKey: + '0xa62c5914723e36eef425e1ada8b42aa24d2b1fd4f3025e5fc814f78212b7edfd3dfc5e09609de0d6a3de28d3a10bc7cb', + validatorIndex: 1, + }, rewardType: 'mev', reward: 0.32, blockType: 'okpoolproposal', }, { slot: 5, - proposer: '0x00005ea00ac477b1030ce78506496e8c2de24bf5', + proposer: { + withdrawalAddress: '0x00005ea00ac477b1030ce78506496e8c2de24bf5', + validatorKey: + '0xa62c5914723e36eef425e1ada8b42aa24d2b1fd4f3025e5fc814f78212b7edfd3dfc5e09609de0d6a3de28d3a10bc7cb', + validatorIndex: 1, + }, rewardType: 'vanila', reward: 2.12, blockType: 'missedproposal', }, { slot: 6, - proposer: '0x7915e43086Cd78Be341Df73726C0947B6334b978', + proposer: { + withdrawalAddress: '0x00005ea00ac477b1030ce78506496e8c2de24bf5', + validatorKey: + '0xa62c5914723e36eef425e1ada8b42aa24d2b1fd4f3025e5fc814f78212b7edfd3dfc5e09609de0d6a3de28d3a10bc7cb', + validatorIndex: 1, + }, rewardType: 'mev', reward: 0.32, blockType: 'wrongfeerecipient', }, { slot: 7, - proposer: '0x00005ea00ac477b1030ce78506496e8c2de24bf5', + proposer: { + withdrawalAddress: '0x00005ea00ac477b1030ce78506496e8c2de24bf5', + validatorKey: + '0xa62c5914723e36eef425e1ada8b42aa24d2b1fd4f3025e5fc814f78212b7edfd3dfc5e09609de0d6a3de28d3a10bc7cb', + validatorIndex: 1, + }, rewardType: 'mev', reward: 0.32, blockType: 'okpoolproposal', }, { slot: 8, - proposer: '0x00005ea00ac477b1030ce78506496e8c2de24bf5', + proposer: { + withdrawalAddress: '0x00005ea00ac477b1030ce78506496e8c2de24bf5', + validatorKey: + '0xa62c5914723e36eef425e1ada8b42aa24d2b1fd4f3025e5fc814f78212b7edfd3dfc5e09609de0d6a3de28d3a10bc7cb', + validatorIndex: 1, + }, rewardType: 'vanila', reward: 2.12, blockType: 'missedproposal', }, { slot: 9, - proposer: '0x7915e43086Cd78Be341Df73726C0947B6334b978', + proposer: { + withdrawalAddress: '0x00005ea00ac477b1030ce78506496e8c2de24bf5', + validatorKey: + '0xa62c5914723e36eef425e1ada8b42aa24d2b1fd4f3025e5fc814f78212b7edfd3dfc5e09609de0d6a3de28d3a10bc7cb', + validatorIndex: 1, + }, rewardType: 'mev', reward: 0.32, blockType: 'wrongfeerecipient', }, { slot: 10, - proposer: '0x00005ea00ac477b1030ce78506496e8c2de24bf5', + proposer: { + withdrawalAddress: '0x00005ea00ac477b1030ce78506496e8c2de24bf5', + validatorKey: + '0xa62c5914723e36eef425e1ada8b42aa24d2b1fd4f3025e5fc814f78212b7edfd3dfc5e09609de0d6a3de28d3a10bc7cb', + validatorIndex: 1, + }, rewardType: 'mev', reward: 0.32, blockType: 'okpoolproposal', }, { slot: 11, - proposer: '0x00005ea00ac477b1030ce78506496e8c2de24bf5', + proposer: { + withdrawalAddress: '0x00005ea00ac477b1030ce78506496e8c2de24bf5', + validatorKey: + '0xa62c5914723e36eef425e1ada8b42aa24d2b1fd4f3025e5fc814f78212b7edfd3dfc5e09609de0d6a3de28d3a10bc7cb', + validatorIndex: 1, + }, rewardType: 'vanila', reward: 2.12, blockType: 'missedproposal', }, { slot: 12, - proposer: '0x7915e43086Cd78Be341Df73726C0947B6334b978', + proposer: { + withdrawalAddress: '0x00005ea00ac477b1030ce78506496e8c2de24bf5', + validatorKey: + '0xa62c5914723e36eef425e1ada8b42aa24d2b1fd4f3025e5fc814f78212b7edfd3dfc5e09609de0d6a3de28d3a10bc7cb', + validatorIndex: 1, + }, rewardType: 'mev', reward: 0.32, blockType: 'wrongfeerecipient', diff --git a/src/components/tables/LatestBlocksTable/index.tsx b/src/components/tables/LatestBlocksTable/index.tsx index de9cf2d..36a1645 100644 --- a/src/components/tables/LatestBlocksTable/index.tsx +++ b/src/components/tables/LatestBlocksTable/index.tsx @@ -14,7 +14,7 @@ import { useSearchInput } from '@/hooks/useSearchInput' import { addEthSuffix } from '@/utils/web3' import { toFixedNoTrailingZeros } from '@/utils/decimals' import { getBeaconChainExplorer } from '@/utils/config' -import { shortenEthAddress } from '@/utils/strings' +import { shortenEthAddress } from '@/utils/web3' import type { Block } from '../types' const columnHelper = createColumnHelper() diff --git a/src/utils/strings.ts b/src/utils/strings.ts deleted file mode 100644 index b132937..0000000 --- a/src/utils/strings.ts +++ /dev/null @@ -1,4 +0,0 @@ -export const shortenEthAddress = (address: string) => - address - ? `${address.substring(0, 6)}...${address.substring(address.length - 4)}` - : '' From 62fab0485cc0eee33ba0e01f5ef538e6172abc22 Mon Sep 17 00:00:00 2001 From: Kilter Date: Thu, 22 Jun 2023 16:42:52 -0500 Subject: [PATCH 3/4] removes duplicates --- src/components/tables/LatestBlocksTable/index.tsx | 3 +-- src/components/views/LatestBlocksSP.tsx | 4 +--- 2 files changed, 2 insertions(+), 5 deletions(-) diff --git a/src/components/tables/LatestBlocksTable/index.tsx b/src/components/tables/LatestBlocksTable/index.tsx index 36a1645..49be375 100644 --- a/src/components/tables/LatestBlocksTable/index.tsx +++ b/src/components/tables/LatestBlocksTable/index.tsx @@ -11,10 +11,9 @@ import { useReactTable, } from '@tanstack/react-table' import { useSearchInput } from '@/hooks/useSearchInput' -import { addEthSuffix } from '@/utils/web3' +import { addEthSuffix, shortenEthAddress } from '@/utils/web3' import { toFixedNoTrailingZeros } from '@/utils/decimals' import { getBeaconChainExplorer } from '@/utils/config' -import { shortenEthAddress } from '@/utils/web3' import type { Block } from '../types' const columnHelper = createColumnHelper() diff --git a/src/components/views/LatestBlocksSP.tsx b/src/components/views/LatestBlocksSP.tsx index d89d393..7b7280a 100644 --- a/src/components/views/LatestBlocksSP.tsx +++ b/src/components/views/LatestBlocksSP.tsx @@ -1,12 +1,10 @@ import { LatestBlocksTable } from '../tables/LatestBlocksTable' import { useQuery } from '@tanstack/react-query' -import { useNetwork } from 'wagmi' import type { Block } from '@/components/tables/types' import { fetchAllBlocks } from '@/client/api/queryFunctions' import { weiToEth } from '@/utils/web3' export function LatestBlocksSP() { - const { chain } = useNetwork() const { data, isLoading } = useQuery({ queryKey: ['latest-blocks'], queryFn: fetchAllBlocks, @@ -41,7 +39,7 @@ export function LatestBlocksSP() { return (
From 6fc2470c0278c54694c01406c0d49f829d243692 Mon Sep 17 00:00:00 2001 From: Kilter Date: Thu, 22 Jun 2023 16:49:25 -0500 Subject: [PATCH 4/4] Update config.ts --- src/components/tables/LatestBlocksTable/config.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/tables/LatestBlocksTable/config.ts b/src/components/tables/LatestBlocksTable/config.ts index 8851e90..b9849b4 100644 --- a/src/components/tables/LatestBlocksTable/config.ts +++ b/src/components/tables/LatestBlocksTable/config.ts @@ -2,7 +2,7 @@ export const PAGE_SIZE = 10 export const headerTooltip = { slot: 'Slot of the block', - proposer: 'Address of the validator', + proposer: 'Key of the validator', rewardType: 'Type of the reward (vanila or mev)', reward: 'Reward of the block', }