mirrors/BlueWallet
1
0
Fork 0
mirror of https://github.com/BlueWallet/BlueWallet.git synced 2025-02-23 23:27:26 +01:00
Code Issues Projects Releases Packages Wiki Activity

REF: RBF screen can scroll, fix for small devices

Browse source
This commit is contained in:
ncoelho 2020-05-14 21:22:22 +02:00 • committed by Overtorment
parent 5e5d7ee4f3
commit f078d20851
1 changed files with 82 additions and 77 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

159
BlueComponents.js
View file

@ -22,6 +22,7 @@ import {
Platform,
FlatList,
TextInput,
ScrollView,
} from 'react-native';
import LinearGradient from 'react-native-linear-gradient';
import { LightningCustodianWallet, PlaceholderWallet } from './class';
@ -2090,86 +2091,90 @@ export class BlueReplaceFeeSuggestions extends Component {
render() {
return (
<View>
{this.state.networkFees && (
<>
<BlueText>Suggestions</BlueText>
<TouchableOpacity onPress={() => this.onFeeSelected(NetworkTransactionFeeType.FAST)}>
<BlueListItem
title={'Fast'}
rightTitle={`${this.state.networkFees.fastestFee} sat/b`}
{...(this.state.selectedFeeType === NetworkTransactionFeeType.FAST
? { rightIcon: <Icon name="check" type="font-awesome" color="#0c2550" /> }
: { hideChevron: true })}
/>
</TouchableOpacity>
<TouchableOpacity onPress={() => this.onFeeSelected(NetworkTransactionFeeType.MEDIUM)}>
<BlueListItem
title={'Medium'}
rightTitle={`${this.state.networkFees.halfHourFee} sat/b`}
{...(this.state.selectedFeeType === NetworkTransactionFeeType.MEDIUM
? { rightIcon: <Icon name="check" type="font-awesome" color="#0c2550" /> }
: { hideChevron: true })}
/>
</TouchableOpacity>
<TouchableOpacity onPress={() => this.onFeeSelected(NetworkTransactionFeeType.SLOW)}>
<BlueListItem
title={'Slow'}
rightTitle={`${this.state.networkFees.hourFee} sat/b`}
{...(this.state.selectedFeeType === NetworkTransactionFeeType.SLOW
? { rightIcon: <Icon name="check" type="font-awesome" color="#0c2550" /> }
: { hideChevron: true })}
/>
</TouchableOpacity>
</>
)}
<TouchableOpacity onPress={() => this.customTextInput.focus()}>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', marginLeft: 18, marginRight: 18, alignItems: 'center' }}>
<Text style={{ color: BlueApp.settings.foregroundColor, fontSize: 16, fontWeight: '500' }}>Custom</Text>
<View
style={{
flexDirection: 'row',
minHeight: 44,
height: 44,
minWidth: 48,
alignItems: 'center',
justifyContent: 'flex-end',
marginVertical: 8,
}}
>
<TextInput
onChangeText={this.onCustomFeeTextChange}
keyboardType={'numeric'}
value={this.state.customFeeValue}
ref={ref => (this.customTextInput = ref)}
maxLength={9}
<ScrollView contentContainerStyle={{ flex: 1 }}>
<View>
{this.state.networkFees && (
<>
<BlueText>Suggestions</BlueText>
<TouchableOpacity onPress={() => this.onFeeSelected(NetworkTransactionFeeType.FAST)}>
<BlueListItem
title={'Fast'}
rightTitle={`${this.state.networkFees.fastestFee} sat/b`}
{...(this.state.selectedFeeType === NetworkTransactionFeeType.FAST
? { rightIcon: <Icon name="check" type="font-awesome" color="#0c2550" /> }
: { hideChevron: true })}
/>
</TouchableOpacity>
<TouchableOpacity onPress={() => this.onFeeSelected(NetworkTransactionFeeType.MEDIUM)}>
<BlueListItem
title={'Medium'}
rightTitle={`${this.state.networkFees.halfHourFee} sat/b`}
{...(this.state.selectedFeeType === NetworkTransactionFeeType.MEDIUM
? { rightIcon: <Icon name="check" type="font-awesome" color="#0c2550" /> }
: { hideChevron: true })}
/>
</TouchableOpacity>
<TouchableOpacity onPress={() => this.onFeeSelected(NetworkTransactionFeeType.SLOW)}>
<BlueListItem
title={'Slow'}
rightTitle={`${this.state.networkFees.hourFee} sat/b`}
{...(this.state.selectedFeeType === NetworkTransactionFeeType.SLOW
? { rightIcon: <Icon name="check" type="font-awesome" color="#0c2550" /> }
: { hideChevron: true })}
/>
</TouchableOpacity>
</>
)}
<TouchableOpacity onPress={() => this.customTextInput.focus()}>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', marginLeft: 18, marginRight: 18, alignItems: 'center' }}>
<Text style={{ color: BlueApp.settings.foregroundColor, fontSize: 16, fontWeight: '500' }}>Custom</Text>
<View
style={{
borderColor: '#d2d2d2',
borderBottomColor: '#d2d2d2',
borderWidth: 1.0,
borderBottomWidth: 0.5,
borderRadius: 4,
minHeight: 33,
maxWidth: 100,
minWidth: 44,
backgroundColor: '#f5f5f5',
textAlign: 'right',
flexDirection: 'row',
minHeight: 44,
height: 44,
minWidth: 48,
alignItems: 'center',
justifyContent: 'flex-end',
marginVertical: 8,
}}
onFocus={() => this.onCustomFeeTextChange(this.state.customFeeValue)}
defaultValue={`${this.props.transactionMinimum}`}
placeholder="Custom sat/b"
inputAccessoryViewID={BlueDismissKeyboardInputAccessory.InputAccessoryViewID}
/>
<Text style={{ color: BlueApp.settings.alternativeTextColor, marginHorizontal: 8 }}>sat/b</Text>
{this.state.selectedFeeType === NetworkTransactionFeeType.CUSTOM && <Icon name="check" type="font-awesome" color="#0c2550" />}
>
<TextInput
onChangeText={this.onCustomFeeTextChange}
keyboardType={'numeric'}
value={this.state.customFeeValue}
ref={ref => (this.customTextInput = ref)}
maxLength={9}
style={{
borderColor: '#d2d2d2',
borderBottomColor: '#d2d2d2',
borderWidth: 1.0,
borderBottomWidth: 0.5,
borderRadius: 4,
minHeight: 33,
maxWidth: 100,
minWidth: 44,
backgroundColor: '#f5f5f5',
textAlign: 'right',
}}
onFocus={() => this.onCustomFeeTextChange(this.state.customFeeValue)}
defaultValue={`${this.props.transactionMinimum}`}
placeholder="Custom sat/b"
inputAccessoryViewID={BlueDismissKeyboardInputAccessory.InputAccessoryViewID}
/>
<Text style={{ color: BlueApp.settings.alternativeTextColor, marginHorizontal: 8 }}>sat/b</Text>
{this.state.selectedFeeType === NetworkTransactionFeeType.CUSTOM && (
<Icon name="check" type="font-awesome" color="#0c2550" />
)}
</View>
<BlueDismissKeyboardInputAccessory />
</View>
<BlueDismissKeyboardInputAccessory />
</View>
</TouchableOpacity>
<BlueText>
The total fee rate (satoshi per byte) you want to pay should be higher than {this.props.transactionMinimum} sat/byte
</BlueText>
</View>
</TouchableOpacity>
<BlueText>
The total fee rate (satoshi per byte) you want to pay should be higher than {this.props.transactionMinimum} sat/byte
</BlueText>
</View>
</ScrollView>
);
}
}