1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
metamask-extension/ui/app/pages/permissions-connect/permissions-connect.container.js
Mark Stacey 63bd422840
Handle one specific permissions request per tab (#7620)
The connect route now takes a route parameter: the permissions request
id. This id is set whenever the permissions connect screen is opened,
ensuring that that tab is for that specific request alone.

This makes handling of multiple permissions requests a bit more
intuitive. Previously whenever opening multiple permissions requests,
the first one would be shown on each successive tab, whereas you
would expect each tab to show the request that prompted the tab to
open. Users may now address permissions request in whichever order
they'd like to, rather than being forced to deal with them
chronologically.
2019-12-05 17:05:50 -04:00

80 lines
2.6 KiB
JavaScript

import { connect } from 'react-redux'
import { compose } from 'recompose'
import PropTypes from 'prop-types'
import PermissionApproval from './permissions-connect.component'
import {
getPermissionsRequests,
getNativeCurrency,
getAccountsWithLabels,
getLastConnectedInfo,
getPermissionsDomains,
} from '../../selectors/selectors'
import { formatDate } from '../../helpers/utils/util'
import { approvePermissionsRequest, rejectPermissionsRequest, showModal, getCurrentWindowTab, getRequestAccountTabIds } from '../../store/actions'
const mapStateToProps = (state, ownProps) => {
const { match: { params: { id: permissionsRequestId } } } = ownProps
const permissionsRequests = getPermissionsRequests(state)
const permissionsRequest = permissionsRequests
.find(permissionsRequest => permissionsRequest.metadata.id === permissionsRequestId)
const { metadata = {} } = permissionsRequest || {}
const { origin } = metadata
const nativeCurrency = getNativeCurrency(state)
const accountsWithLabels = getAccountsWithLabels(state)
const { requestAccountTabs = {} } = state.appState
const lastConnectedInfo = getLastConnectedInfo(state) || {}
const addressLastConnectedMap = lastConnectedInfo[origin] || {}
Object.keys(addressLastConnectedMap).forEach(key => {
addressLastConnectedMap[key] = formatDate(addressLastConnectedMap[key], 'yyyy-M-d')
})
return {
permissionsRequest,
permissionsRequestId,
accounts: accountsWithLabels,
originName: origin,
newAccountNumber: accountsWithLabels.length + 1,
nativeCurrency,
requestAccountTabs,
addressLastConnectedMap,
domains: getPermissionsDomains(state),
}
}
const mapDispatchToProps = dispatch => {
return {
approvePermissionsRequest: (request, accounts) => dispatch(approvePermissionsRequest(request, accounts)),
rejectPermissionsRequest: requestId => dispatch(rejectPermissionsRequest(requestId)),
showNewAccountModal: ({ onCreateNewAccount, newAccountNumber }) => {
return dispatch(showModal({
name: 'NEW_ACCOUNT',
onCreateNewAccount,
newAccountNumber,
}))
},
getRequestAccountTabIds: () => dispatch(getRequestAccountTabIds()),
getCurrentWindowTab: () => dispatch(getCurrentWindowTab()),
}
}
const PermissionApprovalContainer = compose(
connect(mapStateToProps, mapDispatchToProps)
)(PermissionApproval)
PermissionApprovalContainer.propTypes = {
history: PropTypes.object.isRequired,
match: PropTypes.shape({
params: PropTypes.shape({
id: PropTypes.string,
}).isRequired,
}).isRequired,
}
export default PermissionApprovalContainer