FIX: Updated RBF UI

This commit is contained in:
Marcos Rodriguez Vélez 2019-01-12 00:15:05 -05:00
parent 638d38070b
commit acbd05c635
2 changed files with 78 additions and 66 deletions

View file

@ -1,7 +1,8 @@
/** @type {AppStorage} */
/* global alert */
import React, { Component } from 'react';
import { TextInput } from 'react-native';
import { Text, FormValidationMessage } from 'react-native-elements';
import { TextInput, View, ActivtyIndicator } from 'react-native';
import { FormValidationMessage } from 'react-native-elements';
import {
BlueLoading,
BlueSpacing20,
@ -147,23 +148,21 @@ export default class SendCreate extends Component {
}
async broadcast() {
console.log('broadcasting', this.state.tx);
let result = await this.state.fromWallet.broadcastTx(this.state.tx);
console.log('broadcast result = ', result);
if (typeof result === 'string') {
result = JSON.parse(result);
}
if (result && result.error) {
this.setState({
broadcastErrorMessage: JSON.stringify(result.error),
broadcastSuccessMessage: '',
});
} else {
this.setState({ broadcastErrorMessage: '' });
this.setState({
broadcastSuccessMessage: 'Success! TXID: ' + JSON.stringify(result.result || result.txid),
});
}
this.setState({ isLoading: true }, async () => {
console.log('broadcasting', this.state.tx);
let result = await this.state.fromWallet.broadcastTx(this.state.tx);
console.log('broadcast result = ', result);
if (typeof result === 'string') {
result = JSON.parse(result);
}
if (result && result.error) {
alert(JSON.stringify(result.error));
this.setState({ isLoading: false });
} else {
alert(JSON.stringify(result.result || result.txid));
this.props.navigation.navigate('TransactionDetails');
}
});
}
render() {
@ -187,15 +186,11 @@ export default class SendCreate extends Component {
if (this.state.nonReplaceable) {
return (
<SafeBlueArea style={{ flex: 1, paddingTop: 20 }}>
<BlueSpacing20 />
<BlueSpacing20 />
<BlueSpacing20 />
<BlueSpacing20 />
<BlueSpacing20 />
<BlueText h4>This transaction is not replaceable</BlueText>
<BlueButton onPress={() => this.props.navigation.goBack()} title="Back" />
<View style={{ flex: 1, justifyContent: 'center', alignContent: 'center' }}>
<BlueText h4 style={{ textAlign: 'center' }}>
This transaction is not replaceable
</BlueText>
</View>
</SafeBlueArea>
);
}
@ -227,13 +222,11 @@ export default class SendCreate extends Component {
<BlueText>TX size: {this.state.size} Bytes</BlueText>
<BlueText>satoshiPerByte: {this.state.satoshiPerByte} Sat/B</BlueText>
</BlueCard>
<BlueButton icon={{ name: 'megaphone', type: 'octicon' }} onPress={() => this.broadcast()} title="Broadcast" />
<BlueButton icon={{ name: 'arrow-left', type: 'octicon' }} onPress={() => this.props.navigation.goBack()} title="Go back" />
<FormValidationMessage>{this.state.broadcastErrorMessage}</FormValidationMessage>
<Text style={{ padding: 20, color: '#080' }}>{this.state.broadcastSuccessMessage}</Text>
{this.state.isLoading ? (
<ActivtyIndicator />
) : (
<BlueButton icon={{ name: 'megaphone', type: 'octicon' }} onPress={() => this.broadcast()} title="Broadcast" />
)}
</SafeBlueArea>
);
}
@ -242,6 +235,7 @@ export default class SendCreate extends Component {
SendCreate.propTypes = {
navigation: PropTypes.shape({
goBack: PropTypes.function,
navigate: PropTypes.func,
state: PropTypes.shape({
params: PropTypes.shape({
address: PropTypes.string,

View file

@ -1,15 +1,6 @@
import React, { Component } from 'react';
import { ActivityIndicator, View } from 'react-native';
import {
BlueSpacing20,
BlueButton,
SafeBlueArea,
BlueCard,
BlueText,
BlueFormInput,
BlueSpacing,
BlueNavigationStyle,
} from '../../BlueComponents';
import { ActivityIndicator, View, TextInput } from 'react-native';
import { BlueSpacing20, BlueButton, SafeBlueArea, BlueCard, BlueText, BlueSpacing, BlueNavigationStyle } from '../../BlueComponents';
import PropTypes from 'prop-types';
import { SegwitBech32Wallet } from '../../class';
/** @type {AppStorage} */
@ -143,29 +134,56 @@ export default class RBF extends Component {
</BlueText>
<BlueSpacing20 />
<BlueFormInput
onChangeText={text => this.setState({ newDestinationAddress: text })}
placeholder={'receiver address here'}
value={this.state.newDestinationAddress}
/>
<View
style={{
flexDirection: 'row',
borderColor: '#d2d2d2',
borderBottomColor: '#d2d2d2',
borderWidth: 1.0,
borderBottomWidth: 0.5,
backgroundColor: '#f5f5f5',
minHeight: 44,
height: 44,
alignItems: 'center',
marginVertical: 8,
borderRadius: 4,
}}
>
<TextInput
onChangeText={text => this.setState({ newDestinationAddress: text })}
placeholder={'receiver address here'}
value={this.state.newDestinationAddress}
style={{ flex: 1, minHeight: 33, marginHorizontal: 8 }}
/>
</View>
<BlueFormInput
onChangeText={text => this.setState({ feeDelta: text })}
keyboardType={'numeric'}
placeholder={'fee to add (in BTC)'}
value={this.state.feeDelta + ''}
/>
<View
style={{
flexDirection: 'row',
borderColor: '#d2d2d2',
borderBottomColor: '#d2d2d2',
borderWidth: 1.0,
borderBottomWidth: 0.5,
backgroundColor: '#f5f5f5',
minHeight: 44,
height: 44,
alignItems: 'center',
marginVertical: 8,
borderRadius: 4,
}}
>
<TextInput
onChangeText={text => this.setState({ feeDelta: text })}
keyboardType={'numeric'}
placeholder={'fee to add (in BTC)'}
value={this.state.feeDelta + ''}
style={{ flex: 1, minHeight: 33, marginHorizontal: 8 }}
/>
</View>
</BlueCard>
<BlueSpacing />
<View style={{ flex: 1, flexDirection: 'row', paddingTop: 20 }}>
<View style={{ flex: 0.33 }}>
<BlueButton onPress={() => this.props.navigation.goBack()} title="Cancel" />
</View>
<View style={{ flex: 0.33 }} />
<View style={{ flex: 0.33 }}>
<BlueButton onPress={() => this.createTransaction()} title="Create" />
</View>
</View>
<BlueButton onPress={() => this.createTransaction()} title="Create" />
</SafeBlueArea>
);
}