/* global alert */ import React, { Component } from 'react'; import { ActivityIndicator, TouchableOpacity, ScrollView, View, Dimensions, Image, TextInput, Clipboard, Linking, Platform, PermissionsAndroid, } from 'react-native'; import QRCode from 'react-native-qrcode-svg'; import { Icon, Text } from 'react-native-elements'; import { BlueButton, BlueText, SafeBlueArea, BlueCard, BlueNavigationStyle, BlueSpacing20, BlueCopyToClipboardButton, } from '../../BlueComponents'; import PropTypes from 'prop-types'; import Share from 'react-native-share'; import ReactNativeHapticFeedback from 'react-native-haptic-feedback'; import { RNCamera } from 'react-native-camera'; import RNFS from 'react-native-fs'; import DocumentPicker from 'react-native-document-picker'; let loc = require('../../loc'); let EV = require('../../events'); let BlueElectrum = require('../../BlueElectrum'); /** @type {AppStorage} */ const BlueApp = require('../../BlueApp'); const bitcoin = require('bitcoinjs-lib'); const { height, width } = Dimensions.get('window'); export default class PsbtWithHardwareWallet extends Component { static navigationOptions = () => ({ ...BlueNavigationStyle(null, false), title: loc.send.header, }); cameraRef = null; onBarCodeRead = ret => { if (RNCamera.Constants.CameraStatus === RNCamera.Constants.CameraStatus.READY) this.cameraRef.pausePreview(); if (ret.data.indexOf('+') === -1 && ret.data.indexOf('=') === -1 && ret.data.indexOf('=') === -1) { // this looks like NOT base64, so maybe its transaction's hex this.setState({ renderScanner: false, txhex: ret.data }); return; } this.setState({ renderScanner: false }, () => { try { let Tx = this.state.fromWallet.combinePsbt( this.state.isFirstPSBTAlreadyBase64 ? this.state.psbt : this.state.psbt.toBase64(), ret.data, ); this.setState({ txhex: Tx.toHex() }); } catch (Err) { alert(Err); } }); }; constructor(props) { super(props); this.state = { isLoading: false, renderScanner: false, qrCodeHeight: height > width ? width - 40 : width / 3, memo: props.navigation.getParam('memo'), psbt: props.navigation.getParam('psbt'), fromWallet: props.navigation.getParam('fromWallet'), isFirstPSBTAlreadyBase64: props.navigation.getParam('isFirstPSBTAlreadyBase64'), isSecondPSBTAlreadyBase64: false, deepLinkPSBT: undefined, txhex: props.navigation.getParam('txhex') || undefined, }; this.fileName = `${Date.now()}.psbt`; } static getDerivedStateFromProps(nextProps, prevState) { const deepLinkPSBT = nextProps.navigation.state.params.deepLinkPSBT; const txhex = nextProps.navigation.state.params.txhex; if (deepLinkPSBT) { try { let Tx = prevState.fromWallet.combinePsbt( prevState.isFirstPSBTAlreadyBase64 ? prevState.psbt : prevState.psbt.toBase64(), deepLinkPSBT, ); return { ...prevState, txhex: Tx.toHex(), }; } catch (Err) { alert(Err); } } else if (txhex) { return { ...prevState, txhex: txhex, }; } return prevState; } componentDidMount() { console.log('send/psbtWithHardwareWallet - componentDidMount'); } broadcast = () => { this.setState({ isLoading: true }, async () => { try { await BlueElectrum.ping(); await BlueElectrum.waitTillConnected(); let result = await this.state.fromWallet.broadcastTx(this.state.txhex); if (result) { console.log('broadcast result = ', result); EV(EV.enum.REMOTE_TRANSACTIONS_COUNT_CHANGED); // someone should fetch txs this.setState({ success: true, isLoading: false }); if (this.state.memo) { let txDecoded = bitcoin.Transaction.fromHex(this.state.txhex); const txid = txDecoded.getId(); BlueApp.tx_metadata[txid] = { memo: this.state.memo }; } } else { ReactNativeHapticFeedback.trigger('notificationError', { ignoreAndroidSystemSettings: false }); this.setState({ isLoading: false }); alert('Broadcast failed'); } } catch (error) { ReactNativeHapticFeedback.trigger('notificationError', { ignoreAndroidSystemSettings: false }); this.setState({ isLoading: false }); alert(error.message); } }); }; _renderScanner() { return ( (this.cameraRef = ref)} style={{ flex: 1, justifyContent: 'space-between' }} onBarCodeRead={this.onBarCodeRead} barCodeTypes={[RNCamera.Constants.BarCodeType.qr]} /> this.setState({ renderScanner: false })} > ); } _renderSuccess() { return ( ); } _renderBroadcastHex() { return ( {loc.send.create.this_is_hex} Clipboard.setString(this.state.txhex)}> Copy and broadcast later Linking.openURL('https://coinb.in/?verify=' + this.state.txhex)}> Verify on coinb.in ); } exportPSBT = async () => { if (Platform.OS === 'ios') { const filePath = RNFS.TemporaryDirectoryPath + `/${this.fileName}`; await RNFS.writeFile(filePath, this.state.isFirstPSBTAlreadyBase64 ? this.state.psbt : this.state.psbt.toBase64()); Share.open({ url: 'file://' + filePath, }) .catch(error => console.log(error)) .finally(() => { RNFS.unlink(filePath); }); } else if (Platform.OS === 'android') { const granted = await PermissionsAndroid.request(PermissionsAndroid.PERMISSIONS.WRITE_EXTERNAL_STORAGE, { title: 'BlueWallet Storage Access Permission', message: 'BlueWallet needs your permission to access your storage to save this transaction.', buttonNeutral: 'Ask Me Later', buttonNegative: 'Cancel', buttonPositive: 'OK', }); if (granted === PermissionsAndroid.RESULTS.GRANTED) { console.log('Storage Permission: Granted'); const filePath = RNFS.ExternalCachesDirectoryPath + `/${this.fileName}`; await RNFS.writeFile(filePath, this.state.isFirstPSBTAlreadyBase64 ? this.state.psbt : this.state.psbt.toBase64()); alert(`This transaction has been saved in ${filePath}`); } else { console.log('Storage Permission: Denied'); } } }; openSignedTransaction = async () => { try { const res = await DocumentPicker.pick({ type: Platform.OS === 'ios' ? ['io.bluewallet.psbt', 'io.bluewallt.psbt.txn'] : [DocumentPicker.types.allFiles], }); const file = await RNFS.readFile(res.uri); if (file) { this.setState({ isSecondPSBTAlreadyBase64: true }, () => this.onBarCodeRead({ data: file })); } else { this.setState({ isSecondPSBTAlreadyBase64: false }); throw new Error(); } } catch (err) { if (!DocumentPicker.isCancel(err)) { alert('The selected file does not contain a signed transaction that can be imported.'); } } }; render() { if (this.state.isLoading) { return ( ); } if (this.state.success) return this._renderSuccess(); if (this.state.renderScanner) return this._renderScanner(); if (this.state.txhex) return this._renderBroadcastHex(); return ( This is partially signed bitcoin transaction (PSBT). Please finish signing it with your hardware wallet. this.setState({ renderScanner: true })} title={'Scan Signed Transaction'} /> ); } } PsbtWithHardwareWallet.propTypes = { navigation: PropTypes.shape({ goBack: PropTypes.func, getParam: PropTypes.func, navigate: PropTypes.func, dismiss: PropTypes.func, state: PropTypes.shape({ params: PropTypes.shape({ memo: PropTypes.string, fromWallet: PropTypes.shape({ fromAddress: PropTypes.string, fromSecret: PropTypes.string, }), }), }), }), };