mirror of
https://github.com/luxfi/explore.git
synced 2026-09-24 00:28:18 +00:00
0eadf590e7
* fix links in approvals list * pass check-summed hash to safe API call * make tx hash optional for token transfers * fix multiple public tag submission * update screenshots * use DataListDisplay for revoke * force to send credential only with general API requests * prefer formatted date label over date default formatting when saving chart data as csv * add abort failed status for zeta chain CCTX * update specify sdk * rename ENV for native token address * add ENV to hide native coin price in topbar * rename routes for name services * fix chart csv export file * fix tests --------- Co-authored-by: Max Alekseenko <[email protected]> Co-authored-by: isstuev <[email protected]>
64 lines
1.5 KiB
TypeScript
64 lines
1.5 KiB
TypeScript
import { Box } from '@chakra-ui/react';
|
|
import React from 'react';
|
|
|
|
import config from 'configs/app';
|
|
import { Image } from 'toolkit/chakra/image';
|
|
import type { ImageProps } from 'toolkit/chakra/image';
|
|
import IconSvg from 'ui/shared/IconSvg';
|
|
|
|
interface ClusterIconProps extends Omit<ImageProps, 'src' | 'alt'> {
|
|
clusterName: string;
|
|
}
|
|
|
|
const nameServicesFeature = config.features.nameServices;
|
|
|
|
const ClusterIcon = ({
|
|
clusterName,
|
|
boxSize = 5,
|
|
borderRadius = 'base',
|
|
mr = 2,
|
|
flexShrink = 0,
|
|
...imageProps
|
|
}: ClusterIconProps) => {
|
|
const clustersFeature = nameServicesFeature.isEnabled && nameServicesFeature.clusters.isEnabled ? nameServicesFeature.clusters : undefined;
|
|
|
|
const fallbackElement = (
|
|
<Box
|
|
display="inline-flex"
|
|
alignItems="center"
|
|
justifyContent="center"
|
|
boxSize={ boxSize }
|
|
backgroundColor="clusters"
|
|
borderRadius={ borderRadius }
|
|
mr={ mr }
|
|
flexShrink={ flexShrink }
|
|
>
|
|
<IconSvg
|
|
name="clusters"
|
|
boxSize={ 3 }
|
|
color="white"
|
|
/>
|
|
</Box>
|
|
);
|
|
|
|
if (!clustersFeature) {
|
|
return fallbackElement;
|
|
}
|
|
|
|
return (
|
|
<Image
|
|
boxSize={ boxSize }
|
|
borderRadius={ borderRadius }
|
|
mr={ mr }
|
|
flexShrink={ flexShrink }
|
|
|
|
src={ `${ clustersFeature.cdnUrl }/profile-image/${ clusterName }` }
|
|
alt={ `${ clusterName } profile` }
|
|
fallback={ fallbackElement }
|
|
{ ...imageProps }
|
|
/>
|
|
);
|
|
};
|
|
|
|
export default React.memo(ClusterIcon);
|