2a13da1a6c
* chore: gitignore for lib directory * build: packageing for webpack lib build * build: webpack config * feat: expose App component with beeApiUrl parameter * build: tsconfig for library build * build: main property of package json for tsc build * refactor: rename beeUrl option to beeApiUrl * refactor: manange config class instead of process.env calls * build: babelrc config * build: babel plugins and presets for webpack build * chore: serve.js chmod * build(refactor): webpack build * refactor: number notation * chore: webpack and package config change * build: add babel preset-env * chore: prepare script also builds component lib * feat: typegen * revert: set back prepare command * build: assets loader config * feat: beeDebugApiUrl * refactor: move test files to the test folder because of typegen * feat: locked api settings * chore: depcheck ignores * chore: types check script * ci: check types * ci: publish with library * chore: add webpack as devDep * chore: locked semver * chore: remove debug logging * style: webpack config * chore: react and react-dom as dependency * chore: package-lock * fix: clean package-lock init * refactor: fix versions in package.json
55 lines
1.6 KiB
TypeScript
55 lines
1.6 KiB
TypeScript
import { Typography } from '@material-ui/core/'
|
|
import { ReactElement } from 'react'
|
|
import Identicon from 'react-identicons'
|
|
import { config } from '../config'
|
|
import ClipboardCopy from './ClipboardCopy'
|
|
import QRCodeModal from './QRCodeModal'
|
|
|
|
interface Props {
|
|
address: string | undefined
|
|
hideBlockie?: boolean
|
|
transaction?: boolean
|
|
truncate?: boolean
|
|
}
|
|
|
|
export default function EthereumAddress(props: Props): ReactElement {
|
|
return (
|
|
<Typography component="div" variant="subtitle1">
|
|
{props.address ? (
|
|
<div style={{ display: 'flex' }}>
|
|
{props.hideBlockie ? null : (
|
|
<div style={{ paddingTop: '5px', marginRight: '10px' }}>
|
|
<Identicon size={20} string={props.address} />
|
|
</div>
|
|
)}
|
|
<div>
|
|
<a
|
|
style={
|
|
props.truncate
|
|
? {
|
|
marginRight: '7px',
|
|
maxWidth: '200px',
|
|
overflow: 'hidden',
|
|
textOverflow: 'ellipsis',
|
|
whiteSpace: 'nowrap',
|
|
display: 'block',
|
|
}
|
|
: { marginRight: '7px' }
|
|
}
|
|
href={`${config.BLOCKCHAIN_EXPLORER_URL}/${props.transaction ? 'tx' : 'address'}/${props.address}`}
|
|
target="_blank"
|
|
rel="noreferrer"
|
|
>
|
|
{props.address}
|
|
</a>
|
|
</div>
|
|
<QRCodeModal value={props.address} label={'Ethereum Address'} />
|
|
<ClipboardCopy value={props.address} />
|
|
</div>
|
|
) : (
|
|
'-'
|
|
)}
|
|
</Typography>
|
|
)
|
|
}
|