status-im/safe-react
2
0
Fork 0
mirror of https://github.com/status-im/safe-react.git synced 2025-02-04 13:54:11 +00:00
Code Issues Projects Releases Wiki Activity

Fix TX detail visualization (#1281)

Browse Source 
Co-authored-by: Mikhail Mikheev <mmvsha73@gmail.com>
This commit is contained in:
nicolas 2020-08-27 06:58:44 -03:00 committed by GitHub
parent 5333534f97
commit 5573383c48
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 10 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/routes/safe/components/Transactions/TxsTable/ExpandedTx/TxDescription/CustomDescription.tsx
View File

@ -36,9 +36,7 @@ const TxDetailsMethodName = styled(Text)`
` `
const TxDetailsMethodParam = styled.div` const TxDetailsMethodParam = styled.div`
text-indent: 8px; text-indent: 8px;
` display: flex;
const InlineText = styled(Text)`
display: inline-flex;
` `
const TxDetailsContent = styled.div` const TxDetailsContent = styled.div`
padding: 8px 8px 8px 16px; padding: 8px 8px 8px 16px;
@ -56,9 +54,9 @@ const TxInfoDetails = ({ data }: { data: DataDecoded }): React.ReactElement => (
{data.parameters.map((param, index) => ( {data.parameters.map((param, index) => (
<TxDetailsMethodParam key={`${data.method}_param-${index}`}> <TxDetailsMethodParam key={`${data.method}_param-${index}`}>
<InlineText size="lg" strong> <Text size="lg" strong>
{param.name}({param.type}): {param.name}({param.type}):
</InlineText> </Text>
<Value method={data.method} type={param.type} value={param.value} /> <Value method={data.method} type={param.type} value={param.value} />
</TxDetailsMethodParam> </TxDetailsMethodParam>
))} ))}

14
src/routes/safe/components/Transactions/TxsTable/ExpandedTx/TxDescription/Value.tsx
View File

@ -14,14 +14,14 @@ import SafeEtherscanLink from 'src/components/EtherscanLink'
const useStyles = makeStyles(styles) const useStyles = makeStyles(styles)
const InlineText = styled(Text)`
display: inline-flex;
`
const NestedWrapper = styled.div` const NestedWrapper = styled.div`
text-indent: 24px; text-indent: 24px;
` `
const StyledText = styled(Text)`
white-space: normal;
`
interface RenderValueProps { interface RenderValueProps {
method: string method: string
type: string type: string
@ -61,15 +61,15 @@ const GenericValue = ({ method, type, value }: RenderValueProps): React.ReactEle
return ( return (
<NestedWrapper> <NestedWrapper>
{(value as string[]).map((value, index) => ( {(value as string[]).map((value, index) => (
<Text key={`${method}-value-${index}`} size="lg"> <StyledText key={`${method}-value-${index}`} size="lg">
{value} {value}
</Text> </StyledText>
))} ))}
</NestedWrapper> </NestedWrapper>
) )
} }
return <InlineText size="lg">{value as string}</InlineText> return <StyledText size="lg">{value as string}</StyledText>
} }
const Value = ({ type, ...props }: RenderValueProps): React.ReactElement => { const Value = ({ type, ...props }: RenderValueProps): React.ReactElement => {