Fixes overflow text

Summary: ^

Reviewed By: antonk52

Differential Revision: D41580381

fbshipit-source-id: d2e2d53f28ebf68a0f6c5a4cb882e905fd4bdd66
This commit is contained in:
Lorenzo Blasa
2022-11-29 08:10:12 -08:00
committed by Facebook GitHub Bot
parent feb206d069
commit b701d76668

View File

@@ -18,6 +18,15 @@ type Props = {
node: UINode; node: UINode;
}; };
const IdentityKey = styled.div({
padding: '0 16px',
});
const IdentityValue = styled.span({
fontSize: theme.fontSize.small,
wordBreak: 'break-all',
});
const IdentityContainer = styled.div(TopSpacedContainerStyle); const IdentityContainer = styled.div(TopSpacedContainerStyle);
export const IdentityInspector: React.FC<Props> = ({node}) => { export const IdentityInspector: React.FC<Props> = ({node}) => {
@@ -25,26 +34,28 @@ export const IdentityInspector: React.FC<Props> = ({node}) => {
<IdentityContainer> <IdentityContainer>
<Row gutter={4}> <Row gutter={4}>
<Col span="10"> <Col span="10">
<div style={{padding: '0 16px'}}>Name:</div> <IdentityKey>Name:</IdentityKey>
</Col> </Col>
<Col span="14" style={{fontSize: theme.fontSize.small}}> <Col span="14">
{node.name} <IdentityValue title={node.name}>{node.name}</IdentityValue>
</Col> </Col>
</Row> </Row>
<Row gutter={4}> <Row gutter={4}>
<Col span="10"> <Col span="10">
<div style={{padding: '0 16px'}}>Qualified name:</div> <IdentityKey>Qualified name:</IdentityKey>
</Col> </Col>
<Col span="14" style={{fontSize: theme.fontSize.small}}> <Col span="14">
<IdentityValue title={node.qualifiedName}>
{node.qualifiedName} {node.qualifiedName}
</IdentityValue>
</Col> </Col>
</Row> </Row>
<Row gutter={4}> <Row gutter={4}>
<Col span="10"> <Col span="10">
<div style={{padding: '0 16px'}}>Id:</div> <IdentityKey>Id:</IdentityKey>
</Col> </Col>
<Col span="14" style={{fontSize: theme.fontSize.small}}> <Col span="14">
{node.id} <IdentityValue title={node.id.toString()}>{node.id}</IdentityValue>
</Col> </Col>
</Row> </Row>
<CodeInspector name={node.qualifiedName} tags={node.tags} /> <CodeInspector name={node.qualifiedName} tags={node.tags} />