Commit 1877b00f authored by Max Alekseenko's avatar Max Alekseenko

update no data component

parent 6ecb1e28
import { Tooltip, chakra } from '@chakra-ui/react';
import React from 'react';
const DataNotAvailable = () => {
return (
<Tooltip
label="Data will be available soon"
textAlign="center"
padding={ 2 }
openDelay={ 500 }
>
<chakra.span cursor="default" fontWeight="500" fontSize="sm">
n/a
</chakra.span>
</Tooltip>
);
};
export default DataNotAvailable;
import { Flex, IconButton, chakra } from '@chakra-ui/react'; import { Flex, IconButton, Text } from '@chakra-ui/react';
import React from 'react'; import React from 'react';
import type { MouseEvent } from 'react'; import type { MouseEvent } from 'react';
...@@ -117,9 +117,7 @@ const ListItem = ({ app, onInfoClick, isFavorite, onFavoriteClick, isLoading, on ...@@ -117,9 +117,7 @@ const ListItem = ({ app, onInfoClick, isFavorite, onFavoriteClick, isLoading, on
</ContractListButton> </ContractListButton>
</> </>
) : ( ) : (
<chakra.span fontWeight="500" fontSize="sm"> <Text variant="secondary" fontSize="sm" fontWeight={ 500 }>Data will be available soon</Text>
Data will be available soon
</chakra.span>
) } ) }
</Flex> </Flex>
<MoreInfoButton onClick={ handleInfoClick } isLoading={ isLoading }/> <MoreInfoButton onClick={ handleInfoClick } isLoading={ isLoading }/>
......
import { Td, Tr, IconButton, Skeleton } from '@chakra-ui/react'; import { Td, Tr, IconButton, Skeleton, Text } from '@chakra-ui/react';
import React from 'react'; import React from 'react';
import type { MouseEvent } from 'react'; import type { MouseEvent } from 'react';
...@@ -11,7 +11,6 @@ import IconSvg from 'ui/shared/IconSvg'; ...@@ -11,7 +11,6 @@ import IconSvg from 'ui/shared/IconSvg';
import AppSecurityReport from '../AppSecurityReport'; import AppSecurityReport from '../AppSecurityReport';
import ContractListButton, { ContractListButtonVariants } from '../ContractListButton'; import ContractListButton, { ContractListButtonVariants } from '../ContractListButton';
import AppLink from './AppLink'; import AppLink from './AppLink';
import DataNotAvailable from './DataNotAvailable';
import MoreInfoButton from './MoreInfoButton'; import MoreInfoButton from './MoreInfoButton';
type Props = { type Props = {
...@@ -80,43 +79,39 @@ const TableItem = ({ ...@@ -80,43 +79,39 @@ const TableItem = ({
<Td verticalAlign="middle"> <Td verticalAlign="middle">
<AppLink app={ app } isLoading={ isLoading } onAppClick={ onAppClick } isLarge/> <AppLink app={ app } isLoading={ isLoading } onAppClick={ onAppClick } isLarge/>
</Td> </Td>
<Td verticalAlign="middle"> { (securityReport || isLoading) ? (
{ (securityReport || isLoading) ? ( <>
<AppSecurityReport <Td verticalAlign="middle">
securityReport={ securityReport } <AppSecurityReport
showContractList={ showAnalyzedContracts } securityReport={ securityReport }
isLoading={ isLoading } showContractList={ showAnalyzedContracts }
/> isLoading={ isLoading }
) : ( />
<DataNotAvailable/> </Td>
) } <Td verticalAlign="middle">
</Td> <ContractListButton
<Td verticalAlign="middle"> onClick={ showAllContracts }
{ (securityReport || isLoading) ? ( variant={ ContractListButtonVariants.ALL_CONTRACTS }
<ContractListButton isLoading={ isLoading }
onClick={ showAllContracts } >
variant={ ContractListButtonVariants.ALL_CONTRACTS } { securityReport?.overallInfo.totalContractsNumber }
isLoading={ isLoading } </ContractListButton>
> </Td>
{ securityReport?.overallInfo.totalContractsNumber } <Td verticalAlign="middle">
</ContractListButton> <ContractListButton
) : ( onClick={ showVerifiedContracts }
<DataNotAvailable/> variant={ ContractListButtonVariants.VERIFIED_CONTRACTS }
) } isLoading={ isLoading }
</Td> >
<Td verticalAlign="middle"> { securityReport?.overallInfo.verifiedNumber }
{ (securityReport || isLoading) ? ( </ContractListButton>
<ContractListButton </Td>
onClick={ showVerifiedContracts } </>
variant={ ContractListButtonVariants.VERIFIED_CONTRACTS } ) : (
isLoading={ isLoading } <Td verticalAlign="middle" colSpan={ 3 }>
> <Text variant="secondary" fontSize="sm" fontWeight={ 500 }>Data will be available soon</Text>
{ securityReport?.overallInfo.verifiedNumber } </Td>
</ContractListButton> ) }
) : (
<DataNotAvailable/>
) }
</Td>
<Td verticalAlign="middle" isNumeric> <Td verticalAlign="middle" isNumeric>
<MoreInfoButton onClick={ handleInfoClick } isLoading={ isLoading }/> <MoreInfoButton onClick={ handleInfoClick } isLoading={ isLoading }/>
</Td> </Td>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment