Skip to content

Commit

Permalink
Sending: update error style
Browse files Browse the repository at this point in the history
  • Loading branch information
@kaloudis
kaloudis committed Mar 12, 2023
1 parent 560612b commit 942ec43
Show file tree
Hide file tree
Showing 3 changed files with 113 additions and 120 deletions.
5 changes: 5 additions & 0 deletions assets/images/SVG/Error.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
147 changes: 68 additions & 79 deletions views/SendingLightning.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,21 +1,22 @@
import * as React from 'react';
import { Image, ScrollView, StyleSheet, Text, View } from 'react-native';
import { Image, StyleSheet, Text, View } from 'react-native';
import { inject, observer } from 'mobx-react';
import LnurlPaySuccess from './LnurlPay/Success';

import Button from './../components/Button';
import CopyButton from './../components/CopyButton';
import LightningIndicator from './../components/LightningIndicator';
import PaidIndicator from './../components/PaidIndicator';
import Button from '../components/Button';
import CopyButton from '../components/CopyButton';
import LightningIndicator from '../components/LightningIndicator';
import PaidIndicator from '../components/PaidIndicator';

import TransactionsStore from './../stores/TransactionsStore';
import LnurlPayStore from './../stores/LnurlPayStore';
import TransactionsStore from '../stores/TransactionsStore';
import LnurlPayStore from '../stores/LnurlPayStore';

import { localeString } from './../utils/LocaleUtils';
import { themeColor } from './../utils/ThemeUtils';
import { localeString } from '../utils/LocaleUtils';
import { themeColor } from '../utils/ThemeUtils';

import Success from './../assets/images/GIF/Success.gif';
import WordLogo from './../assets/images/SVG/Word Logo.svg';
import Error from '../assets/images/SVG/Error.svg';
import Success from '../assets/images/GIF/Success.gif';
import WordLogo from '../assets/images/SVG/Word Logo.svg';

interface SendingLightningProps {
navigation: any;
Expand All @@ -29,26 +30,6 @@ export default class SendingLightning extends React.Component<
SendingLightningProps,
{}
> {
getBackgroundColor() {
const { TransactionsStore } = this.props;
const { payment_route, payment_error, status, error } =
TransactionsStore;

if (error) {
return 'darkred';
} else if (
payment_route ||
status === 'complete' ||
status === 'SUCCEEDED'
) {
return themeColor('background');
} else if (payment_error && payment_error != '') {
return 'lightcoral';
}

return themeColor('background');
}

render() {
const { TransactionsStore, LnurlPayStore, navigation } = this.props;
const {
Expand All @@ -61,20 +42,20 @@ export default class SendingLightning extends React.Component<
payment_error,
status
} = TransactionsStore;
const backgroundColor = this.getBackgroundColor();
const success =
payment_route || status === 'complete' || status === 'SUCCEEDED';

return (
<ScrollView
<View
style={{
...styles.container,
backgroundColor
backgroundColor: themeColor('background')
}}
>
<View
style={{
...styles.content
...styles.content,
backgroundColor: themeColor('background')
}}
>
{loading && <LightningIndicator />}
Expand Down Expand Up @@ -109,34 +90,33 @@ export default class SendingLightning extends React.Component<
</>
)}
{(!!error || !!payment_error) && (
<Text
style={{
color: 'white',
fontFamily: 'Lato-Regular',
marginTop: 70,
padding: 20,
fontSize:
(payment_error || error_msg || '').length >
100
? 20
: 28
}}
>
{localeString('general.error')}:{' '}
{payment_error || error_msg}
</Text>
)}
{!!error && (
<Button
title=""
icon={{
name: 'error',
size: 125,
color: 'white'
}}
onPress={() => void 0}
iconOnly
/>
<>
<Error width="27%" />
<Text
style={{
color: '#FF9090',
fontFamily: 'Lato-Regular',
fontSize: 32
}}
>
{localeString('general.error')}
</Text>
<Text
style={{
color: 'white',
fontFamily: 'Lato-Regular',
padding: 20,
marginBottom: 60,
fontSize:
(payment_error || error_msg || '')
.length > 100
? 20
: 24
}}
>
{payment_error || error_msg}
</Text>
</>
)}
{!!success && !error && (
<Text
Expand Down Expand Up @@ -187,6 +167,27 @@ export default class SendingLightning extends React.Component<
</View>
)}

{(!!error || !!payment_error) && (
<Button
title={localeString('general.goBack')}
icon={{
name: 'arrow-back',
size: 25,
color: themeColor('background')
}}
titleStyle={{
color: themeColor('background')
}}
buttonStyle={{ width: '100%' }}
containerStyle={{
width: '100%',
marginBottom: 20
}}
onPress={() => navigation.goBack()}
adaptiveWidth
/>
)}

{(!!error || !!payment_error || !!success) && (
<Button
title={localeString(
Expand All @@ -195,29 +196,17 @@ export default class SendingLightning extends React.Component<
icon={{
name: 'list',
size: 25,
color:
!!error || !!payment_error
? 'darkred'
: backgroundColor
color: themeColor('background')
}}
onPress={() =>
navigation.navigate('Wallet', {
refresh: true
})
}
titleStyle={{
color:
!!error || !!payment_error
? 'darkred'
: backgroundColor
color: themeColor('background')
}}
buttonStyle={
!!error || !!payment_error
? {
backgroundColor: 'white'
}
: null
}
buttonStyle={{ width: '100%' }}
containerStyle={{ width: '100%' }}
/>
)}
Expand Down Expand Up @@ -264,7 +253,7 @@ export default class SendingLightning extends React.Component<
)}
</View>
</View>
</ScrollView>
</View>
);
}
}
Expand Down
81 changes: 40 additions & 41 deletions views/SendingOnChain.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ import UrlUtils from '../utils/UrlUtils';
import NodeInfoStore from '../stores/NodeInfoStore';
import TransactionsStore from '../stores/TransactionsStore';

