Skip to content

S
safetcut-app
Commit 2390aad6 by HaOuiha
Options

some update

parent 1429360d
Showing with 121 additions and 208 deletions
AppNavigation.js
...@@ -42,11 +42,13 @@ import SendEmailScreen from './screens/Public/SendEmailScreen'; ...@@ -42,11 +42,13 @@ import SendEmailScreen from './screens/Public/SendEmailScreen';
import ProfileScreen from './screens/Private/ProfileScreen/ProfileScreen'; import ProfileScreen from './screens/Private/ProfileScreen/ProfileScreen';
const defaultNavigationOptions = { const defaultNavigationOptions = {
headerStyle: { headerStyle: [
{
backgroundColor: color.primary, backgroundColor: color.primary,
borderColor: 'transparent', borderColor: 'transparent',
height: 80,
}, },
Platform.OS === 'ios' && { height: 80 },
],
headerTintColor: '#fff', headerTintColor: '#fff',
headerTitleStyle: { headerTitleStyle: {
fontSize: 18, fontSize: 18,
......
components/MeterCard.js
import React, { Component } from 'react'; import React from 'react';
import { View, Row, Icon, Text } from 'native-base'; import { View, Row, Icon, Text } from 'native-base';
import { Image, StyleSheet, Platform } from 'react-native'; import { Image, StyleSheet, Platform } from 'react-native';
import { BaseButton, TouchableOpacity } from 'react-native-gesture-handler'; import { BaseButton, TouchableOpacity } from 'react-native-gesture-handler';
import { color, theme } from '../constants/Styles'; import { color, theme } from '../constants/Styles';
import { connect } from 'react-redux';
import { getCurrentSelectedShadow } from '../reduxStore/actions/currentSelectedAction';
class MeterCard extends Component { const MeterCard = ({ item, onPressEachCard }) => {
state = { const renderContent = () => (
isPowerOn: false, <>
};
getShadow = () => {
// const deviceId = this.props.item.deviceId;
this.props.getCurrentSelectedShadow();
};
componentDidMount = async () => {
console.log('meter props', this.props);
};
componentDidUpdate = async (prevProps, prevState) => {
if (prevProps.item !== this.props.item) {
this.getShadow();
}
if (prevProps.shadow !== this.props.shadow) {
this.setInitState();
}
};
setInitState = () => {
const { shadow } = this.props;
this.setState({
isPowerOn: shadow.SM1.BK_S,
});
};
render() {
const { item } = this.props;
const { isPowerOn } = this.state;
return Platform.OS === 'android' ? (
<BaseButton onPress={this.props.onPressEachCard} rippleColor={'#fcc5c5'} style={styles.cardContainer}>
<View <View
accessible
style={[ style={[
styles.meterOn, styles.meterOn,
{ backgroundColor: isPowerOn === 1 ? 'rgba(65, 204, 0, 0.59)' : 'rgba(223, 0, 0, 0.59)' }, {
backgroundColor: item.breakerStatus === 1 ? 'rgba(65, 204, 0, 0.59)' : 'rgba(223, 0, 0, 0.59)',
},
]} ]}
> >
<Text style={[theme.description, theme.textWhite]}>{isPowerOn === 1 ? 'ON' : 'OFF'}</Text> <Text style={[theme.description, theme.textWhite]}>{item.breakerStatus === 1 ? 'ON' : 'OFF'}</Text>
</View> </View>
<View style={[theme.centerContainer]}> <View style={[theme.centerContainer]}>
{item.img ? ( {item.img ? (
<Image source={{ uri: this.props.img }} style={styles.meterImgStyle} /> <Image source={{ uri: item.img }} style={styles.meterImgStyle} />
) : ( ) : (
<View <View style={[styles.meterImgStyle, { flex: 1, justifyContent: 'center', alignContent: 'center' }]}>
style={[
styles.meterImgStyle,
{ flex: 1, justifyContent: 'center', alignContent: 'center' },
]}
>
<Text style={{ fontSize: 10 }}>No Img</Text> <Text style={{ fontSize: 10 }}>No Img</Text>
</View> </View>
)} )}
...@@ -80,68 +47,21 @@ class MeterCard extends Component { ...@@ -80,68 +47,21 @@ class MeterCard extends Component {
<Icon name={item.isSharing ? 'users' : 'user'} type="FontAwesome" style={styles.iconStyle} /> <Icon name={item.isSharing ? 'users' : 'user'} type="FontAwesome" style={styles.iconStyle} />
<View style={[styles.online, { backgroundColor: item.isOnline ? '#10ca88' : color.primary }]} /> <View style={[styles.online, { backgroundColor: item.isOnline ? '#10ca88' : color.primary }]} />
</View> </View>
</>
);
return Platform.OS === 'android' ? (
<BaseButton onPress={onPressEachCard} rippleColor={'#fcc5c5'} style={styles.cardContainer}>
{renderContent()}
</BaseButton> </BaseButton>
) : ( ) : (
<TouchableOpacity onPress={this.props.onPressEachCard} style={styles.cardContainer}> <TouchableOpacity onPress={onPressEachCard} style={styles.cardContainer}>
<View {renderContent()}
style={[
styles.meterOn,
{ backgroundColor: isPowerOn === 1 ? 'rgba(65, 204, 0, 0.59)' : 'rgba(223, 0, 0, 0.59)' },
]}
>
<Text style={[theme.description, theme.textWhite]}>{isPowerOn === 1 ? 'ON' : 'OFF'}</Text>
</View>
<View style={[theme.centerContainer]}>
{item.img ? (
<Image source={{ uri: item.img }} style={styles.meterImgStyle} />
) : (
<View
style={[
styles.meterImgStyle,
{ flex: 1, justifyContent: 'center', alignContent: 'center' },
]}
>
<Text style={{ fontSize: 10 }}>No Img</Text>
</View>
)}
</View>
<View style={[theme.containerWithPadding, { flex: 2 }]}>
<Row style={{ alignItems: 'center' }}>
<Text style={[theme.smallTitle, { marginRight: 15 }]}>{item.name}</Text>
</Row>
<Text style={[theme.description]} numberOfLines={2}>
{item.description}
</Text>
<Row style={{ marginTop: 10 }}>
<View style={[styles.meterIconCover]}>
<Icon name="ios-notifications-outline" style={styles.meterIconStyle} />
</View>
<View style={styles.meterIconCover}>
<Icon name="md-alarm" style={styles.meterIconStyle} />
</View>
</Row>
</View>
<View style={[theme.rowContainer, { position: 'absolute', top: 10, right: 5 }]}>
<Icon name="wifi" type="FontAwesome" style={styles.iconStyle} />
<Icon name={item.isSharing ? 'users' : 'user'} type="FontAwesome" style={styles.iconStyle} />
<View style={[styles.online, { backgroundColor: item.isOnline ? '#10ca88' : color.primary }]} />
</View>
</TouchableOpacity> </TouchableOpacity>
); );
}
}
const mapStateToProps = state => ({
shadow: state.currentSelectedDeviceReducer.shadow,
});
const mapDispatchToProps = {
getCurrentSelectedShadow,
}; };
export default connect( export default MeterCard;
mapStateToProps,
mapDispatchToProps
)(MeterCard);
const styles = StyleSheet.create({ const styles = StyleSheet.create({
meterOn: { meterOn: {
......
firebase.js
...@@ -12,8 +12,9 @@ const app = firebase.initializeApp({ ...@@ -12,8 +12,9 @@ const app = firebase.initializeApp({
messagingSenderId: '716807932076', messagingSenderId: '716807932076',
}); });
export default app;
const fireStore = app.firestore(); const fireStore = app.firestore();
export { fireStore }; const baseURL = 'https://us-central1-safetcut-20cdf.cloudfunctions.net';
export default app;
export { fireStore, baseURL };
reduxStore/actions/allMainDeviceAction.js
import { fireStore } from '../../firebase'; import app, { fireStore, baseURL } from '../../firebase';
import axios from 'axios';
import _ from 'lodash';
export const GET_ALL_MAIN_DEVICE_INFO = 'GET_ALL_MAIN_DEVICE_INFO'; export const GET_ALL_MAIN_DEVICE_INFO = 'GET_ALL_MAIN_DEVICE_INFO';
export const GET_ALL_MAIN_DEVICE_INFO_LOADING = 'GET_ALL_MAIN_DEVICE_INFO_LOADING'; export const GET_ALL_MAIN_DEVICE_INFO_LOADING = 'GET_ALL_MAIN_DEVICE_INFO_LOADING';
...@@ -47,8 +49,11 @@ export const getAllMainDeviceInfo = () => async (dispatch, getState) => { ...@@ -47,8 +49,11 @@ export const getAllMainDeviceInfo = () => async (dispatch, getState) => {
.get(); .get();
let ownerDeviceInfoData = await ownerDeviceInfo.data(); let ownerDeviceInfoData = await ownerDeviceInfo.data();
const breakerStatus = await getBreakerStatus(deviceId);
allMainDeviceInfoData.push(Object.assign(ownerDeviceInfoData, { deviceId, isSharing: false })); allMainDeviceInfoData.push(
Object.assign(ownerDeviceInfoData, { deviceId, isSharing: false, breakerStatus })
);
}) })
); );
...@@ -60,14 +65,46 @@ export const getAllMainDeviceInfo = () => async (dispatch, getState) => { ...@@ -60,14 +65,46 @@ export const getAllMainDeviceInfo = () => async (dispatch, getState) => {
.get(); .get();
let sharingDeviceInfoData = await sharingDeviceInfo.data(); let sharingDeviceInfoData = await sharingDeviceInfo.data();
const breakerStatus = await getBreakerStatus(deviceId);
allMainDeviceInfoData.push(Object.assign(sharingDeviceInfoData, { deviceId, isSharing: true })); allMainDeviceInfoData.push(
Object.assign(sharingDeviceInfoData, { deviceId, isSharing: true, breakerStatus })
);
}) })
); );
dispatch(getAllMainDeviceInfoAction(allMainDeviceInfoData)); const sortedAllMainDeviceInfoData = _.orderBy(
allMainDeviceInfoData,
['breakerStatus', 'name', 'isSharing'],
['desc', 'asc', 'asc']
);
dispatch(getAllMainDeviceInfoAction(sortedAllMainDeviceInfoData));
} catch (error) { } catch (error) {
dispatch(errorAction(error.message || error || 'Error')); dispatch(errorAction(error.message || error || 'Error'));
} }
dispatch(loadingAction(false)); dispatch(loadingAction(false));
}; };
const getBreakerStatus = async deviceId => {
const URL = `${baseURL}/shadow/${deviceId}`;
const idToken = await app.auth().currentUser.getIdToken(true);
const options = {
headers: { Authorization: `Token ${idToken}` },
url: URL,
};
try {
const {
data: {
shadow: { value },
},
} = await axios(options);
const tempBreakerStatus = _.pick(value, ['SM1']);
const breakerStatus = tempBreakerStatus.SM1.BK_S;
return breakerStatus;
} catch (e) {
// console.log(e || 'error');
return 0;
}
};
reduxStore/actions/currentSelectedAction.js
import app, { fireStore } from '../../firebase'; import app, { fireStore, baseURL } from '../../firebase';
import axios from 'axios'; import axios from 'axios';
import _ from 'lodash'; import _ from 'lodash';
import { getExistedConnectedDeviceAction } from './timersAction'; import { getExistedConnectedDeviceAction } from './timersAction';
const baseURL = 'https://us-central1-safetcut-20cdf.cloudfunctions.net';
export const GET_CURRENT_SELECTED_DATA = 'GET_CURRENT_SELECTED_DATA'; export const GET_CURRENT_SELECTED_DATA = 'GET_CURRENT_SELECTED_DATA';
export const GET_CURRENT_SELECTED_DATA_LOADING = 'GET_CURRENT_SELECTED_DATA_LOADING'; export const GET_CURRENT_SELECTED_DATA_LOADING = 'GET_CURRENT_SELECTED_DATA_LOADING';
export const GET_CURRENT_SELECTED_DATA_ERROR = 'GET_CURRENT_SELECTED_DATA_ERROR'; export const GET_CURRENT_SELECTED_DATA_ERROR = 'GET_CURRENT_SELECTED_DATA_ERROR';
...@@ -44,12 +42,12 @@ export const setDesiredSahdowAction = desiredBreakerStatus => ({ ...@@ -44,12 +42,12 @@ export const setDesiredSahdowAction = desiredBreakerStatus => ({
desiredBreakerStatus, desiredBreakerStatus,
}); });
export const getCurrentSelectedShadow = () => async (dispatch, getState) => { export const getCurrentSelectedShadow = deviceId => async (dispatch, getState) => {
const { currentSelectedDeviceReducer } = getState(); const { currentSelectedDeviceReducer } = getState();
const { currentSelectedData } = currentSelectedDeviceReducer; const { currentSelectedData } = currentSelectedDeviceReducer;
const selectedDeviceId = currentSelectedData.deviceId; const selectedDeviceId = currentSelectedData.deviceId;
const URL = `${baseURL}/shadow/${selectedDeviceId}`; const URL = `${baseURL}/shadow/${deviceId || selectedDeviceId}`;
const idToken = await app.auth().currentUser.getIdToken(true); const idToken = await app.auth().currentUser.getIdToken(true);
const options = { const options = {
headers: { Authorization: `Token ${idToken}` }, headers: { Authorization: `Token ${idToken}` },
......
screens/Private/ProfileScreen/ProfileScreen.js
...@@ -5,7 +5,6 @@ import { HeaderButtons, Item } from 'react-navigation-header-buttons'; ...@@ -5,7 +5,6 @@ import { HeaderButtons, Item } from 'react-navigation-header-buttons';
import IoniconsHeaderButton from '../../../components/IoniconsHeaderButton'; import IoniconsHeaderButton from '../../../components/IoniconsHeaderButton';
import { theme, color } from '../../../constants/Styles'; import { theme, color } from '../../../constants/Styles';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { hidden } from 'ansi-colors';
import { width } from '../../../constants/Layout'; import { width } from '../../../constants/Layout';
import { isIphoneX } from '../../../utils/isPhoneX'; import { isIphoneX } from '../../../utils/isPhoneX';
......
screens/Private/SettingScreen/Setting.js
...@@ -52,7 +52,7 @@ class updateDetailScreen extends Component { ...@@ -52,7 +52,7 @@ class updateDetailScreen extends Component {
toggleModal = visible => this.setState({ isVisible: visible }); toggleModal = visible => this.setState({ isVisible: visible });
confirm = () => { handleConfirm = () => {
this.props.updateDetail(this.state.field, this.state.data); this.props.updateDetail(this.state.field, this.state.data);
this.toggleModal(false); this.toggleModal(false);
this.props.navigation.navigate('Setting'); this.props.navigation.navigate('Setting');
...@@ -65,17 +65,7 @@ class updateDetailScreen extends Component { ...@@ -65,17 +65,7 @@ class updateDetailScreen extends Component {
<Text style={[theme.description, theme.mt2, { marginLeft: 25, color: '#a8a8a8' }]}> <Text style={[theme.description, theme.mt2, { marginLeft: 25, color: '#a8a8a8' }]}>
{breaker.toUpperCase()} {breaker.toUpperCase()}
</Text> </Text>
<View <View style={[styles.editFieldContainer, theme.mt2]}>
style={[
{
backgroundColor: color.white,
paddingHorizontal: 30,
paddingTop: 10,
paddingBottom: 20,
},
theme.mt2,
]}
>
<Text style={[theme.normalText, theme.textDark]}>{field}</Text> <Text style={[theme.normalText, theme.textDark]}>{field}</Text>
{this.state.field === 'RCBO' ? ( {this.state.field === 'RCBO' ? (
<> <>
...@@ -85,12 +75,7 @@ class updateDetailScreen extends Component { ...@@ -85,12 +75,7 @@ class updateDetailScreen extends Component {
minimumValue={0} minimumValue={0}
maximumValue={2} maximumValue={2}
step={1} step={1}
thumbStyle={{ thumbStyle={styles.thumbStyle}
width: 20,
height: 20,
borderWidth: 3,
borderColor: 'rgba(238, 84, 84, 0.2)',
}}
trackStyle={{ height: 2, backgroundColor: color.lightGrey }} trackStyle={{ height: 2, backgroundColor: color.lightGrey }}
minimumTrackTintColor={color.lightRed} minimumTrackTintColor={color.lightRed}
maximumTrackTintColor={color.lightGrey} maximumTrackTintColor={color.lightGrey}
...@@ -98,16 +83,7 @@ class updateDetailScreen extends Component { ...@@ -98,16 +83,7 @@ class updateDetailScreen extends Component {
onSlidingComplete={value => this.setState({ indexData: value })} onSlidingComplete={value => this.setState({ indexData: value })}
/> />
</View> </View>
<View <View style={styles.labelContainer}>
style={{
flex: 1,
flexDirection: 'row',
justifyContent: 'space-between',
alignItems: 'center',
marginTop: 8,
marginHorizontal: 15,
}}
>
{this.state.rcboOptions.map((item, index) => ( {this.state.rcboOptions.map((item, index) => (
<Text <Text
key={`label${item.value}`} key={`label${item.value}`}
...@@ -125,15 +101,7 @@ class updateDetailScreen extends Component { ...@@ -125,15 +101,7 @@ class updateDetailScreen extends Component {
</View> </View>
</> </>
) : ( ) : (
<View <View style={styles.textInputContainer}>
style={{
marginHorizontal: Platform.OS === 'android' ? -5 : 0,
paddingTop: Platform.OS === 'android' ? 0 : 10,
paddingBottom: Platform.OS === 'android' ? 0 : 10,
borderBottomWidth: 1,
borderColor: '#efefef',
}}
>
<TextInput <TextInput
multiline={true} multiline={true}
style={[theme.description, { fontSize: 14 }]} style={[theme.description, { fontSize: 14 }]}
...@@ -143,17 +111,7 @@ class updateDetailScreen extends Component { ...@@ -143,17 +111,7 @@ class updateDetailScreen extends Component {
</View> </View>
)} )}
</View> </View>
<Button <Button full style={styles.saveButton} onPress={() => this.toggleModal(true)}>
full
style={{
backgroundColor: color.primary,
width: width * 0.75,
alignSelf: 'center',
borderRadius: 100,
marginTop: 40,
}}
onPress={() => this.toggleModal(true)}
>
<Text style={[theme.normalText, theme.textWhite]}>SAVE</Text> <Text style={[theme.normalText, theme.textWhite]}>SAVE</Text>
</Button> </Button>
<Overlay <Overlay
...@@ -172,7 +130,7 @@ class updateDetailScreen extends Component { ...@@ -172,7 +130,7 @@ class updateDetailScreen extends Component {
<Button transparent style={{ width: '40%' }} onPress={() => this.toggleModal(false)}> <Button transparent style={{ width: '40%' }} onPress={() => this.toggleModal(false)}>
<Text style={{ color: color.grey }}>CANCEL</Text> <Text style={{ color: color.grey }}>CANCEL</Text>
</Button> </Button>
<Button style={styles.saveBtn} rounded onPress={() => this.confirm()}> <Button style={styles.saveButtonModal} rounded onPress={() => this.handleConfirm()}>
<Text>SAVE</Text> <Text>SAVE</Text>
</Button> </Button>
</View> </View>
...@@ -198,27 +156,40 @@ const styles = StyleSheet.create({ ...@@ -198,27 +156,40 @@ const styles = StyleSheet.create({
alignItems: 'center', alignItems: 'center',
justifyContent: 'space-around', justifyContent: 'space-around',
}, },
saveBtn: { saveButtonModal: {
width: '40%', width: '40%',
backgroundColor: color.primary, backgroundColor: color.primary,
color: color.white, color: color.white,
justifyContent: 'center', justifyContent: 'center',
borderRadius: 100, borderRadius: 100,
}, },
container: { editFieldContainer: {
backgroundColor: color.white,
paddingHorizontal: 30,
paddingTop: 10,
paddingBottom: 20,
},
thumbStyle: { width: 20, height: 20, borderWidth: 3, borderColor: 'rgba(238, 84, 84, 0.2)' },
labelContainer: {
flex: 1, flex: 1,
justifyContent: 'center', flexDirection: 'row',
justifyContent: 'space-between',
alignItems: 'center', alignItems: 'center',
backgroundColor: '#F5FCFF', marginTop: 8,
marginHorizontal: 15,
}, },
welcome: { textInputContainer: {
fontSize: 20, marginHorizontal: Platform.OS === 'android' ? -5 : 0,
textAlign: 'center', paddingTop: Platform.OS === 'android' ? 0 : 10,
margin: 10, paddingBottom: Platform.OS === 'android' ? 0 : 10,
borderBottomWidth: 1,
borderColor: '#efefef',
},
saveButton: {
backgroundColor: color.primary,
width: width * 0.75,
alignSelf: 'center',
borderRadius: 100,
marginTop: 40,
}, },
snapsliderContainer: {},
snapslider: {},
snapsliderItemWrapper: {},
snapsliderItem: {},
}); });
screens/Private/SettingScreen/SettingScreen.js
import React, { Component } from 'react'; import React, { Component } from 'react';
import { View, StyleSheet, TouchableOpacity } from 'react-native'; import { View, StyleSheet, TouchableOpacity, TouchableHighlight } from 'react-native';
import { ListItem, Body, Text, Icon, Right, Switch, List } from 'native-base'; import { ListItem, Body, Text, Icon, Right, Switch, List } from 'native-base';
import { theme, color } from '../../../constants/Styles'; import { theme, color } from '../../../constants/Styles';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { Overlay } from 'react-native-elements'; import { Overlay } from 'react-native-elements';
import { TouchableHighlight } from 'react-native-gesture-handler';
import { updateDetail } from '../../../reduxStore/actions/currentSelectedAction'; import { updateDetail } from '../../../reduxStore/actions/currentSelectedAction';
// import { TouchableHighlight } from 'react-native-gesture-handler';
class SettingScreen extends Component { class SettingScreen extends Component {
static navigationOptions = ({ navigation }) => ({ static navigationOptions = ({ navigation }) => ({
......
screens/Private/SettingScreen/ShareEmailScreen.js
import React, { Component } from 'react'; import React, { Component } from 'react';
import { Text, List, ListItem, Body, Button } from 'native-base'; import { Text, Button } from 'native-base';
import { color, theme } from '../../../constants/Styles'; import { color, theme } from '../../../constants/Styles';
import { View, StyleSheet, TextInput } from 'react-native'; import { View, StyleSheet, TextInput } from 'react-native';
import { HeaderButtons, Item } from 'react-navigation-header-buttons'; import { HeaderButtons, Item } from 'react-navigation-header-buttons';
...@@ -25,20 +25,18 @@ export default class ShareEmailScreen extends Component { ...@@ -25,20 +25,18 @@ export default class ShareEmailScreen extends Component {
email: '', email: '',
}; };
toggleModal(visible) { toggleModal = visible => this.setState({ isVisible: visible });
this.setState({
isVisible: visible, submitSuccess = () => {
});
}
submitSuccess() {
console.log('Submit Success!'); console.log('Submit Success!');
this.toggleModal(true); this.toggleModal(true);
} };
submit = values => { submit = values => {
this.submitSuccess(); this.submitSuccess();
this.setState({ email: values.email }); this.setState({ email: values.email });
}; };
render() { render() {
const { email, isVisible } = this.state; const { email, isVisible } = this.state;
return ( return (
...@@ -51,22 +49,15 @@ export default class ShareEmailScreen extends Component { ...@@ -51,22 +49,15 @@ export default class ShareEmailScreen extends Component {
width={'90%'} width={'90%'}
overlayStyle={styles.overlayStyle} overlayStyle={styles.overlayStyle}
isVisible={isVisible} isVisible={isVisible}
onBackdropPress={() => { onBackdropPress={() => this.toggleModal(false)}
this.toggleModal(!isVisible);
}}
> >
<> <>
<Text style={[theme.normalText, theme.textDark, theme.centerText, { marginHorizontal: 30 }]}> <Text style={[theme.normalText, theme.textDark, theme.centerText, { marginHorizontal: 30 }]}>
Are you sure to share this device with {email}? {`Are you sure to share this device
with ${email}?`}
</Text> </Text>
<View style={{ flexDirection: 'row', justifyContent: 'space-between' }}> <View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
<Button <Button transparent style={{ width: '40%' }} onPress={() => this.toggleModal(false)}>
transparent
style={{ width: '40%' }}
onPress={() => {
this.toggleModal(!isVisible);
}}
>
<Text style={{ color: color.grey }}>CANCEL</Text> <Text style={{ color: color.grey }}>CANCEL</Text>
</Button> </Button>
<Button style={styles.saveBtn} onPress={this.save} rounded> <Button style={styles.saveBtn} onPress={this.save} rounded>
......
screens/Private/SmartMeterScreen/McbLinkScreen.js
...@@ -153,7 +153,7 @@ class McbLinkScreen extends React.Component { ...@@ -153,7 +153,7 @@ class McbLinkScreen extends React.Component {
<View style={[theme.rowContainer, theme.mt2, { justifyContent: 'space-between' }]}> <View style={[theme.rowContainer, theme.mt2, { justifyContent: 'space-between' }]}>
<Text style={[theme.normalText, theme.textDark]}>Logging</Text> <Text style={[theme.normalText, theme.textDark]}>Logging</Text>
<Icon name="md-funnel" style={theme.normalText}></Icon> <Icon name="md-funnel" style={theme.normalText} />
</View> </View>
</View> </View>
); );
...@@ -228,7 +228,7 @@ class McbLinkScreen extends React.Component { ...@@ -228,7 +228,7 @@ class McbLinkScreen extends React.Component {
); );
} }
}} }}
ItemSeparatorComponent={() => <View style={{ margin: 5 }}></View>} ItemSeparatorComponent={() => <View style={{ margin: 5 }} />}
keyExtractor={({ item, index }) => { keyExtractor={({ item, index }) => {
`elec${index}`; `elec${index}`;
}} }}
...@@ -415,11 +415,7 @@ class McbLinkScreen extends React.Component { ...@@ -415,11 +415,7 @@ class McbLinkScreen extends React.Component {
style={[styles.addModal]} style={[styles.addModal]}
position={'bottom'} position={'bottom'}
isOpen={this.state.isAddElectronicVisible} isOpen={this.state.isAddElectronicVisible}
onClosed={() => onClosed={() => this.setState({ isAddElectronicVisible: false })}
this.setState({
isAddElectronicVisible: false,
})
}
> >
{this.renderAddModal()} {this.renderAddModal()}
</Modal> </Modal>
......
screens/Private/SmartMeterScreen/SmartMeterScreen.js
...@@ -41,9 +41,7 @@ class SmartMeterScreen extends PureComponent { ...@@ -41,9 +41,7 @@ class SmartMeterScreen extends PureComponent {
componentDidMount = async () => { componentDidMount = async () => {
await this.getData(); await this.getData();
this._isMounted = true; this._isMounted = true;
this.setState({ this.setState({ data: this.props.allMainDeviceInfo });
data: this.props.allMainDeviceInfo,
});
}; };
componentDidUpdate = (prevProps, prevState) => { componentDidUpdate = (prevProps, prevState) => {
...@@ -120,7 +118,7 @@ class SmartMeterScreen extends PureComponent { ...@@ -120,7 +118,7 @@ class SmartMeterScreen extends PureComponent {
style={[theme.container]} style={[theme.container]}
contentContainerStyle={[theme.containerWithPadding, { paddingBottom: isIphoneX() ? 90 : 55 }]} //iPhoneX BottomSpace = 34 contentContainerStyle={[theme.containerWithPadding, { paddingBottom: isIphoneX() ? 90 : 55 }]} //iPhoneX BottomSpace = 34
data={data} data={data}
extraData={this.props} extraData={this.props || this.state}
keyExtractor={(item, index) => item.deviceId} keyExtractor={(item, index) => item.deviceId}
ItemSeparatorComponent={() => <View style={theme.mt1} />} ItemSeparatorComponent={() => <View style={theme.mt1} />}
ListEmptyComponent={() => ( ListEmptyComponent={() => (
......
Markdown is supported
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