lux/explore
2
0
Fork 0
mirror of https://github.com/luxfi/explore.git synced 2026-09-24 00:28:18 +00:00
Code Issues Packages Projects Releases Wiki Activity

contract icon for all addresses

Browse Source
This commit is contained in:
isstuev
2022-12-29 10:55:51 +03:00
parent f1f32ef8b1
commit 232b32ba7d
24 changed files with 64 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files
types/api/account.ts
+5 -2
View File
@@ -1,6 +1,7 @@
import type { AddressParam } from './addressParams';
export interface AddressTag {
address_hash: string;
address: AddressParam;
name: string;
id: string;
}
@@ -64,7 +65,7 @@ export interface WatchlistAddress {
notification_settings: NotificationSettings;
notification_methods: NotificationMethods;
id: string;
address?: AddressParam;
address: AddressParam;
}
export interface WatchlistTokensResponse {
@@ -89,10 +90,11 @@ export interface PublicTag {
email: string;
company: string;
addresses: Array<string>;
addresses_with_info: Array<AddressParam>;
additional_comment: string;
}
export type PublicTagNew = Omit<PublicTag, 'id'>
export type PublicTagNew = Omit<PublicTag, 'id' | 'addresses_with_info'>
export type PublicTags = Array<PublicTag>;
@@ -102,6 +104,7 @@ export interface CustomAbi {
name: string;
id: number;
contract_address_hash: string;
contract_address: AddressParam;
abi: Array<AbiItem>;
}
ui/address/AddressDetails.tsx
+1 -1
View File
@@ -62,7 +62,7 @@ const AddressDetails = ({ addressQuery }: Props) => {
return (
<Box>
<Flex alignItems="center">
<AddressIcon hash={ addressQuery.data.hash }/>
<AddressIcon address={ addressQuery.data }/>
<Text ml={ 2 } fontFamily="heading" fontWeight={ 500 }>
{ isMobile ? <HashStringShorten hash={ addressQuery.data.hash }/> : addressQuery.data.hash }
</Text>
ui/address/internals/AddressIntTxsListItem.tsx
+2 -2
View File
@@ -53,7 +53,7 @@ const TxInternalsListItem = ({
</HStack>
<Box w="100%" display="flex" columnGap={ 3 }>
<Address width="calc((100% - 48px) / 2)">
<AddressIcon hash={ from.hash }/>
<AddressIcon address={ from }/>
<AddressLink ml={ 2 } fontWeight="500" hash={ from.hash }/>
</Address>
{ (isIn || isOut) ?
@@ -61,7 +61,7 @@ const TxInternalsListItem = ({
<Icon as={ eastArrowIcon } boxSize={ 6 } color="gray.500"/>
}
<Address width="calc((100% - 48px) / 2)">
<AddressIcon hash={ toData.hash }/>
<AddressIcon address={ toData }/>
<AddressLink ml={ 2 } fontWeight="500" hash={ toData.hash }/>
</Address>
</Box>
ui/address/internals/AddressIntTxsTableItem.tsx
+2 -2
View File
@@ -61,7 +61,7 @@ const AddressIntTxsTableItem = ({
</Td>
<Td verticalAlign="middle">
<Address display="inline-flex" maxW="100%">
<AddressIcon hash={ from.hash }/>
<AddressIcon address={ from }/>
<AddressLink ml={ 2 } fontWeight="500" hash={ from.hash } alias={ from.name } flexGrow={ 1 }/>
</Address>
</Td>
@@ -73,7 +73,7 @@ const AddressIntTxsTableItem = ({
</Td>
<Td verticalAlign="middle">
<Address display="inline-flex" maxW="100%">
<AddressIcon hash={ toData.hash }/>
<AddressIcon address={ toData }/>
<AddressLink hash={ toData.hash } alias={ toData.name } fontWeight="500" ml={ 2 }/>
</Address>
</Td>
ui/customAbi/CustomAbiTable/CustomAbiListItem.tsx
+1 -1
View File
@@ -24,7 +24,7 @@ const CustomAbiListItem = ({ item, onEditClick, onDeleteClick }: Props) => {
return (
<ListItemMobile>
<AddressSnippet address={ item.contract_address_hash } subtitle={ item.name } isContract/>
<AddressSnippet address={ item.contract_address } subtitle={ item.name }/>
<TableItemActionButtons onDeleteClick={ onItemDeleteClick } onEditClick={ onItemEditClick }/>
</ListItemMobile>
);
ui/customAbi/CustomAbiTable/CustomAbiTableItem.tsx
+1 -1
View File
@@ -28,7 +28,7 @@ const CustomAbiTableItem = ({ item, onEditClick, onDeleteClick }: Props) => {
return (
<Tr alignItems="top" key={ item.id }>
<Td>
<AddressSnippet address={ item.contract_address_hash } subtitle={ item.name } isContract/>
<AddressSnippet address={ item.contract_address } subtitle={ item.name }/>
</Td>
<Td>
<TableItemActionButtons onDeleteClick={ onItemDeleteClick } onEditClick={ onItemEditClick }/>
ui/home/LatestTxsItem.tsx
+2 -2
View File
@@ -109,7 +109,7 @@ const LatestBlocksItem = ({ tx }: Props) => {
<Box width={{ base: '100%', lg: '50%' }}>
<Flex alignItems="center" mb={ 3 } justifyContent={{ base: 'start', lg: 'end' }}>
<Address>
<AddressIcon hash={ tx.from.hash }/>
<AddressIcon address={ tx.from }/>
<AddressLink
hash={ tx.from.hash }
alias={ tx.from.name }
@@ -126,7 +126,7 @@ const LatestBlocksItem = ({ tx }: Props) => {
color="gray.500"
/>
<Address>
<AddressIcon hash={ dataTo.hash }/>
<AddressIcon address={ dataTo }/>
<AddressLink
hash={ dataTo.hash }
alias={ dataTo.name }
ui/privateTags/AddressTagTable/AddressTagListItem.tsx
+1 -1
View File
@@ -25,7 +25,7 @@ const AddressTagListItem = ({ item, onEditClick, onDeleteClick }: Props) => {
return (
<ListItemMobile>
<Flex alignItems="flex-start" flexDirection="column" maxW="100%">
<AddressSnippet address={ item.address_hash }/>
<AddressSnippet address={ item.address }/>
<HStack spacing={ 3 } mt={ 4 }>
<Text fontSize="sm" fontWeight={ 500 }>Private tag</Text>
<Tag>
ui/privateTags/AddressTagTable/AddressTagTableItem.tsx
+1 -1
View File
@@ -29,7 +29,7 @@ const AddressTagTableItem = ({ item, onEditClick, onDeleteClick }: Props) => {
return (
<Tr alignItems="top" key={ item.id }>
<Td>
<AddressSnippet address={ item.address_hash }/>
<AddressSnippet address={ item.address }/>
</Td>
<Td whiteSpace="nowrap">
<TruncatedTextTooltip label={ item.name }>
ui/publicTags/PublicTagTable/PublicTagListItem.tsx
+1 -1
View File
@@ -27,7 +27,7 @@ const PublicTagListItem = ({ item, onEditClick, onDeleteClick }: Props) => {
<ListItemMobile>
<VStack spacing={ 3 } alignItems="flex-start" maxW="100%">
<VStack spacing={ 4 } alignItems="unset" maxW="100%">
{ item.addresses.map((address) => <AddressSnippet key={ address } address={ address }/>) }
{ item.addresses_with_info.map((address) => <AddressSnippet key={ address.hash } address={ address }/>) }
</VStack>
<HStack spacing={ 3 }>
<Text fontSize="sm" fontWeight={ 500 }>Public tags</Text>
ui/publicTags/PublicTagTable/PublicTagTableItem.tsx
+1 -1
View File
@@ -32,7 +32,7 @@ const PublicTagTableItem = ({ item, onEditClick, onDeleteClick }: Props) => {
<Tr alignItems="top" key={ item.id }>
<Td>
<VStack spacing={ 4 } alignItems="unset">
{ item.addresses.map((address) => <AddressSnippet key={ address } address={ address }/>) }
{ item.addresses_with_info.map((address) => <AddressSnippet key={ address.hash } address={ address }/>) }
</VStack>
</Td>
<Td>
ui/shared/AddressSnippet.tsx
+7 -9
View File
@@ -1,27 +1,25 @@
import { Text, Box } from '@chakra-ui/react';
import React from 'react';
import type { AddressParam } from 'types/api/addressParams';
import Address from 'ui/shared/address/Address';
import AddressIcon from 'ui/shared/address/AddressIcon';
import AddressLink from 'ui/shared/address/AddressLink';
import CopyToClipboard from 'ui/shared/CopyToClipboard';
import AddressContractIcon from './address/AddressContractIcon';
interface Props {
address: string;
address: AddressParam;
subtitle?: string;
// temporary solution for custom abis while we don't have address info on account pages
isContract?: boolean;
}
const AddressSnippet = ({ address, isContract, subtitle }: Props) => {
const AddressSnippet = ({ address, subtitle }: Props) => {
return (
<Box maxW="100%">
<Address>
{ isContract ? <AddressContractIcon/> : <AddressIcon hash={ address }/> }
<AddressLink hash={ address } fontWeight="600" ml={ 2 }/>
<CopyToClipboard text={ address } ml={ 1 }/>
<AddressIcon address={ address }/>
<AddressLink hash={ address.hash } fontWeight="600" ml={ 2 }/>
<CopyToClipboard text={ address.hash } ml={ 1 }/>
</Address>
{ subtitle && <Text fontSize="sm" variant="secondary" mt={ 0.5 } ml={ 8 }>{ subtitle }</Text> }
</Box>
ui/shared/TokenTransfer/TokenTransferListItem.tsx
+2 -2
View File
@@ -80,7 +80,7 @@ const TokenTransferListItem = ({
) }
<Flex w="100%" columnGap={ 3 }>
<Address width={ addressWidth }>
<AddressIcon hash={ from.hash }/>
<AddressIcon address={ from }/>
<AddressLink ml={ 2 } fontWeight="500" hash={ from.hash }/>
</Address>
{ baseAddress ?
@@ -88,7 +88,7 @@ const TokenTransferListItem = ({
<Icon as={ eastArrowIcon } boxSize={ 6 } color="gray.500"/>
}
<Address width={ addressWidth }>
<AddressIcon hash={ to.hash }/>
<AddressIcon address={ to }/>
<AddressLink ml={ 2 } fontWeight="500" hash={ to.hash }/>
</Address>
</Flex>
ui/shared/TokenTransfer/TokenTransferTableItem.tsx
+2 -2
View File
@@ -69,7 +69,7 @@ const TokenTransferTableItem = ({
) }
<Td>
<Address display="inline-flex" maxW="100%" lineHeight="30px">
<AddressIcon hash={ from.hash }/>
<AddressIcon address={ from }/>
<AddressLink ml={ 2 } fontWeight="500" hash={ from.hash } alias={ from.name } flexGrow={ 1 }/>
</Address>
</Td>
@@ -80,7 +80,7 @@ const TokenTransferTableItem = ({
) }
<Td>
<Address display="inline-flex" maxW="100%" lineHeight="30px">
<AddressIcon hash={ to.hash }/>
<AddressIcon address={ to }/>
<AddressLink ml={ 2 } fontWeight="500" hash={ to.hash } alias={ to.name } flexGrow={ 1 }/>
</Address>
</Td>
ui/shared/address/AddressIcon.tsx
+17 -2
View File
@@ -2,10 +2,25 @@ import { Box, chakra } from '@chakra-ui/react';
import React from 'react';
import Jazzicon, { jsNumberForAddress } from 'react-jazzicon';
const AddressIcon = ({ hash, className }: {hash: string; className?: string}) => {
import type { AddressParam } from 'types/api/addressParams';
import AddressContractIcon from 'ui/shared/address/AddressContractIcon';
type Props = {
address: AddressParam;
className?: string;
}
const AddressIcon = ({ address, className }: Props) => {
if (address.is_contract) {
return (
<AddressContractIcon/>
);
}
return (
<Box className={ className } width="24px" display="inline-flex">
<Jazzicon diameter={ 24 } seed={ jsNumberForAddress(hash) }/>
<Jazzicon diameter={ 24 } seed={ jsNumberForAddress(address.hash) }/>
</Box>
);
};
ui/tx/TxDetails.tsx
+2 -2
View File
@@ -147,7 +147,7 @@ const TxDetails = () => {
columnGap={ 3 }
>
<Address>
<AddressIcon hash={ data.from.hash }/>
<AddressIcon address={ data.from }/>
<AddressLink ml={ 2 } hash={ data.from.hash }/>
<CopyToClipboard text={ data.from.hash }/>
</Address>
@@ -166,7 +166,7 @@ const TxDetails = () => {
>
{ data.to && data.to.hash ? (
<Address alignItems="center">
<AddressIcon hash={ toAddress.hash }/>
<AddressIcon address={ toAddress }/>
<AddressLink ml={ 2 } hash={ toAddress.hash }/>
{ executionSuccessBadge }
{ executionFailedBadge }
ui/tx/internals/TxInternalsListItem.tsx
+2 -2
View File
@@ -27,12 +27,12 @@ const TxInternalsListItem = ({ type, from, to, value, success, error, gas_limit:
</Flex>
<Box w="100%" display="flex" columnGap={ 3 }>
<Address width="calc((100% - 48px) / 2)">
<AddressIcon hash={ from.hash }/>
<AddressIcon address={ from }/>
<AddressLink ml={ 2 } fontWeight="500" hash={ from.hash }/>
</Address>
<Icon as={ eastArrowIcon } boxSize={ 6 } color="gray.500"/>
<Address width="calc((100% - 48px) / 2)">
<AddressIcon hash={ toData.hash }/>
<AddressIcon address={ toData }/>
<AddressLink ml={ 2 } fontWeight="500" hash={ toData.hash }/>
</Address>
</Box>
ui/tx/internals/TxInternalsTableItem.tsx
+2 -2
View File
@@ -32,7 +32,7 @@ const TxInternalTableItem = ({ type, from, to, value, success, error, gas_limit:
</Td>
<Td verticalAlign="middle">
<Address display="inline-flex" maxW="100%">
<AddressIcon hash={ from.hash }/>
<AddressIcon address={ from }/>
<AddressLink ml={ 2 } fontWeight="500" hash={ from.hash } alias={ from.name } flexGrow={ 1 }/>
</Address>
</Td>
@@ -41,7 +41,7 @@ const TxInternalTableItem = ({ type, from, to, value, success, error, gas_limit:
</Td>
<Td verticalAlign="middle">
<Address display="inline-flex" maxW="100%">
<AddressIcon hash={ toData.hash }/>
<AddressIcon address={ toData }/>
<AddressLink hash={ toData.hash } alias={ toData.name } fontWeight="500" ml={ 2 }/>
</Address>
</Td>
ui/tx/logs/TxLogItem.tsx
+1 -1
View File
@@ -50,7 +50,7 @@ const TxLogItem = ({ address, index, topics, data, decoded }: Props) => {
<RowHeader>Address</RowHeader>
<GridItem display="flex" alignItems="center">
<Address mr={{ base: 9, lg: 0 }}>
<AddressIcon hash={ address.hash }/>
<AddressIcon address={ address }/>
<AddressLink hash={ address.hash } alias={ address.name } ml={ 2 }/>
</Address>
{ /* api doesn't have find topic feature yet */ }
ui/tx/state/TxStateListItem.tsx
+3 -2
View File
@@ -9,7 +9,7 @@ import type { data } from 'data/txState';
import { nbsp } from 'lib/html-entities';
import getNetworkValidatorTitle from 'lib/networks/getNetworkValidatorTitle';
import Address from 'ui/shared/address/Address';
import AddressIcon from 'ui/shared/address/AddressIcon';
// import AddressIcon from 'ui/shared/address/AddressIcon';
import AddressLink from 'ui/shared/address/AddressLink';
import ListItemMobile from 'ui/shared/ListItemMobile';
@@ -51,7 +51,8 @@ const TxStateListItem = ({ storage, address, miner, after, before, diff }: Props
<AccordionIcon color="blue.600" width="30px"/>
</AccordionButton>
<Address flexGrow={ 1 }>
<AddressIcon hash={ address }/>
{ /* ??? */ }
{ /* <AddressIcon hash={ address }/> */ }
<AddressLink hash={ address } ml={ 2 }/>
</Address>
</Flex>
ui/tx/state/TxStateTableItem.tsx
+3 -2
View File
@@ -18,7 +18,7 @@ import React, { useRef } from 'react';
import type { TTxStateItem } from 'data/txState';
import { nbsp } from 'lib/html-entities';
import Address from 'ui/shared/address/Address';
import AddressIcon from 'ui/shared/address/AddressIcon';
// import AddressIcon from 'ui/shared/address/AddressIcon';
import AddressLink from 'ui/shared/address/AddressLink';
import TxStateStorageItem from './TxStateStorageItem';
@@ -58,7 +58,8 @@ const TxStateTableItem = ({ txStateItem }: { txStateItem: TTxStateItem }) => {
</Td>
<Td border={ 0 }>
<Address height="30px">
<AddressIcon hash={ txStateItem.address }/>
{ /* ??? */ }
{ /* <AddressIcon hash={ txStateItem.address }/> */ }
<AddressLink hash={ txStateItem.address } fontWeight="500" truncation="constant" ml={ 2 }/>
</Address>
</Td>
ui/txs/TxsListItem.tsx
+2 -2
View File
@@ -102,7 +102,7 @@ const TxsListItem = ({ tx, showBlockInfo, currentAddress, enableTimeIncrement }:
) }
<Flex alignItems="center" height={ 6 } mt={ 6 }>
<Address width={ `calc((100%-${ currentAddress ? TAG_WIDTH : ARROW_WIDTH + 8 }px)/2)` }>
<AddressIcon hash={ tx.from.hash }/>
<AddressIcon address={ tx.from }/>
<AddressLink
hash={ tx.from.hash }
alias={ tx.from.name }
@@ -120,7 +120,7 @@ const TxsListItem = ({ tx, showBlockInfo, currentAddress, enableTimeIncrement }:
/>
) }
<Address width="calc((100%-40px)/2)">
<AddressIcon hash={ dataTo.hash }/>
<AddressIcon address={ dataTo }/>
<AddressLink
hash={ dataTo.hash }
alias={ dataTo.name }
ui/txs/TxsTableItem.tsx
+2 -2
View File
@@ -51,7 +51,7 @@ const TxsTableItem = ({ tx, showBlockInfo, currentAddress, enableTimeIncrement }
const addressFrom = (
<Address>
<Tooltip label={ tx.from.implementation_name }>
<Box display="flex"><AddressIcon hash={ tx.from.hash }/></Box>
<Box display="flex"><AddressIcon address={ tx.from }/></Box>
</Tooltip>
<AddressLink hash={ tx.from.hash } alias={ tx.from.name } fontWeight="500" ml={ 2 } truncation="constant"/>
</Address>
@@ -62,7 +62,7 @@ const TxsTableItem = ({ tx, showBlockInfo, currentAddress, enableTimeIncrement }
const addressTo = (
<Address>
<Tooltip label={ dataTo.implementation_name }>
<Box display="flex"><AddressIcon hash={ dataTo.hash }/></Box>
<Box display="flex"><AddressIcon address={ dataTo }/></Box>
</Tooltip>
<AddressLink hash={ dataTo.hash } alias={ dataTo.name } fontWeight="500" ml={ 2 } truncation="constant"/>
</Address>
ui/watchlist/WatchlistTable/WatchListAddressItem.tsx
+1 -1
View File
@@ -16,7 +16,7 @@ const WatchListAddressItem = ({ item }: {item: TWatchlistItem}) => {
return (
<VStack spacing={ 2 } align="stretch" fontWeight={ 500 }>
<AddressSnippet address={ item.address_hash }/>
<AddressSnippet address={ item.address }/>
<Flex fontSize="sm" h={ 6 } pl={ infoItemsPaddingLeft } flexWrap="wrap" alignItems="center" rowGap={ 1 }>
{ appConfig.network.currency.address && (
<TokenLogo