mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-10-25 04:40:18 +02:00
dcc7d29511
The QR scanner component error handling would sometimes redirect the user to the wrong page. It was also confusingly handled in two places; the action used to open the QR scanner, and the scanner component. The error handling has now been corrected, simplified, and integrated into the QR scanner component itself. The old way of handling an error within the component was to close the modal, then call the action to open it all over again. This action took a route parameter, which instructed the action on which route to open if the fullscreen UI needed to be opened (as the fullscreen UI is the only one where the browser will show the camera permission prompt). This redirection worked just fine for handling the initial opening of the QR scanner modal. But for any subsequent errors the same action was used with a _default route_, meaning the user could click "try again" and find themselves on a completely different screen. Instead, errors now trigger a state change instead of closing and re- opening the modal. The permission checks in the action have been integrated into the component as well. One functional change is that the scenario where you have an invalid QR code has been made an error. Previously this just showed the error message below the video preview, but left the user with no way to try again. There error page has a "Try again" button, so it seemed better suited as an error. Also the message literally started with "Error:". Another functional change is that _all_ errors during initialization will result in the error UI being shown. Previously there was one error case that would instead log to the console and leave the user stuck.
28 lines
782 B
JavaScript
28 lines
782 B
JavaScript
import AddContact from './add-contact.component'
|
|
import { compose } from 'recompose'
|
|
import { connect } from 'react-redux'
|
|
import { withRouter } from 'react-router-dom'
|
|
import { addToAddressBook, showQrScanner, qrCodeDetected } from '../../../../store/actions'
|
|
import {
|
|
getQrCodeData,
|
|
} from '../../../send/send.selectors'
|
|
|
|
const mapStateToProps = state => {
|
|
return {
|
|
qrCodeData: getQrCodeData(state),
|
|
}
|
|
}
|
|
|
|
const mapDispatchToProps = dispatch => {
|
|
return {
|
|
addToAddressBook: (recipient, nickname) => dispatch(addToAddressBook(recipient, nickname)),
|
|
scanQrCode: () => dispatch(showQrScanner()),
|
|
qrCodeDetected: (data) => dispatch(qrCodeDetected(data)),
|
|
}
|
|
}
|
|
|
|
export default compose(
|
|
withRouter,
|
|
connect(mapStateToProps, mapDispatchToProps)
|
|
)(AddContact)
|