import Error from '../assets/images/SVG/Error.svg';
import Success from '../assets/images/GIF/Success.gif';
import WordLogo from '../assets/images/SVG/Word Logo.svg';

Expand All @@ -28,17 +29,6 @@ export default class SendingOnChain extends React.Component<
SendingOnChainProps,
{}
> {
getBackgroundColor() {
const { TransactionsStore } = this.props;
const { error } = TransactionsStore;

if (error) {
return 'darkred';
}

return themeColor('background');
}

render() {
const { NodeInfoStore, TransactionsStore, navigation } = this.props;
const { loading, publishSuccess, error, error_msg, txid } =
Expand All @@ -49,7 +39,7 @@ export default class SendingOnChain extends React.Component<
<View
style={{
...styles.container,
backgroundColor: this.getBackgroundColor()
backgroundColor: themeColor('background')
}}
>
<View
Expand Down Expand Up @@ -87,6 +77,20 @@ export default class SendingOnChain extends React.Component<
/>
</>
)}
{(error || error_msg) && (
<>
<Error width="27%" />
<Text
style={{
color: '#FF9090',
fontFamily: 'Lato-Regular',
fontSize: 32
}}
>
{localeString('general.error')}
</Text>
</>
)}
{error && error_msg && (
<Text
style={{
Expand Down Expand Up @@ -133,22 +137,6 @@ export default class SendingOnChain extends React.Component<
</Text>
</TouchableOpacity>
)}
{error && (
<Button
title=""
icon={{
name: 'error',
size: 125,
color: 'white'
}}
buttonStyle={{
backgroundColor: 'transparent',
borderRadius: 30
}}
onPress={() => void 0}
iconOnly
/>
)}

<View style={styles.buttons}>
{txid && (
Expand All @@ -162,6 +150,27 @@ export default class SendingOnChain extends React.Component<
</View>
)}

{error && (
<Button
title={localeString('general.goBack')}
icon={{
name: 'arrow-back',
size: 25,
color: themeColor('background')
}}
titleStyle={{
color: themeColor('background')
}}
buttonStyle={{ width: '100%' }}
containerStyle={{
width: '100%',
marginBottom: 20
}}
onPress={() => navigation.goBack()}
adaptiveWidth
/>
)}

{(publishSuccess || error) && (
<Button
title={localeString(
Expand All @@ -170,22 +179,12 @@ export default class SendingOnChain extends React.Component<
icon={{
name: 'list',
size: 25,
color: publishSuccess
? themeColor('background')
: 'darkred'
color: themeColor('background')
}}
titleStyle={{
color: publishSuccess
? themeColor('background')
: 'darkred'
color: themeColor('background')
}}
buttonStyle={
publishSuccess
? null
: {
backgroundColor: 'white'
}
}
buttonStyle={{ width: '100%' }}
containerStyle={{ width: '100%' }}
onPress={() => navigation.navigate('Wallet')}
/>
Expand Down

0 comments on commit 942ec43

Please sign in to comment.