mirror of
https://github.com/luxfi/explore.git
synced 2026-09-24 00:28:18 +00:00
tom goriunovandGitHub
28b9b27e8b
* update styles of tx details * common color for text separator * remove bold fontWeight from some details items * address, block, token, pool, user ops details pages * refactor chain-specific views * unify grid column template for detailed views * remove TODO * update margins for text separator * update screenshots * update margin between icon and text for mobile * rename prop * update layout of decoded input data * update screenshots * fix tac operation and zilliqa quorum snippets
35 lines
1.0 KiB
TypeScript
35 lines
1.0 KiB
TypeScript
import type { StackProps } from '@chakra-ui/react';
|
|
import { HStack, Box } from '@chakra-ui/react';
|
|
import React from 'react';
|
|
|
|
import type { Step } from './types';
|
|
|
|
import IconSvg from 'ui/shared/IconSvg';
|
|
|
|
interface Props extends StackProps {
|
|
step: Step;
|
|
isLast: boolean;
|
|
isPassed: boolean;
|
|
isPending?: boolean;
|
|
noIcon?: boolean;
|
|
};
|
|
|
|
const VerificationStep = ({ step, isLast, isPassed, isPending, noIcon, ...rest }: Props) => {
|
|
let stepColor = 'text.secondary';
|
|
if (isPending) {
|
|
stepColor = 'yellow.500';
|
|
} else if (isPassed) {
|
|
stepColor = 'green.500';
|
|
}
|
|
|
|
return (
|
|
<HStack gap={ 2 } color={ stepColor } minH={{ base: '30px', lg: '32px' }} { ...rest }>
|
|
{ !noIcon && <IconSvg name={ isPassed ? 'verification-steps/finalized' : 'verification-steps/unfinalized' } boxSize={ 5 }/> }
|
|
<Box color={ stepColor }>{ typeof step === 'string' ? step : step.content }</Box>
|
|
{ !isLast && <IconSvg name="arrows/east" boxSize={ 5 }/> }
|
|
</HStack>
|
|
);
|
|
};
|
|
|
|
export default VerificationStep;
|