All files / src/components/elements DidTruncate.tsx

0% Statements 0/8
0% Branches 0/4
0% Functions 0/1
0% Lines 0/8

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33                                                                 
import styled from "styled-components";
import { Flex } from "rimble-ui";
 
const DidPart1 = styled.span`
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
`;
 
const DidPart2 = styled.span`
  flex-shrink: 0;
`;
 
export interface DidTruncateProps {
  did: string;
  alignRight?: boolean;
  endLength?: number;
}
 
export const DidTruncate: React.FunctionComponent<DidTruncateProps> = (props) => {
  const endLength = props.endLength || 6;
  const slice = props.did.length - endLength;
  const didPart1 = props.did.slice(0, slice);
  const didPart2 = props.did.slice(slice);
 
  return (
    <Flex justifyContent={props.alignRight ? "flex-end" : "flex-start"} minWidth={0} flexShrink={0} width="100%">
      <DidPart1>{didPart1}</DidPart1>
      <DidPart2>{didPart2}</DidPart2>
    </Flex>
  );
};