Skip to content

F
frontend
Commit 14a7e95c authored by tom's avatar tom
Browse files
Options

fix tests

parent 136edb64
Show whitespace changes
Inline Side-by-side
Showing with 50 additions and 50 deletions
ui/searchResults/SearchResultListItem.tsx
View file @ 14a7e95c
......@@ -212,12 +212,12 @@ const SearchResultListItem = ({ data, searchTerm, isLoading }: Props) => {
<Text whiteSpace="nowrap" overflow="hidden">
<HashStringShortenDynamic hash={ data.address } isTooltipDisabled/>
</Text>
{ data.is_smart_contract_verified && <IconSvg name="status/success" color="green.500" ml={ 1 }/> }
{ data.is_smart_contract_verified && <IconSvg name="status/success" boxSize="14px" color="green.500" ml={ 1 } flexShrink={ 0 }/> }
</Skeleton>
<Text overflow="hidden" whiteSpace="nowrap" textOverflow="ellipsis" fontWeight={ 700 }>
<Skeleton isLoaded={ !isLoading } overflow="hidden" whiteSpace="nowrap" textOverflow="ellipsis" fontWeight={ 700 }>
{ data.token_type === 'ERC-20' && data.exchange_rate && `$${ Number(data.exchange_rate).toLocaleString() }` }
{ data.token_type !== 'ERC-20' && data.total_supply && `Items ${ Number(data.total_supply).toLocaleString() }` }
</Text>
</Skeleton>
</Grid>
);
}
......@@ -243,7 +243,7 @@ const SearchResultListItem = ({ data, searchTerm, isLoading }: Props) => {
<Box overflow="hidden">
<HashStringShortenDynamic hash={ data.address }/>
</Box>
{ data.is_smart_contract_verified && <IconSvg name="status/success" color="green.500" ml={ 1 }/> }
{ data.is_smart_contract_verified && <IconSvg name="status/success" boxSize="14px" color="green.500" ml={ 1 } flexShrink={ 0 }/> }
</Flex>
);
}
......
ui/searchResults/SearchResultTableItem.tsx
View file @ 14a7e95c
......@@ -74,7 +74,7 @@ const SearchResultTableItem = ({ data, searchTerm, isLoading }: Props) => {
<Box overflow="hidden" whiteSpace="nowrap" w={ data.is_smart_contract_verified ? 'calc(100%-28px)' : 'unset' }>
<HashStringShortenDynamic hash={ data.address }/>
</Box>
{ data.is_smart_contract_verified && <IconSvg name="status/success" color="green.500" ml={ 1 }/> }
{ data.is_smart_contract_verified && <IconSvg name="status/success" boxSize="14px" color="green.500" ml={ 1 } flexShrink={ 0 }/> }
</Skeleton>
</Td>
<Td fontSize="sm" verticalAlign="middle" isNumeric>
......@@ -180,7 +180,7 @@ const SearchResultTableItem = ({ data, searchTerm, isLoading }: Props) => {
<Box overflow="hidden" whiteSpace="nowrap" w={ data.is_smart_contract_verified ? 'calc(100%-28px)' : 'unset' }>
<HashStringShortenDynamic hash={ data.address }/>
</Box>
{ data.is_smart_contract_verified && <IconSvg name="status/success" color="green.500" ml={ 1 }/> }
{ data.is_smart_contract_verified && <IconSvg name="status/success" boxSize="14px" color="green.500" ml={ 1 } flexShrink={ 0 }/> }
</Flex>
</Td>
<Td></Td>
......
ui/shared/AppError/AppErrorIcon.tsx
View file @ 14a7e95c
......@@ -15,7 +15,7 @@ interface Props {
}
const AppErrorIcon = ({ statusCode }: Props) => {
return <IconSvg name={ ICONS[String(statusCode)] || ICONS['500'] } width="200px" height="auto" color="text"/>;
return <IconSvg name={ ICONS[String(statusCode)] || ICONS['500'] } width="200px" height="100px" color="text"/>;
};
export default AppErrorIcon;
ui/shared/Hint.tsx
View file @ 14a7e95c
......@@ -21,7 +21,7 @@ const Hint = ({ label, className, tooltipProps, isLoading }: Props) => {
}, [ onToggle ]);
if (isLoading) {
return <Skeleton boxSize={ 5 } borderRadius="sm"/>;
return <Skeleton className={ className } boxSize={ 5 } borderRadius="sm"/>;
}
return (
......@@ -35,7 +35,7 @@ const Hint = ({ label, className, tooltipProps, isLoading }: Props) => {
<IconButton
colorScheme="none"
aria-label="hint"
icon={ <IconSvg name="info" boxSize={ 5 }/> }
icon={ <IconSvg name="info" w="100%" h="100%"/> }
boxSize={ 5 }
variant="simple"
display="inline-block"
......
ui/shared/LinkExternal.tsx
View file @ 14a7e95c
......@@ -59,7 +59,7 @@ const LinkExternal = ({ href, children, className, isLoading, variant }: Props)
return (
<Link className={ className } { ...styleProps } target="_blank" href={ href }>
{ children }
<IconSvg name="arrows/north-east" boxSize={ 4 } verticalAlign="middle" color="gray.400"/>
<IconSvg name="arrows/north-east" boxSize={ 4 } verticalAlign="middle" color="gray.400" flexShrink={ 0 }/>
</Link>
);
};
......
ui/shared/Page/specs/LongNameAndManyTags.tsx
View file @ 14a7e95c
......@@ -27,7 +27,7 @@ const LongNameAndManyTags = () => {
const contentAfter = (
<>
<IconSvg name="verified_token" color="green.500" boxSize={ 6 } cursor="pointer"/>
<IconSvg name="verified_token" color="green.500" boxSize={ 6 } cursor="pointer" flexShrink={ 0 }/>
<EntityTags
data={{
private_tags: [ privateTag ],
......
ui/shared/entities/base/components.tsx
View file @ 14a7e95c
import { Box, chakra, Flex, Skeleton, useColorModeValue } from '@chakra-ui/react';
import { chakra, Flex, Skeleton, useColorModeValue } from '@chakra-ui/react';
import type { As, IconProps } from '@chakra-ui/react';
import React from 'react';
......@@ -91,14 +91,17 @@ const Icon = ({ isLoading, iconSize, noIcon, name, color, borderRadius }: IconBa
const styles = getIconProps(iconSize);
return (
<Box mr={ 2 } color={ color ?? defaultColor }>
<IconSvg
name={ name }
boxSize={ styles.boxSize }
isLoading={ isLoading }
borderRadius={ borderRadius ?? 'base' }
display="block"
mr={ 2 }
color={ color ?? defaultColor }
minW={ 0 }
flexShrink={ 0 }
/>
</Box>
);
};
......
ui/shared/entities/token/TokenEntity.tsx
View file @ 14a7e95c
......@@ -42,10 +42,11 @@ const Icon = (props: IconProps) => {
marginRight: props.marginRight ?? 2,
boxSize: props.boxSize ?? getIconProps(props.iconSize).boxSize,
borderRadius: 'base',
flexShrink: 0,
};
if (props.isLoading) {
return <Skeleton { ...styles } className={ props.className } flexShrink={ 0 }/>;
return <Skeleton { ...styles } className={ props.className }/>;
}
return (
......
ui/shared/filters/FilterInput.tsx
View file @ 14a7e95c
......@@ -44,7 +44,7 @@ const FilterInput = ({ onChange, className, size = 'sm', placeholder, initialVal
<InputLeftElement
pointerEvents="none"
>
<IconSvg name="search" color={ iconColor }/>
<IconSvg name="search" color={ iconColor } boxSize={ 4 }/>
</InputLeftElement>
<Input
......
ui/shared/statusTag/StatusTag.tsx
View file @ 14a7e95c
......@@ -38,7 +38,7 @@ const StatusTag = ({ type, text, errorText, isLoading }: Props) => {
return (
<Tooltip label={ errorText }>
<Tag colorScheme={ colorScheme } display="inline-flex" isLoading={ isLoading }>
<IconSvg boxSize={ 2.5 } name={ icon }/>
<IconSvg boxSize={ 2.5 } name={ icon } mr={ 2 }/>
<TagLabel>{ text }</TagLabel>
</Tag>
</Tooltip>
......
ui/snippets/header/Burger.pw.tsx
View file @ 14a7e95c
......@@ -50,7 +50,7 @@ test('base view', async({ mount, page }) => {
{ hooksConfig },
);
await component.locator('svg[aria-label="Menu button"]').click();
await component.locator('div[aria-label="Menu button"]').click();
await expect(page.locator('.chakra-modal__content-container')).toHaveScreenshot();
await page.locator('button[aria-label="Network menu"]').click();
......@@ -80,7 +80,7 @@ test.describe('dark mode', () => {
{ hooksConfig },
);
await component.locator('svg[aria-label="Menu button"]').click();
await component.locator('div[aria-label="Menu button"]').click();
await expect(page).toHaveScreenshot();
await page.locator('button[aria-label="Network menu"]').click();
......@@ -96,7 +96,7 @@ test('submenu', async({ mount, page }) => {
{ hooksConfig },
);
await component.locator('svg[aria-label="Menu button"]').click();
await component.locator('div[aria-label="Menu button"]').click();
await page.locator('div[aria-label="Blockchain link group"]').click();
await expect(page).toHaveScreenshot();
});
......@@ -122,7 +122,7 @@ test.describe('auth', () => {
{ hooksConfig },
);
await component.locator('svg[aria-label="Menu button"]').click();
await component.locator('div[aria-label="Menu button"]').click();
await expect(page).toHaveScreenshot();
});
});
ui/snippets/navigation/NavigationDesktop.pw.tsx
View file @ 14a7e95c
......@@ -111,7 +111,7 @@ test.describe('with tooltips', () => {
);
await component.locator('header').hover();
await page.locator('svg[aria-label="Expand/Collapse menu"]').click();
await page.locator('div[aria-label="Expand/Collapse menu"]').click();
await page.locator('a[aria-label="Tokens link"]').hover();
await expect(component).toHaveScreenshot();
......
ui/snippets/networkMenu/NetworkLogo.tsx
View file @ 14a7e95c
......@@ -49,11 +49,10 @@ const NetworkLogo = ({ isCollapsed, onClick }: Props) => {
const iconStyle = useColorModeValue({}, !config.UI.sidebar.icon.dark ? darkModeFilter : {});
return (
// TODO switch to <NextLink href={ href } passHref> when main page for network will be ready
<Box
as="a"
href={ route({ pathname: '/' }) }
width={{ base: 'auto', lg: isCollapsed === false ? '120px' : '30px', xl: isCollapsed ? '30px' : '120px' }}
width={{ base: '120px', lg: isCollapsed === false ? '120px' : '30px', xl: isCollapsed ? '30px' : '120px' }}
height={{ base: '24px', lg: isCollapsed === false ? '24px' : '30px', xl: isCollapsed ? '30px' : '24px' }}
display="inline-flex"
overflow="hidden"
......
ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggestApp.tsx
View file @ 14a7e95c
......@@ -42,7 +42,7 @@ const SearchBarSuggestApp = ({ data, isMobile, searchTerm, onClick }: Props) =>
>
<span dangerouslySetInnerHTML={{ __html: highlightText(data.title, searchTerm) }}/>
</Text>
{ data.external && <IconSvg name="arrows/north-east" boxSize={ 4 } verticalAlign="middle"/> }
{ data.external && <IconSvg name="arrows/north-east" boxSize={ 4 } verticalAlign="middle" flexShrink={ 0 }/> }
</Flex>
<Text
variant="secondary"
......@@ -81,7 +81,7 @@ const SearchBarSuggestApp = ({ data, isMobile, searchTerm, onClick }: Props) =>
>
{ data.description }
</Text>
{ data.external && <IconSvg name="arrows/north-east" boxSize={ 4 } verticalAlign="middle" color="text_secondary"/> }
{ data.external && <IconSvg name="arrows/north-east" boxSize={ 4 } verticalAlign="middle" color="text_secondary" flexShrink={ 0 }/> }
</Flex>
);
})();
......
ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggestLabel.tsx
View file @ 14a7e95c
......@@ -37,7 +37,7 @@ const SearchBarSuggestLabel = ({ data, isMobile, searchTerm }: Props) => {
</Text>
);
const isContractVerified = data.is_smart_contract_verified && <IconSvg name="status/success" color="green.500"/>;
const isContractVerified = data.is_smart_contract_verified && <IconSvg name="status/success" boxSize="14px" color="green.500" flexShrink={ 0 }/>;
if (isMobile) {
return (
......
ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggestToken.tsx
View file @ 14a7e95c
......@@ -34,7 +34,7 @@ const SearchBarSuggestToken = ({ data, isMobile, searchTerm }: Props) => {
</Text>
);
const contractVerifiedIcon = data.is_smart_contract_verified && <IconSvg name="status/success" color="green.500" ml={ 1 }/>;
const contractVerifiedIcon = data.is_smart_contract_verified && <IconSvg name="status/success" boxSize="14px" color="green.500" ml={ 1 } flexShrink={ 0 }/>;
const additionalInfo = (
<Text overflow="hidden" whiteSpace="nowrap" fontWeight={ 700 }>
{ data.token_type === 'ERC-20' && data.exchange_rate && `$${ Number(data.exchange_rate).toLocaleString() }` }
......
ui/token/TokenTransfer/TokenTransferListItem.tsx
View file @ 14a7e95c
......@@ -61,7 +61,7 @@ const TokenTransferListItem = ({
width="50%"
fontWeight="500"
/>
<IconSvg name="arrows/east-mini" boxSize={ 6 } color="gray.500" isLoading={ isLoading }/>
<IconSvg name="arrows/east" boxSize={ 6 } color="gray.500" flexShrink={ 0 } isLoading={ isLoading }/>
<AddressEntityWithTokenFilter
address={ to }
isLoading={ isLoading }
......
ui/token/TokenTransfer/TokenTransferTableItem.tsx
View file @ 14a7e95c
......@@ -69,9 +69,7 @@ const TokenTransferTableItem = ({
/>
</Td>
<Td px={ 0 }>
<Box my="3px">
<IconSvg name="arrows/east-mini" boxSize={ 6 } color="gray.500" isLoading={ isLoading }/>
</Box>
<IconSvg name="arrows/east" boxSize={ 6 } color="gray.500" mt="3px" isLoading={ isLoading }/>
</Td>
<Td>
<AddressEntityWithTokenFilter
......
ui/tx/internals/TxInternalsTableItem.tsx
View file @ 14a7e95c
......@@ -38,7 +38,7 @@ const TxInternalTableItem = ({ type, from, to, value, success, error, gas_limit:
/>
</Td>
<Td px={ 0 } verticalAlign="middle">
<IconSvg name="arrows/east" boxSize={ 6 } color="gray.500" isLoading={ isLoading }/>
<IconSvg name="arrows/east" boxSize={ 6 } color="gray.500" isLoading={ isLoading } display="block"/>
</Td>
<Td verticalAlign="middle">
{ toData && (
......
ui/txs/TxsListItem.tsx
View file @ 14a7e95c
import {
HStack,
Box,
Flex,
Skeleton,
} from '@chakra-ui/react';
......@@ -101,14 +100,14 @@ const TxsListItem = ({ tx, isLoading, showBlockInfo, currentAddress, enableTimeI
/>
{ (isIn || isOut) ?
<InOutTag isIn={ isIn } isOut={ isOut } width="48px" mx={ 2 } isLoading={ isLoading }/> : (
<Box mx={ 2 }>
<IconSvg
name="arrows/east"
boxSize={ 6 }
color="gray.500"
isLoading={ isLoading }
mx={ 2 }
flexShrink={ 0 }
/>
</Box>
) }
{ dataTo ? (
<AddressEntity
......
ui/verifiedAddresses/VerifiedAddressesListItem.tsx
View file @ 14a7e95c
......@@ -70,7 +70,7 @@ const VerifiedAddressesListItem = ({ item, application, onAdd, onEdit, isLoading
borderRadius="none"
flexShrink={ 0 }
onClick={ handleEditClick }
icon={ <IconSvg name="edit"/> }
icon={ <IconSvg name="edit" boxSize={ 4 } flexShrink={ 0 }/> }
/>
</Tooltip>
</>
......
ui/verifiedAddresses/VerifiedAddressesTableItem.tsx
View file @ 14a7e95c
......@@ -86,7 +86,7 @@ const VerifiedAddressesTableItem = ({ item, application, onAdd, onEdit, isLoadin
borderRadius="none"
flexShrink={ 0 }
onClick={ handleEditClick }
icon={ <IconSvg name="edit"/> }
icon={ <IconSvg name="edit" boxSize={ 4 } flexShrink={ 0 }/> }
/>
</Tooltip>
) : null }
......
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