ghost-portal/packages/ui-app/src/AddressMini.tsx

66 lines
1.6 KiB
TypeScript

// Copyright 2017-2018 @polkadot/app-staking authors & contributors
// This software may be modified and distributed under the terms
// of the ISC license. See the LICENSE file for details.
import { BareProps } from '@polkadot/ui-app/types';
import BN from 'bn.js';
import React from 'react';
import IdentityIcon from '@polkadot/ui-react/IdentityIcon';
import classes from './util/classes';
import toShortAddress from './util/toShortAddress';
import Balance from './Balance';
type Props = BareProps & {
balance?: BN | Array<BN>,
children?: React.ReactNode,
isPadded?: boolean,
isShort?: boolean,
value?: string,
withBalance?: boolean
};
export default class AddressMini extends React.PureComponent<Props> {
render () {
const { children, className, isPadded = true, isShort = true, style, value } = this.props;
if (!value) {
return null;
}
return (
<div
className={classes('ui--AddressMini', isPadded ? 'padded' : '', className)}
style={style}
>
<div className='ui--AddressMini-info'>
<IdentityIcon
size={24}
value={value}
/>
<div className='ui--AddressMini-address'>{isShort ? toShortAddress(value) : value}</div>
{children}
</div>
{this.renderBalance()}
</div>
);
}
private renderBalance () {
const { balance, value, withBalance = false } = this.props;
if (!withBalance || !value) {
return null;
}
return (
<Balance
balance={balance}
className='ui--AddressSummary-balance'
value={value}
/>
);
}
}