feat: add token detail - part1

AstraProtocol · Oct 13, 2022 · 8f44faa · 8f44faa
1 parent fd807d1
commit 8f44faa
Show file tree

Hide file tree

Showing 25 changed files with 1,011 additions and 189 deletions.
diff --git a/api/api_list.ts b/api/api_list.ts
@@ -34,7 +34,11 @@ const API_LIST = {
 	ADDRESS_COIN_BALANCE_HISTORY_CHART: 'evm_/address', // address, page, offset=?
 	ADDRESS_TRANSACTION: 'http://128.199.238.171:8080/api/v1/accounts',
 	ADDRESS_INTERNAL_TRANSACTION: 'evm_/api/v1?module=account&action=txlistinternal', // address, page, offset
-	ADDRESS_TOKEN_TRANSFER: 'evm_/api/v1?module=account&action=tokentx' // address=?
+	ADDRESS_TOKEN_TRANSFER: 'evm_/api/v1?module=account&action=tokentx', // address=?
+
+	TOKEN_DETAIL: '',
+	TOKEN_TRANSACTIONS: '',
+	TOKEN_HOLDERS: 'evm_/api/v1?module=token&action=getTokenHolders' // contractaddress=0x60baCCdfdCa114f97F32121f6b2879fB555Df4d0&page=1&offset=20
 }
 
 export default API_LIST
diff --git a/components/Button/QrButton.tsx b/components/Button/QrButton.tsx
@@ -25,7 +25,7 @@ const QrButton = ({ textTitle, textClasses, content, classes }: Props) => {
 	return (
 		<a onClick={onShowQr} className={clsx('link block-hor-center contrast-color-100')}>
 			{textTitle && <span className={clsx(styles.text, textClasses)}>{textTitle}</span>}
-			<span className={clsx('padding-left-xs pointer qr-icon contrast-color-100')} />
+			<span className={clsx('padding-left-xs pointer qrcode-icon contrast-color-100')} />
 		</a>
 	)
 }

