Commit 569e3fcb authored by Thibaut Sardan's avatar Thibaut Sardan
Browse files

fix(): update RNC NetInfo api

parent a6f0d1bd
......@@ -28,7 +28,7 @@ export default class SecurityHeader extends React.Component {
return (
<Subscribe to={[SecurityStore]}>
{securityStore => (
<SecurityHeaderView level={securityStore.getLevel()} />
<SecurityHeaderView isConnected={securityStore.isConnected()} />
)}
</Subscribe>
);
......@@ -37,22 +37,17 @@ export default class SecurityHeader extends React.Component {
class _SecurityHeaderView extends React.PureComponent {
render() {
const { level } = this.props;
const color = {
green: colors.bg_positive,
red: colors.bg_alert
}[level];
const { isConnected } = this.props;
const message = {
green: 'Secure',
red: 'Not Secure'
}[level];
if (!isConnected) {
return null
}
return (
<TouchableItem onPress={() => this.props.navigation.navigate('Security')}>
<View style={{ flexDirection: 'row', alignItems: 'center' }}>
<Icon style={[styles.headerSecureIcon, { color }]} name="security" />
<Text style={[styles.headerTextRight, { color }]}>{message}</Text>
<Icon style={styles.headerSecureIcon} name="security" />
<Text style={styles.headerTextRight}>Not Secure</Text>
</View>
</TouchableItem>
);
......@@ -65,14 +60,14 @@ const styles = StyleSheet.create({
fontSize: 20,
fontWeight: 'bold',
paddingRight: 5,
color: colors.bg_text_positive
color: colors.bg_alert
},
headerTextRight: {
marginLeft: 0,
fontSize: 17,
fontFamily: 'Roboto',
fontWeight: 'bold',
color: colors.bg_text_positive,
color: colors.bg_alert,
paddingRight: 14,
}
});
......
......@@ -17,68 +17,23 @@
import React from 'react';
import { ScrollView, StyleSheet, Text, View } from 'react-native';
import Icon from 'react-native-vector-icons/MaterialIcons';
import { Subscribe } from 'unstated';
import colors from '../colors';
import SecurityStore from '../stores/SecurityStore';
export default class Security extends React.PureComponent {
render() {
return (
<Subscribe to={[SecurityStore]}>
{securityStore => <SecurityView level={securityStore.getLevel()} />}
</Subscribe>
);
}
}
class SecurityView extends React.PureComponent {
render() {
const { level } = this.props;
const backgroundColor = {
green: colors.bg_positive,
red: colors.bg_alert
}[level];
const message = {
green: 'Secure',
red: 'Not Secure'
}[level];
return (
<ScrollView style={styles.body} contentContainerStyle={{ padding: 20 }}>
<Text style={styles.title}>YOUR DEVICE IS</Text>
<View style={[styles.card, { backgroundColor, marginBottom: 20 }]}>
<View style={[styles.card, { backgroundColor: colors.bg_alert, marginBottom: 20 }]}>
<Icon
style={[styles.cardText, { marginRight: 10, fontSize: 30 }]}
name="security"
/>
<Text style={styles.cardText}>{message}</Text>
</View>
<Text style={styles.title}>DEVICE SECURITY</Text>
<View style={styles.headerContainer}>
<Icon
style={[styles.headerSecureIcon, { color: colors.bg_positive }]}
name="security"
/>
<Text style={[styles.headerTextRight, { color: colors.bg_positive }]}>
Secure
</Text>
<Text style={styles.cardText}>NOT SECURE</Text>
</View>
<Text style={styles.text}>
A device is considered secure if it does not have any internet access.
</Text>
<View style={styles.headerContainer}>
<Icon
style={[styles.headerSecureIcon, { color: colors.bg_alert }]}
name="security"
/>
<Text style={[styles.headerTextRight, { color: colors.bg_alert }]}>
Not Secure
</Text>
</View>
<Text style={styles.text}>
A device is considered not secure if it has access to the internet. We recommend not keeping high balances
on this device.
A device is considered not secure if it has access to the internet or has any king of connectivity enabled.
Parity Signer is meant to be used on a device that will be kept offline any time. Enabling any kind of connectivity, such as
Wifi, Cellular, Bluetooth, NFC, USB is a threat to the safety of the private keys stored on the device.
</Text>
</ScrollView>
);
......@@ -118,23 +73,4 @@ const styles = StyleSheet.create({
fontSize: 14,
color: colors.card_bg
},
headerContainer: {
marginBottom: 15,
flexDirection: 'row',
alignItems: 'center'
},
headerSecureIcon: {
marginLeft: 0,
fontSize: 20,
fontWeight: 'bold',
paddingRight: 5,
color: colors.bg_text_positive
},
headerTextRight: {
marginLeft: 0,
fontSize: 17,
fontFamily: 'Roboto',
fontWeight: 'bold',
color: colors.bg_text_positive
}
});
......@@ -18,31 +18,25 @@
import NetInfo from '@react-native-community/netinfo';
import { Container } from 'unstated';
type SecurityState = {
signedTxs: Map<string, Object>
};
export default class SecurityStore extends Container<SecurityState> {
export default class SecurityStore extends Container {
state = {
level: 'green'
isConnected: false
};
constructor(...args) {
super(...args);
this.connectionChangeListener = this.connectionChangeListener.bind(this);
NetInfo.addEventListener('connectionChange', this.connectionChangeListener);
NetInfo.getConnectionInfo().then(this.connectionChangeListener);
// Subscribe
const unsubscribe = NetInfo.addEventListener(state => {
this.setState({ isConnected: state.isConnected });
});
}
connectionChangeListener(connectionInfo) {
if (connectionInfo.type !== 'none') {
this.setState({ level: 'red' });
} else {
this.setState({ level: 'green' });
}
componentWillUnmount() {
// Unsubscribe
// this.unsubscribe();
}
getLevel() {
return this.state.level;
isConnected() {
return this.state.isConnected;
}
}
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment