fix: update navbar + fee units + add proposer name

AstraProtocol · Oct 19, 2022 · 2947669 · 2947669
1 parent 990e1d6
commit 2947669
Show file tree

Hide file tree

Showing 7 changed files with 64 additions and 44 deletions.
diff --git a/components/Navbar/index.tsx b/components/Navbar/index.tsx
@@ -14,39 +14,41 @@ export const items: MenuItem[] = [
 	{
 		id: '1',
 		label: 'Blocks',
-		submenus: [
-			{
-				id: '1.1',
-				label: 'Blocks',
-				link: '/blocks'
-			},
-			{
-				id: '1.2',
-				label: 'Uncle',
-				link: '/uncle'
-			},
-			{
-				id: '1.3',
-				label: 'Forked Blocks (Reorgs)',
-				link: '/reorgs'
-			}
-		]
+		link: '/blocks'
+		// submenus: [
+		// 	{
+		// 		id: '1.1',
+		// 		label: 'Blocks',
+		// 		link: '/blocks'
+		// 	},
+		// 	{
+		// 		id: '1.2',
+		// 		label: 'Uncle',
+		// 		link: '/uncle'
+		// 	},
+		// 	{
+		// 		id: '1.3',
+		// 		label: 'Forked Blocks (Reorgs)',
+		// 		link: '/reorgs'
+		// 	}
+		// ]
 	},
 	{
 		id: '2',
 		label: 'Transactions',
-		submenus: [
-			{
-				id: '2.1',
-				label: 'Validated',
-				link: '/tx'
-			},
-			{
-				id: '2.2',
-				label: 'Pending',
-				link: '/pending'
-			}
-		]
+		link: '/tx'
+		// submenus: [
+		// 	{
+		// 		id: '2.1',
+		// 		label: 'Validated',
+		// 		link: '/tx'
+		// 	},
+		// 	{
+		// 		id: '2.2',
+		// 		label: 'Pending',
+		// 		link: '/pending'
+		// 	}
+		// ]
 	},
 	{
 		id: '3',

diff --git a/pages/blocks/[block].tsx b/pages/blocks/[block].tsx
@@ -128,7 +128,7 @@ const BlockDetailPage: React.FC<Props> = ({ blockDetail, blockHeight, transactio
 														blockNumber={item.blockHeight}
 														updatedAt={item.blockTime}
 														fee={fee.amount}
-														feeToken={fee.denom}
+														feeToken={'asa'}
 														status={item.success}
 														hash={item.hash}
 														from={''}

diff --git a/pages/tx/index.tsx b/pages/tx/index.tsx
@@ -78,7 +78,7 @@ const BlockDetailPage: React.FC<NextPage> = _ => {
 										blockNumber={item.blockHeight}
 										updatedAt={item.blockTime}
 										fee={fee.amount}
-										feeToken={fee.denom}
+										feeToken={'asa'}
 										status={item.success}
 										hash={item.hash}
 										from={''}

diff --git a/utils/address.ts b/utils/address.ts
@@ -1,3 +1,4 @@
+import { ethToAstra } from '@astradefi/address-converter'
 import { sha256 } from '@cosmjs/crypto'
 import { fromBase64, fromBech32, fromHex, toHex } from '@cosmjs/encoding'
 import RIPEMD160 from 'ripemd160'
@@ -38,6 +39,17 @@ export function getStakingValidatorByHex(hex): Proposer | string {
 	return hex
 }
 
+export function getStakingValidatorByAstraAddress(astraAddress: string): Proposer {
+	const locals = localStorage.getItem(`validators`)
+	if (locals && locals !== 'undefined') {
+		const val = JSON.parse(locals).find((x: Proposer) => x.initialDelegatorAddress === ethToAstra(astraAddress))
+		if (val) {
+			return val as Proposer
+		}
+	}
+	return null
+}
+
 export function abbr(string, length = 6, suffix = '...'): string {
 	if (string && string.length > length) {
 		return `${string.substring(0, length)}${suffix}`

diff --git a/utils/cosmos.ts b/utils/cosmos.ts
@@ -17,7 +17,7 @@ export const getTransactionType = (type: TransacionTypeEnum) => type?.split('.')
  * @returns TokenAmount
  */
 export const caculateCosmosAmount = (amounts: TokenAmount[]): TokenAmount => {
-	if (!amounts) {
+	if (!amounts || amounts.length == 0) {
 		return { amount: undefined, denom: undefined }
 	}
 	let totalAmount = BigNumber.from('0')

diff --git a/views/block/BlockRow.tsx b/views/block/BlockRow.tsx
@@ -5,7 +5,8 @@ import DotSpace from 'components/DotSpace'
 import Timer from 'components/Timer'
 import Typography from 'components/Typography'
 import Image from 'next/image'
-import { ellipseRightText, LinkMaker } from 'utils/helper'
+import { getStakingValidatorByAstraAddress } from 'utils/address'
+import { ellipseBetweenText, LinkMaker } from 'utils/helper'
 import styles from './style.module.scss'
 
 type BlockRowProps = {
@@ -39,6 +40,11 @@ export default function BlockRow({
 }: BlockRowProps) {
 	const { isMobile } = useMobileLayout('medium')
 	const { isMobile: isSmallDevice } = useMobileLayout('small')
+	const proposer = getStakingValidatorByAstraAddress(proposerAddress)
+	const proposerName = proposer?.moniker
+	const proposerDisplay = proposerName
+		? `${proposerName} (${ellipseBetweenText(proposerAddress, 10, 10)})`
+		: proposerAddress
 	return (
 		<RowShowAnimation action={newBlock}>
 			<div
@@ -54,14 +60,15 @@ export default function BlockRow({
 			>
 				<div className={clsx(styles.iconCetner, 'margin-right-sm md-flex-justify-space-between')}>
 					<div className="block-ver-center">
-						<Image src={'/images/icons/blockchain.png'} height={24} width={24} />
+						<Image alt="nothing" src={'/images/icons/blockchain.png'} height={24} width={24} />
 						{isMobile && (
 							<div className="col-2 block-ver-center md-padding-left-xs">
 								<Typography.LinkText
 									href={LinkMaker.block(blockNumber)}
-									children={`#${blockNumber}`}
 									classes={clsx('money', 'money-sm')}
-								/>
+								>
+									{`#${blockNumber}`}
+								</Typography.LinkText>
 							</div>
 						)}
 					</div>
@@ -73,11 +80,9 @@ export default function BlockRow({
 				</div>
 				{!isMobile && (
 					<div className="col-2 block-ver-center">
-						<Typography.LinkText
-							href={LinkMaker.block(blockNumber)}
-							children={`#${blockNumber}`}
-							classes={clsx('money', 'money-sm')}
-						/>
+						<Typography.LinkText href={LinkMaker.block(blockNumber)} classes={clsx('money', 'money-sm')}>
+							{`#${blockNumber}`}
+						</Typography.LinkText>
 					</div>
 				)}
 				<div
@@ -86,9 +91,10 @@ export default function BlockRow({
 					<div>
 						<Typography.LinkText
 							href={LinkMaker.address(proposerAddress)}
-							children={isSmallDevice ? ellipseRightText(proposerAddress, 20) : proposerAddress}
 							classes={clsx('money', 'money-sm')}
-						/>
+						>
+							{proposerDisplay}
+						</Typography.LinkText>
 					</div>
 					<div className={clsx('block-ver-center', styles.info)}>
 						<div className="block-ver-center">

diff --git a/views/transactions/utils.ts b/views/transactions/utils.ts
@@ -221,7 +221,7 @@ export const cosmsTransactionDetail = async (result: TransactionItem): Promise<T
 	// data.tokenTransfer = []
 	// data.value = undefined
 	data.fee = formatEther(fee.amount)
-	data.feeToken = fee.denom
+	data.feeToken = 'asa'
 	// data.gasPrice = undefined
 	// data.gasLimit = result.gasLimit
 	data.gasUsed = `${result.gasUsed}`