Tom Butcher
d8c13426d1
- Introduced a new ElipsisText component to manage text overflow and truncation more effectively. - Replaced instances of the Text component with ElipsisText across various components including AddressDisplay, EmailDisplay, and FileList for consistent text handling. - Updated styles in multiple components to ensure proper layout and responsiveness when displaying long text.
44 lines
882 B
JavaScript
44 lines
882 B
JavaScript
import PropTypes from 'prop-types'
|
|
import { Flex, Typography } from 'antd'
|
|
import CopyButton from './CopyButton'
|
|
import ElipsisText from './ElipsisText'
|
|
|
|
const { Text } = Typography
|
|
|
|
const MiscId = ({ value, showCopy = true }) => {
|
|
if (!value) {
|
|
return <Text type='secondary'>n/a</Text>
|
|
}
|
|
|
|
return (
|
|
<Flex
|
|
align={'end'}
|
|
className='miscid'
|
|
style={{ minWidth: '0px', width: '100%' }}
|
|
>
|
|
<ElipsisText
|
|
code
|
|
style={showCopy ? { marginRight: 6, minWidth: '0px' } : undefined}
|
|
>
|
|
{value}
|
|
</ElipsisText>
|
|
|
|
{showCopy && (
|
|
<CopyButton
|
|
text={value}
|
|
tooltip='Copy ID'
|
|
style={{ marginLeft: 0 }}
|
|
iconStyle={{ fontSize: '14px' }}
|
|
/>
|
|
)}
|
|
</Flex>
|
|
)
|
|
}
|
|
|
|
MiscId.propTypes = {
|
|
value: PropTypes.string,
|
|
showCopy: PropTypes.bool
|
|
}
|
|
|
|
export default MiscId
|