disable current address link
|
Before Width: | Height: | Size: 44 KiB After Width: | Height: | Size: 46 KiB |
|
Before Width: | Height: | Size: 43 KiB After Width: | Height: | Size: 46 KiB |
|
Before Width: | Height: | Size: 44 KiB After Width: | Height: | Size: 44 KiB |
|
Before Width: | Height: | Size: 43 KiB After Width: | Height: | Size: 45 KiB |
|
Before Width: | Height: | Size: 49 KiB After Width: | Height: | Size: 51 KiB |
@@ -54,7 +54,7 @@ const TxInternalsListItem = ({
|
||||
<Box w="100%" display="flex" columnGap={ 3 }>
|
||||
<Address width="calc((100% - 48px) / 2)">
|
||||
<AddressIcon address={ from }/>
|
||||
<AddressLink ml={ 2 } fontWeight="500" hash={ from.hash }/>
|
||||
<AddressLink ml={ 2 } fontWeight="500" hash={ from.hash } isDisabled={ isOut }/>
|
||||
</Address>
|
||||
{ (isIn || isOut) ?
|
||||
<InOutTag isIn={ isIn } isOut={ isOut }/> :
|
||||
@@ -62,7 +62,7 @@ const TxInternalsListItem = ({
|
||||
}
|
||||
<Address width="calc((100% - 48px) / 2)">
|
||||
<AddressIcon address={ toData }/>
|
||||
<AddressLink ml={ 2 } fontWeight="500" hash={ toData.hash }/>
|
||||
<AddressLink ml={ 2 } fontWeight="500" hash={ toData.hash } isDisabled={ isIn }/>
|
||||
</Address>
|
||||
</Box>
|
||||
<HStack spacing={ 3 }>
|
||||
|
||||
@@ -62,7 +62,7 @@ const AddressIntTxsTableItem = ({
|
||||
<Td verticalAlign="middle">
|
||||
<Address display="inline-flex" maxW="100%">
|
||||
<AddressIcon address={ from }/>
|
||||
<AddressLink ml={ 2 } fontWeight="500" hash={ from.hash } alias={ from.name } flexGrow={ 1 }/>
|
||||
<AddressLink ml={ 2 } fontWeight="500" hash={ from.hash } alias={ from.name } flexGrow={ 1 } isDisabled={ isOut }/>
|
||||
</Address>
|
||||
</Td>
|
||||
<Td px={ 0 } verticalAlign="middle">
|
||||
@@ -74,7 +74,7 @@ const AddressIntTxsTableItem = ({
|
||||
<Td verticalAlign="middle">
|
||||
<Address display="inline-flex" maxW="100%">
|
||||
<AddressIcon address={ toData }/>
|
||||
<AddressLink hash={ toData.hash } alias={ toData.name } fontWeight="500" ml={ 2 }/>
|
||||
<AddressLink hash={ toData.hash } alias={ toData.name } fontWeight="500" ml={ 2 } isDisabled={ isIn }/>
|
||||
</Address>
|
||||
</Td>
|
||||
<Td isNumeric verticalAlign="middle">
|
||||
|
||||
@@ -81,7 +81,7 @@ const TokenTransferListItem = ({
|
||||
<Flex w="100%" columnGap={ 3 }>
|
||||
<Address width={ addressWidth }>
|
||||
<AddressIcon address={ from }/>
|
||||
<AddressLink ml={ 2 } fontWeight="500" hash={ from.hash }/>
|
||||
<AddressLink ml={ 2 } fontWeight="500" hash={ from.hash } isDisabled={ baseAddress === from.hash }/>
|
||||
</Address>
|
||||
{ baseAddress ?
|
||||
<InOutTag isIn={ baseAddress === to.hash } isOut={ baseAddress === from.hash } w="50px" textAlign="center"/> :
|
||||
@@ -89,7 +89,7 @@ const TokenTransferListItem = ({
|
||||
}
|
||||
<Address width={ addressWidth }>
|
||||
<AddressIcon address={ to }/>
|
||||
<AddressLink ml={ 2 } fontWeight="500" hash={ to.hash }/>
|
||||
<AddressLink ml={ 2 } fontWeight="500" hash={ to.hash } isDisabled={ baseAddress === to.hash }/>
|
||||
</Address>
|
||||
</Flex>
|
||||
{ value && (
|
||||
|
||||
@@ -70,7 +70,7 @@ const TokenTransferTableItem = ({
|
||||
<Td>
|
||||
<Address display="inline-flex" maxW="100%" lineHeight="30px">
|
||||
<AddressIcon address={ from }/>
|
||||
<AddressLink ml={ 2 } fontWeight="500" hash={ from.hash } alias={ from.name } flexGrow={ 1 }/>
|
||||
<AddressLink ml={ 2 } fontWeight="500" hash={ from.hash } alias={ from.name } flexGrow={ 1 } isDisabled={ baseAddress === from.hash }/>
|
||||
</Address>
|
||||
</Td>
|
||||
{ baseAddress && (
|
||||
@@ -81,7 +81,7 @@ const TokenTransferTableItem = ({
|
||||
<Td>
|
||||
<Address display="inline-flex" maxW="100%" lineHeight="30px">
|
||||
<AddressIcon address={ to }/>
|
||||
<AddressLink ml={ 2 } fontWeight="500" hash={ to.hash } alias={ to.name } flexGrow={ 1 }/>
|
||||
<AddressLink ml={ 2 } fontWeight="500" hash={ to.hash } alias={ to.name } flexGrow={ 1 } isDisabled={ baseAddress === to.hash }/>
|
||||
</Address>
|
||||
</Td>
|
||||
<Td isNumeric verticalAlign="top" lineHeight="30px">
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { Box, chakra } from '@chakra-ui/react';
|
||||
import { Box, chakra, Tooltip } from '@chakra-ui/react';
|
||||
import React from 'react';
|
||||
import Jazzicon, { jsNumberForAddress } from 'react-jazzicon';
|
||||
|
||||
@@ -19,9 +19,11 @@ const AddressIcon = ({ address, className }: Props) => {
|
||||
}
|
||||
|
||||
return (
|
||||
<Box className={ className } width="24px" display="inline-flex">
|
||||
<Jazzicon diameter={ 24 } seed={ jsNumberForAddress(address.hash) }/>
|
||||
</Box>
|
||||
<Tooltip label={ address.implementation_name }>
|
||||
<Box className={ className } width="24px" display="inline-flex">
|
||||
<Jazzicon diameter={ 24 } seed={ jsNumberForAddress(address.hash) }/>
|
||||
</Box>
|
||||
</Tooltip>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
@@ -16,9 +16,10 @@ interface Props {
|
||||
fontWeight?: string;
|
||||
id?: string;
|
||||
target?: HTMLAttributeAnchorTarget;
|
||||
isDisabled?: boolean;
|
||||
}
|
||||
|
||||
const AddressLink = ({ alias, type, className, truncation = 'dynamic', hash, id, fontWeight, target = '_self' }: Props) => {
|
||||
const AddressLink = ({ alias, type, className, truncation = 'dynamic', hash, id, fontWeight, target = '_self', isDisabled }: Props) => {
|
||||
const isMobile = useIsMobile();
|
||||
|
||||
let url;
|
||||
@@ -52,6 +53,18 @@ const AddressLink = ({ alias, type, className, truncation = 'dynamic', hash, id,
|
||||
}
|
||||
})();
|
||||
|
||||
if (isDisabled) {
|
||||
return (
|
||||
<chakra.span
|
||||
className={ className }
|
||||
overflow="hidden"
|
||||
whiteSpace="nowrap"
|
||||
>
|
||||
{ content }
|
||||
</chakra.span>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<Link
|
||||
className={ className }
|
||||
|
||||
@@ -108,6 +108,7 @@ const TxsListItem = ({ tx, showBlockInfo, currentAddress, enableTimeIncrement }:
|
||||
alias={ tx.from.name }
|
||||
fontWeight="500"
|
||||
ml={ 2 }
|
||||
isDisabled={ isOut }
|
||||
/>
|
||||
</Address>
|
||||
{ (isIn || isOut) ?
|
||||
@@ -126,6 +127,7 @@ const TxsListItem = ({ tx, showBlockInfo, currentAddress, enableTimeIncrement }:
|
||||
alias={ dataTo.name }
|
||||
fontWeight="500"
|
||||
ml={ 2 }
|
||||
isDisabled={ isIn }
|
||||
/>
|
||||
</Address>
|
||||
</Flex>
|
||||
|
||||
@@ -7,7 +7,6 @@ import {
|
||||
Icon,
|
||||
VStack,
|
||||
Text,
|
||||
Tooltip,
|
||||
Popover,
|
||||
PopoverTrigger,
|
||||
PopoverContent,
|
||||
@@ -50,10 +49,8 @@ const TxsTableItem = ({ tx, showBlockInfo, currentAddress, enableTimeIncrement }
|
||||
|
||||
const addressFrom = (
|
||||
<Address>
|
||||
<Tooltip label={ tx.from.implementation_name }>
|
||||
<Box display="flex"><AddressIcon address={ tx.from }/></Box>
|
||||
</Tooltip>
|
||||
<AddressLink hash={ tx.from.hash } alias={ tx.from.name } fontWeight="500" ml={ 2 } truncation="constant"/>
|
||||
<AddressIcon address={ tx.from }/>
|
||||
<AddressLink hash={ tx.from.hash } alias={ tx.from.name } fontWeight="500" ml={ 2 } truncation="constant" isDisabled={ isOut }/>
|
||||
</Address>
|
||||
);
|
||||
|
||||
@@ -61,10 +58,8 @@ const TxsTableItem = ({ tx, showBlockInfo, currentAddress, enableTimeIncrement }
|
||||
|
||||
const addressTo = (
|
||||
<Address>
|
||||
<Tooltip label={ dataTo.implementation_name }>
|
||||
<Box display="flex"><AddressIcon address={ dataTo }/></Box>
|
||||
</Tooltip>
|
||||
<AddressLink hash={ dataTo.hash } alias={ dataTo.name } fontWeight="500" ml={ 2 } truncation="constant"/>
|
||||
<AddressIcon address={ dataTo }/>
|
||||
<AddressLink hash={ dataTo.hash } alias={ dataTo.name } fontWeight="500" ml={ 2 } truncation="constant" isDisabled={ isIn }/>
|
||||
</Address>
|
||||
);
|
||||
|
||||
|
||||