mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-10-22 19:26:13 +02:00
Move home notifications upwards in DOM (#8138)
The notifications displayed on the home screen were being passed through the `TransactionView` and `TransactionList` components before being rendered. This was unnecessary because the notifications are absolutely positioned. They are now rendered directly in the home component where they're defined. A helper function has been written to improve readability.
This commit is contained in:
parent
f4c279e6ff
commit
fa3497e39b
@ -10,13 +10,11 @@ export default class TransactionList extends PureComponent {
|
||||
}
|
||||
|
||||
static defaultProps = {
|
||||
children: null,
|
||||
pendingTransactions: [],
|
||||
completedTransactions: [],
|
||||
}
|
||||
|
||||
static propTypes = {
|
||||
children: PropTypes.node,
|
||||
pendingTransactions: PropTypes.array,
|
||||
completedTransactions: PropTypes.array,
|
||||
selectedToken: PropTypes.object,
|
||||
@ -155,7 +153,6 @@ export default class TransactionList extends PureComponent {
|
||||
return (
|
||||
<div className="transaction-list">
|
||||
{ this.renderTransactions() }
|
||||
{ this.props.children }
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
@ -10,14 +10,6 @@ export default class TransactionView extends PureComponent {
|
||||
t: PropTypes.func,
|
||||
}
|
||||
|
||||
static propTypes = {
|
||||
children: PropTypes.node,
|
||||
}
|
||||
|
||||
static defaultProps = {
|
||||
children: null,
|
||||
}
|
||||
|
||||
render () {
|
||||
return (
|
||||
<div className="transaction-view">
|
||||
@ -28,9 +20,7 @@ export default class TransactionView extends PureComponent {
|
||||
<div className="transaction-view__balance-wrapper">
|
||||
<TransactionViewBalance />
|
||||
</div>
|
||||
<TransactionList>
|
||||
{ this.props.children }
|
||||
</TransactionList>
|
||||
<TransactionList />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
@ -85,10 +85,9 @@ export default class Home extends PureComponent {
|
||||
}
|
||||
}
|
||||
|
||||
render () {
|
||||
renderNotifications () {
|
||||
const { t } = this.context
|
||||
const {
|
||||
forgottenPassword,
|
||||
history,
|
||||
hasDaiV1Token,
|
||||
shouldShowSeedPhraseReminder,
|
||||
@ -101,20 +100,7 @@ export default class Home extends PureComponent {
|
||||
threeBoxLastUpdated,
|
||||
} = this.props
|
||||
|
||||
if (forgottenPassword) {
|
||||
return <Redirect to={{ pathname: RESTORE_VAULT_ROUTE }} />
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="main-container">
|
||||
<div className="home__container">
|
||||
<Media
|
||||
query="(min-width: 576px)"
|
||||
render={() => <WalletView />}
|
||||
/>
|
||||
{ !history.location.pathname.match(/^\/confirm-transaction/)
|
||||
? (
|
||||
<TransactionView>
|
||||
<MultipleNotifications>
|
||||
{
|
||||
shouldShowSeedPhraseReminder
|
||||
@ -163,9 +149,32 @@ export default class Home extends PureComponent {
|
||||
: null
|
||||
}
|
||||
</MultipleNotifications>
|
||||
</TransactionView>
|
||||
)
|
||||
}
|
||||
|
||||
render () {
|
||||
const {
|
||||
forgottenPassword,
|
||||
history,
|
||||
} = this.props
|
||||
|
||||
if (forgottenPassword) {
|
||||
return <Redirect to={{ pathname: RESTORE_VAULT_ROUTE }} />
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="main-container">
|
||||
<div className="home__container">
|
||||
<Media
|
||||
query="(min-width: 576px)"
|
||||
render={() => <WalletView />}
|
||||
/>
|
||||
{ !history.location.pathname.match(/^\/confirm-transaction/)
|
||||
? (
|
||||
<TransactionView />
|
||||
)
|
||||
: null }
|
||||
{ this.renderNotifications() }
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
Loading…
Reference in New Issue
Block a user