-
Notifications
You must be signed in to change notification settings - Fork 12
/
ExternalIdLabel.jsx
35 lines (32 loc) · 976 Bytes
/
ExternalIdLabel.jsx
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
34
35
import React from 'react';
import { ArrowForward as ForwardIcon } from '@mui/icons-material';
import { merge } from 'lodash';
const STYLES = {
medium: {
icon: {width: '9pt', marginTop: '2px', marginRight: '4px', height: '9pt'},
fontSize: '9pt',
},
small: {
icon: {width: '8pt', marginTop: '2px', marginRight: '4px', height: '8pt'},
fontSize: '8pt',
}
}
const ExternalIdLabel = props => {
const styles = STYLES[props.iconSize || 'small']
return (
<div className='resource-metadata' style={merge({fontSize: styles.fontSize}, (props.containerStyle || {}))}>
<span>
<ForwardIcon style={{
...styles.icon,
background: 'gray',
color: 'white',
border: '1px solid',
borderRadius: '10px',
}}
/>
</span>
<span>External ID: <span className={props.searchable ? 'searchable' : ''}>{props.externalId}</span></span>
</div>
)
}
export default ExternalIdLabel;