diff --git a/pages/accounts.tsx b/pages/accounts.tsx
@@ -40,8 +40,8 @@ const AstraHolderPage: React.FC<NextPage> = _ => {
 					<RowLoader row={10} />
 				) : (
 					<div className="padding-bottom-sm">
-						{accounts?.map((item: AstraHolder, index: number) => {
-							return <HolderRow key={index} index={index + 1} account={item} />
+						{accounts?.map((item: Holder, index: number) => {
+							return <HolderRow key={item.address} index={index + 1} account={item} />
 						})}
 					</div>
 				)}

diff --git a/pages/token/[token].tsx b/pages/token/[token].tsx
@@ -2,7 +2,9 @@ import { Breadcumbs } from '@astraprotocol/astra-ui'
 import Container from 'components/Container'
 import Head from 'next/head'
 import React from 'react'
-import { LinkMaker } from 'utils/helper'
+import { ellipseBetweenText, LinkMaker } from 'utils/helper'
+import TokenDetailTab from 'views/tokens/TokenDetailTabs'
+import TokenOverview from 'views/tokens/TokenOverview'
 import Layout from '../../components/Layout'
 
 type Props = {
@@ -21,7 +23,11 @@ const TokenDetailPage: React.FC<Props> = props => {
 				</title>
 			</Head>
 			<Container>
-				<Breadcumbs items={[{ label: 'Address', link: LinkMaker.token() }, { label: '' }]} />
+				<Breadcumbs
+					items={[{ label: 'Address', link: LinkMaker.token() }, { label: ellipseBetweenText(token) }]}
+				/>
+				<TokenOverview token={token} />
+				<TokenDetailTab token={token} />
 			</Container>
 		</Layout>
 	)

diff --git a/pages/tokens.tsx b/pages/tokens.tsx
@@ -43,7 +43,7 @@ const AllTokensPage: React.FC<NextPage> = _ => {
 				) : (
 					<div className="padding-bottom-sm">
 						{tokens?.map((item: Token, index: number) => {
-							return <TokenRow key={`${index}`} index={index + 1} token={item} />
+							return <TokenRow key={item.contractAddressHash} index={index + 1} token={item} />
 						})}
 						{/* <Pagination currentPage={currentPage} onChange={onPaginationChange} total={pagination.total} /> */}
 					</div>

diff --git a/project.d.ts b/project.d.ts
@@ -149,171 +149,3 @@ interface Proposer {
 	powerPercentage: string
 	cumulativePowerPercentage: string
 }
-
-interface Token {
-	cataloged?: boolean
-	contractAddressHash: string
-	decimals: string
-	holderCount?: number
-	name: string
-	symbol: string
-	totalSupply: string
-	type: string
-}
-
-interface AstraHolder {
-	address: string
-	balance: string
-	txnCount: number
-}
-
-interface TokenTransfer {
-	value: string
-	blockHash: string
-	blockNumber: string
-	confirmations: string
-	contractAddress: string
-	cumulativeGasUsed: string
-	from: string
-	gas: string
-	gasPrice: string
-	gasUsed: string
-	hash: string
-	input: string
-	logIndex: string
-	nonce: string
-	timeStamp: string
-	to: string
-	tokenDecimal: string
-	tokenName: string
-	tokenSymbol: string
-	transactionIndex: string
-}
-
-interface AddressToken {
-	balance: string
-	contractAddress: string
-	decimals: string
-	name: string
-	symbol: string
-	type: string
-}
-
-interface AddressCoinBalanceHistory {
-	addressHash: string
-	blockNumber: number
-	blockTimestamp: string
-	delta: string
-	insertedAt: string
-	transactionHash: string
-	transactionValue: string
-	updatedAt: string
-	value: string
-	valueFetchedAt: string
-}
-
-interface AddressCoinBalanceHistoryChartData {
-	date: string
-	value: number
-}
-
-interface UseTokenHookData {
-	result: Token[]
-	hasNextPage: boolean
-}
-
-interface UseAstraHolderData {
-	result: AstraHolder[]
-	hasNextPage: boolean
-}
-
-interface UseAddressTransactionData {
-	result: any[]
-	pagination: Pagination
-}
-
-interface UseAddressTokenTransferData {
-	result: TokenTransfer[]
-	hasNextPage: boolean
-}
-
-interface UseAddressTokenData {
-	result: AddressToken[]
-	hasNextPage: boolean
-}
-
-interface UseAddressInternalTransactionData {
-	result: TransactionRowProps[] | []
-	hasNextPage: boolean
-}
-
-interface UseAddressBalanceData {
-	balance: string
-	lastBalanceUpdate: number
-}
-
-interface AddressCounterData {
-	gasUsageCount?: number
-	tokenTransferCount?: number
-	transactionCount?: number
-	validationCount?: number
-}
-
-interface UseAddressCoinBalanceHistoryData {
-	result: AddressCoinBalanceHistory[] | []
-	hasNextPage: boolean
-}
-
-interface UseAddressCoinBalanceHistoryChartData {
-	result: AddressCoinBalanceHistoryChartData[] | []
-}
-
-interface TokenResponse {
-	hasNextPage: boolean
-	result: Token[]
-}
-
-interface TopAstraHolderResponse {
-	hasNextPage: boolean
-	nextPageParams: {
-		offset: number
-		page: number
-	}
-	result: AstraHolder[]
-}
-
-interface AddressCounterResponse {
-	message: string
-	result: AddressCounterData
-	status: string
-}
-
-interface AddressBalanceResponse {
-	message: string
-	result: UseAddressBalanceData
-	status: string
-}
-
-interface AddressTokenTransferResponse {
-	message: string
-	result: TokenTransfer[]
-	status: string
-}
-
-interface AddressTokenResponse {
-	hasNextPage: boolean
-	nextPageParams: any
-	result: AddressToken[]
-}
-
-interface AddressInternalTransactionResponse {
-	message: string
-	result: InternalTransactionItem[]
-	status: string
-}
-
-interface AddressCoinBalanceHistoryResponse {
-	hasNextPage: boolean
-	nextPageParams: any
-	result: AddressCoinBalanceHistory[]
-}
diff --git a/types/address.d.ts b/types/address.d.ts
@@ -3,3 +3,137 @@ interface AbiResponse {
 	result: string
 	status: string
 }
+
+interface AddressCounterResponse {
+	message: string
+	result: AddressCounterData
+	status: string
+}
+
+interface AddressBalanceResponse {
+	message: string
+	result: UseAddressBalanceData
+	status: string
+}
+
+interface AddressTokenTransferResponse {
+	message: string
+	result: TokenTransfer[]
+	status: string
+}
+
+interface AddressTokenResponse {
+	hasNextPage: boolean
+	nextPageParams: any
+	result: AddressToken[]
+}
+
+interface AddressInternalTransactionResponse {
+	message: string
+	result: InternalTransactionItem[]
+	status: string
+}
+
+interface AddressCoinBalanceHistoryResponse {
+	hasNextPage: boolean
+	nextPageParams: any
+	result: AddressCoinBalanceHistory[]
+}
+
+interface AddressTransactionResponse {
+	result: AddressTransactionData[]
+	pagination: Pagination
+}
+
+interface UseAstraHolderData {
+	result: Holder[]
+	hasNextPage: boolean
+}
+
+interface UseAddressTransactionData {
+	result: AddressTransactionData[]
+	pagination: Pagination
+}
+
+interface UseAddressTokenTransferData {
+	result: TokenTransfer[]
+	hasNextPage: boolean
+}
+
+interface UseAddressTokenData {
+	result: AddressToken[]
+	hasNextPage: boolean
+}
+
+interface UseAddressInternalTransactionData {
+	result: TransactionRowProps[] | []
+	hasNextPage: boolean
+}
+
+interface UseAddressBalanceData {
+	balance: string
+	lastBalanceUpdate: number
+}
+
+interface UseAddressCoinBalanceHistoryData {
+	result: AddressCoinBalanceHistory[] | []
+	hasNextPage: boolean
+}
+
+interface UseAddressCoinBalanceHistoryChartData {
+	result: AddressCoinBalanceHistoryChartData[] | []
+}
+
+interface AddressToken {
+	balance: string
+	contractAddress: string
+	decimals: string
+	name: string
+	symbol: string
+	type: string
+}
+
+interface AddressCoinBalanceHistory {
+	addressHash: string
+	blockNumber: number
+	blockTimestamp: string
+	delta: string
+	insertedAt: string
+	transactionHash: string
+	transactionValue: string
+	updatedAt: string
+	value: string
+	valueFetchedAt: string
+}
+
+interface AddressCoinBalanceHistoryChartData {
+	date: string
+	value: number
+}
+
+interface AddressCounterData {
+	gasUsageCount?: number
+	tokenTransferCount?: number
+	transactionCount?: number
+	validationCount?: number
+}
+
+interface AddressTransactionData {
+	account: string
+	blockHeight: number
+	blockHash: string
+	blockTime: string
+	hash: string
+	messageTypes: string[]
+	success: boolean
+	code: number
+	log: string
+	fee: TokenAmount[]
+	feePayer: string
+	feeGranter: string
+	gasWanted: number
+	gasUsed: number
+	memo: string
+	timeoutHeight: number
+	messages: Message
+}