(Fix) - #623 Fixes short tx data (#928)

* Fixs short tx data

* Feedback
This commit is contained in:
Agustin Pane 2020-05-22 11:46:20 -03:00 committed by GitHub
parent 203c8b0ab3
commit 425f1ad3e5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 33 additions and 94 deletions

View File

@ -15,10 +15,10 @@ import Row from 'src/components/layout/Row'
import { SAFELIST_ADDRESS } from 'src/routes/routes'
import SendModal from 'src/routes/safe/components/Balances/SendModal'
import CurrencyDropdown from 'src/routes/safe/components/CurrencyDropdown'
import { useFetchTokens } from 'src/routes/safe/container/hooks/useFetchTokens'
import { safeFeaturesEnabledSelector, safeParamAddressFromStateSelector } from 'src/routes/safe/store/selectors'
import { history } from 'src/store/index'
import { wrapInSuspense } from 'src/utils/wrapInSuspense'
import { useFetchTokens } from '../../container/Hooks/useFetchTokens'
const Collectibles = React.lazy(() => import('src/routes/safe/components/Balances/Collectibles'))
const Coins = React.lazy(() => import('src/routes/safe/components/Balances/Coins'))

View File

@ -135,22 +135,14 @@ const SettingsDescription = ({ action, addedOwner, newThreshold, removedOwner })
)
}
const CustomDescription = ({ amount = 0, classes, data, recipient }: any) => {
const TxData = (props) => {
const { classes, data } = props
const [showTxData, setShowTxData] = useState(false)
const recipientName = useSelector((state) => getNameFromAddressBook(state, recipient))
const showExpandBtn = data.length > 20
return (
<>
<Block data-testid={TRANSACTIONS_DESC_CUSTOM_VALUE_TEST_ID}>
<Bold>Send {amount} to:</Bold>
{recipientName ? (
<OwnerAddressTableCell address={recipient} knownAddress showLinks userName={recipientName} />
) : (
<EtherscanLink knownAddress={false} type="address" value={recipient} />
)}
</Block>
<Block className={classes.txData} data-testid={TRANSACTIONS_DESC_CUSTOM_DATA_TEST_ID}>
<Bold>Data (hex encoded):</Bold>
<Paragraph className={classes.txDataParagraph} noMargin size="md">
<Paragraph className={classes.txDataParagraph} noMargin size="md">
{showExpandBtn ? (
<>
{showTxData ? (
<>
{data}{' '}
@ -178,7 +170,29 @@ const CustomDescription = ({ amount = 0, classes, data, recipient }: any) => {
</LinkWithRef>
</>
)}
</Paragraph>
</>
) : (
data
)}
</Paragraph>
)
}
const CustomDescription = ({ amount = 0, classes, data, recipient }: any) => {
const recipientName = useSelector((state) => getNameFromAddressBook(state, recipient))
return (
<>
<Block data-testid={TRANSACTIONS_DESC_CUSTOM_VALUE_TEST_ID}>
<Bold>Send {amount} to:</Bold>
{recipientName ? (
<OwnerAddressTableCell address={recipient} knownAddress showLinks userName={recipientName} />
) : (
<EtherscanLink knownAddress={false} type="address" value={recipient} />
)}
</Block>
<Block className={classes.txData} data-testid={TRANSACTIONS_DESC_CUSTOM_DATA_TEST_ID}>
<Bold>Data (hex encoded):</Bold>
<TxData classes={classes} data={data} />
</Block>
</>
)

View File

@ -1,76 +0,0 @@
import * as React from 'react'
import { useState } from 'react'
import { useSelector } from 'react-redux'
import Page from 'src/components/layout/Page'
import Layout from 'src/routes/safe/components/Layout'
import { useCheckForUpdates } from 'src/routes/safe/container/Hooks/useCheckForUpdates'
import { useLoadSafe } from 'src/routes/safe/container/Hooks/useLoadSafe'
import { safeParamAddressFromStateSelector } from 'src/routes/safe/store/selectors'
const INITIAL_STATE = {
sendFunds: {
isOpen: false,
selectedToken: undefined,
},
showReceive: false,
}
const SafeView = () => {
const [state, setState] = useState(INITIAL_STATE)
const safeAddress = useSelector(safeParamAddressFromStateSelector)
useLoadSafe(safeAddress)
useCheckForUpdates()
const onShow = (action) => () => {
setState((prevState) => ({
...prevState,
[`show${action}`]: true,
}))
}
const onHide = (action) => () => {
setState((prevState) => ({
...prevState,
[`show${action}`]: false,
}))
}
const showSendFunds = (token) => {
setState((prevState) => ({
...prevState,
sendFunds: {
isOpen: true,
selectedToken: token,
},
}))
}
const hideSendFunds = () => {
setState((prevState) => ({
...prevState,
sendFunds: {
isOpen: false,
selectedToken: undefined,
},
}))
}
const { sendFunds, showReceive } = state
return (
<Page>
<Layout
hideSendFunds={hideSendFunds}
onHide={onHide}
onShow={onShow}
sendFunds={sendFunds}
showReceive={showReceive}
showSendFunds={showSendFunds}
/>
</Page>
)
}
export default SafeView

View File

@ -5,9 +5,10 @@ import { useSelector } from 'react-redux'
import Page from 'src/components/layout/Page'
import Layout from 'src/routes/safe/components/Layout'
import { useCheckForUpdates } from 'src/routes/safe/container/hooks/useCheckForUpdates'
import { useLoadSafe } from 'src/routes/safe/container/hooks/useLoadSafe'
import { safeParamAddressFromStateSelector } from 'src/routes/safe/store/selectors'
import { useCheckForUpdates } from './Hooks/useCheckForUpdates'
import { useLoadSafe } from './Hooks/useLoadSafe'
const INITIAL_STATE = {
sendFunds: {