Skip to content

S
safetcut-app
Commit bdb82592 by HaOuiha
Options

update timer dragable modal

parent eb7e92e5
Showing with 241 additions and 65 deletions
android/app/build.gradle
...@@ -134,6 +134,7 @@ android { ...@@ -134,6 +134,7 @@ android {
versionCode 1 versionCode 1
versionName "1.0" versionName "1.0"
missingDimensionStrategy 'react-native-camera', 'general' missingDimensionStrategy 'react-native-camera', 'general'
multiDexEnabled true
} }
splits { splits {
abi { abi {
...@@ -190,6 +191,7 @@ android { ...@@ -190,6 +191,7 @@ android {
} }
dependencies { dependencies {
implementation project(':react-native-reanimated')
implementation project(':react-native-svg') implementation project(':react-native-svg')
implementation fileTree(dir: "libs", include: ["*.jar"]) implementation fileTree(dir: "libs", include: ["*.jar"])
implementation "com.facebook.react:react-native:+" // From node_modules implementation "com.facebook.react:react-native:+" // From node_modules
...@@ -201,6 +203,7 @@ dependencies { ...@@ -201,6 +203,7 @@ dependencies {
} else { } else {
implementation jscFlavor implementation jscFlavor
} }
implementation 'com.android.support:multidex:1.0.3'
} }
// Run this once to be able to run the application with BUCK // Run this once to be able to run the application with BUCK
......
android/build.gradle
...@@ -11,6 +11,7 @@ buildscript { ...@@ -11,6 +11,7 @@ buildscript {
repositories { repositories {
google() google()
jcenter() jcenter()
maven { url "https://maven.google.com" }
} }
dependencies { dependencies {
classpath("com.android.tools.build:gradle:3.4.1") classpath("com.android.tools.build:gradle:3.4.1")
......
android/settings.gradle
rootProject.name = 'rn_safetcutapp' rootProject.name = 'rn_safetcutapp'
include ':react-native-reanimated'
project(':react-native-reanimated').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-reanimated/android')
include ':react-native-svg' include ':react-native-svg'
project(':react-native-svg').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-svg/android') project(':react-native-svg').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-svg/android')
apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings) apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
......
components/MeterCard.js
...@@ -10,6 +10,7 @@ class MeterCard extends Component { ...@@ -10,6 +10,7 @@ class MeterCard extends Component {
return Platform.OS === 'android' ? ( return Platform.OS === 'android' ? (
<BaseButton onPress={this.props.onPressEachCard} rippleColor={'#fcc5c5'} style={styles.cardContainer}> <BaseButton onPress={this.props.onPressEachCard} rippleColor={'#fcc5c5'} style={styles.cardContainer}>
<View <View
accessible
style={[ style={[
styles.meterOn, styles.meterOn,
{ backgroundColor: item.isOn ? 'rgba(65, 204, 0, 0.59)' : 'rgba(223, 0, 0, 0.59)' }, { backgroundColor: item.isOn ? 'rgba(65, 204, 0, 0.59)' : 'rgba(223, 0, 0, 0.59)' },
......
constants/Styles.js
...@@ -59,6 +59,16 @@ export const theme = StyleSheet.create({ ...@@ -59,6 +59,16 @@ export const theme = StyleSheet.create({
fontFamily: 'Avenir-Roman', fontFamily: 'Avenir-Roman',
color: color.grey, color: color.grey,
}, },
modalText: {
fontSize: 17,
fontFamily: 'Avenir-Roman',
color: color.grey,
},
modalBtnText: {
fontSize: 20,
fontFamily: 'Avenir-Roman',
fontWeight: '600',
},
description: { description: {
fontSize: 12, fontSize: 12,
fontFamily: 'Avenir-Roman', fontFamily: 'Avenir-Roman',
......
ios/Podfile
...@@ -31,6 +31,8 @@ target 'rn_safetcutapp' do ...@@ -31,6 +31,8 @@ target 'rn_safetcutapp' do
pod 'RNSVG', :path => '../node_modules/react-native-svg' pod 'RNSVG', :path => '../node_modules/react-native-svg'
pod 'RNReanimated', :path => '../node_modules/react-native-reanimated'
target 'rn_safetcutappTests' do target 'rn_safetcutappTests' do
inherit! :search_paths inherit! :search_paths
# Pods for testing # Pods for testing
......
screens/Private/SmartMeterScreen/SmartMeterDetailScreen.js
import React, { Component } from 'react'; import React, { Component } from 'react';
import { View, Text, Content, Card, Row, Right, Left, Switch, Icon } from 'native-base'; import { View, Text, Content, Card, Row, Right, Left, Switch, Icon } from 'native-base';
import { color, theme } from '../../../constants/Styles'; import { color, theme } from '../../../constants/Styles';
import { FlatList, StyleSheet, ActivityIndicator, RefreshControl, ScrollView } from 'react-native'; import { FlatList, StyleSheet, ActivityIndicator, RefreshControl, ScrollView, Platform } from 'react-native';
import { TouchableOpacity } from 'react-native-gesture-handler'; import { TouchableOpacity } from 'react-native-gesture-handler';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { getCurrentSelectedData } from '../../../reduxStore/actions/currentSelectedAction'; import { getCurrentSelectedData } from '../../../reduxStore/actions/currentSelectedAction';
...@@ -97,7 +97,7 @@ class SmartMeterDetailScreen extends Component { ...@@ -97,7 +97,7 @@ class SmartMeterDetailScreen extends Component {
const { name, description, rcbo, isOnline, isPowerOn } = this.state; const { name, description, rcbo, isOnline, isPowerOn } = this.state;
return ( return (
<Card style={{ padding: 15, marginBottom: 20, borderRadius: 10, borderColor: color.white }}> <Card style={{ padding: 15, marginBottom: 20, borderRadius: 10, borderColor: color.white }}>
<Row> <Row style={{ justifyContent: 'center', alignItems: 'center' }}>
<Left> <Left>
<Text style={[theme.smallTitle, { color: color.darkGrey }]}>{name}</Text> <Text style={[theme.smallTitle, { color: color.darkGrey }]}>{name}</Text>
</Left> </Left>
...@@ -188,7 +188,14 @@ class SmartMeterDetailScreen extends Component { ...@@ -188,7 +188,14 @@ class SmartMeterDetailScreen extends Component {
); );
return ( return (
<View style={[theme.containerWithPadding, { backgroundColor: 'rgba(216,216,216,0.1)' }]}> <View
style={{
paddingVertical: 15,
paddingLeft: 15,
paddingRight: Platform.OS === 'android' ? 7 : 15,
backgroundColor: 'rgba(216,216,216,0.1)',
}}
>
<Row> <Row>
<Left style={{ flex: 4 }}> <Left style={{ flex: 4 }}>
<View> <View>
...@@ -214,7 +221,10 @@ class SmartMeterDetailScreen extends Component { ...@@ -214,7 +221,10 @@ class SmartMeterDetailScreen extends Component {
return ( return (
<View> <View>
<Row style={{ padding: 7 }} onPress={handleOnPressMcbLink}> <Row
style={{ paddingVertical: 7, paddingLeft: 7, paddingRight: Platform.OS === 'android' ? 12 : 7 }}
onPress={handleOnPressMcbLink}
>
<Left style={{ flex: 4 }}> <Left style={{ flex: 4 }}>
<Text style={[theme.normalText, theme.textDark]}> <Text style={[theme.normalText, theme.textDark]}>
{mcbLink.name {mcbLink.name
...@@ -321,6 +331,6 @@ const styles = StyleSheet.create({ ...@@ -321,6 +331,6 @@ const styles = StyleSheet.create({
}, },
mcbExpand: { mcbExpand: {
fontSize: 18, fontSize: 18,
color: color.darkGrey, color: color.grey,
}, },
}); });
screens/Private/TimerScreen/TimerScreen.android.js
import React, { PureComponent } from 'react'; import React, { PureComponent } from 'react';
import { Icon, Text } from 'native-base'; import { Icon, Text, Switch, Button } from 'native-base';
import { import {
View, View,
StyleSheet, StyleSheet,
...@@ -8,12 +8,9 @@ import { ...@@ -8,12 +8,9 @@ import {
Modal, Modal,
TouchableOpacity, TouchableOpacity,
Platform, Platform,
TouchableNativeFeedback,
RefreshControl, RefreshControl,
TouchableNativeFeedback,
} from 'react-native'; } from 'react-native';
import { Switch, Button, Col, Row } from 'native-base';
// import { HeaderButtons, Item as HeaderItem } from 'react-navigation-header-buttons';
// import IoniconsHeaderButton from '../../../components/IoniconsHeaderButton';
import { color, theme } from '../../../constants/Styles'; import { color, theme } from '../../../constants/Styles';
import RNPickerSelect from 'react-native-picker-select'; import RNPickerSelect from 'react-native-picker-select';
import { Badge, CheckBox, SearchBar } from 'react-native-elements'; import { Badge, CheckBox, SearchBar } from 'react-native-elements';
...@@ -32,6 +29,7 @@ import { ...@@ -32,6 +29,7 @@ import {
deleteTimer, deleteTimer,
} from '../../../reduxStore/actions/timersAction'; } from '../../../reduxStore/actions/timersAction';
import moment from 'moment'; import moment from 'moment';
import Modal2 from 'react-native-modalbox';
const initTimeSetting = { const initTimeSetting = {
isActive: false, isActive: false,
...@@ -52,6 +50,7 @@ const initState = { ...@@ -52,6 +50,7 @@ const initState = {
...initTimeSetting, ...initTimeSetting,
isAddVisible: false, isAddVisible: false,
isfilterVisible: false, isfilterVisible: false,
isModalVisible: false,
search: '', search: '',
...@@ -165,6 +164,7 @@ class TimerScreen extends PureComponent { ...@@ -165,6 +164,7 @@ class TimerScreen extends PureComponent {
timer: saveTimer, timer: saveTimer,
repeatOn: this.state.repeatOn, repeatOn: this.state.repeatOn,
}; };
//Create MODE //Create MODE
if (isAddVisible) { if (isAddVisible) {
if (selectedBreaker === 'main') { if (selectedBreaker === 'main') {
...@@ -184,7 +184,6 @@ class TimerScreen extends PureComponent { ...@@ -184,7 +184,6 @@ class TimerScreen extends PureComponent {
//Edit MODE //Edit MODE
else if (isEditVisible) { else if (isEditVisible) {
this.props.editTimer(timerData); this.props.editTimer(timerData);
this.resetStateAndProps(); this.resetStateAndProps();
this.props.setEditModalVisible(false); this.props.setEditModalVisible(false);
} }
...@@ -225,7 +224,12 @@ class TimerScreen extends PureComponent { ...@@ -225,7 +224,12 @@ class TimerScreen extends PureComponent {
componentDidMount = () => { componentDidMount = () => {
this.props.navigation.setParams({ this.props.navigation.setParams({
headerRight: ( headerRight: (
<TouchableOpacity onPress={() => this.setState({ isAddVisible: true })}> <TouchableOpacity
onPress={() => {
this.setState({ isAddVisible: true });
// this.refs.modal.open();
}}
>
<View style={{ marginRight: 17 }}> <View style={{ marginRight: 17 }}>
<Icon name="ios-add" style={{ color: color.white }} /> <Icon name="ios-add" style={{ color: color.white }} />
</View> </View>
...@@ -241,17 +245,14 @@ class TimerScreen extends PureComponent { ...@@ -241,17 +245,14 @@ class TimerScreen extends PureComponent {
const { isAddVisible } = this.state; const { isAddVisible } = this.state;
const { isEditVisible, selectedTimerData } = this.props; const { isEditVisible, selectedTimerData } = this.props;
return ( return (
<Modal <>
transparent <View style={styles.dragIndicator} />
presentationStyle={'overFullScreen'}
animationType="slide"
visible={isAddVisible || isEditVisible}
>
<View style={styles.scrollContainer}>
<View <View
style={{ style={{
display: 'flex', display: 'flex',
paddingHorizontal: 25, marginTop: 30,
paddingHorizontal: 30,
marginBottom: 10,
flexDirection: 'row', flexDirection: 'row',
alignContent: 'stretch', alignContent: 'stretch',
justifyContent: 'space-between', justifyContent: 'space-between',
...@@ -272,19 +273,25 @@ class TimerScreen extends PureComponent { ...@@ -272,19 +273,25 @@ class TimerScreen extends PureComponent {
)} )}
</View> </View>
<ScrollView contentContainerStyle={{ paddingHorizontal: 25, paddingBottom: 20 }}> <ScrollView contentContainerStyle={{ paddingHorizontal: 30, paddingBottom: 20 }}>
<Text style={[theme.normalText, theme.textDark, theme.mt2]}>Set Time</Text> <Text style={[theme.modalText, theme.textDark, theme.mt2]}>Set Time</Text>
<DatePicker <DatePicker
date={this.state.timer} date={this.state.timer}
onDateChange={date => this.setState({ timer: date })} onDateChange={date => this.setState({ timer: date })}
mode="time" mode="time"
style={{ height: 100, display: 'flex', alignSelf: 'center' }} style={{
marginTop: 10,
height: 115,
display: 'flex',
alignSelf: 'center',
fontSize: 24,
}}
/> />
{isAddVisible && ( {isAddVisible && (
<> <>
<Text style={[theme.normalText, theme.textDark, theme.mt2]}>Select Breaker</Text> <Text style={[theme.modalText, theme.textDark, theme.mt2]}>Select Breaker</Text>
<View style={styles.selectBreakerStyle}> <View style={styles.selectBreakerStyle}>
<RNPickerSelect <RNPickerSelect
items={this.state.pickerSelectData} items={this.state.pickerSelectData}
...@@ -295,14 +302,17 @@ class TimerScreen extends PureComponent { ...@@ -295,14 +302,17 @@ class TimerScreen extends PureComponent {
placeholder={{ label: 'Select...', value: null }} placeholder={{ label: 'Select...', value: null }}
style={pickerStyle} style={pickerStyle}
Icon={() => ( Icon={() => (
<Icon name="ios-arrow-down" style={{ fontSize: 14, color: '#c8c8c8' }} /> <Icon
name="ios-arrow-down"
style={{ fontSize: 16, color: '#c8c8c8', marginBottom: 5 }}
/>
)} )}
/> />
</View> </View>
<FlatList <FlatList
style={theme.mt2} style={{ marginTop: 15 }}
data={this.state.subBreakerList} data={this.state.subBreakerList}
extradata={this.state.subBreakerList} extradata={this.state}
ItemSeparatorComponent={() => <View style={theme.mt1} />} ItemSeparatorComponent={() => <View style={theme.mt1} />}
renderItem={({ item, index }) => ( renderItem={({ item, index }) => (
<CheckBox <CheckBox
...@@ -329,8 +339,7 @@ class TimerScreen extends PureComponent { ...@@ -329,8 +339,7 @@ class TimerScreen extends PureComponent {
elementIndex === index elementIndex === index
? { ? {
...el, ...el,
selected: !this.state.subBreakerList[index] selected: !this.state.subBreakerList[index].selected,
.selected,
} }
: { ...el, selected: false } : { ...el, selected: false }
), ),
...@@ -343,36 +352,55 @@ class TimerScreen extends PureComponent { ...@@ -343,36 +352,55 @@ class TimerScreen extends PureComponent {
</> </>
)} )}
<View style={[styles.rowContainer, theme.mt2]}> <View
<Text style={[theme.normalText, theme.textDark]}>Power</Text> style={[
styles.rowContainer,
{ marginTop: 12 },
{ marginRight: Platform.OS === 'android' ? -4 : 0 },
]}
>
<Text style={[theme.modalText, theme.textDark]}>Power</Text>
<Switch value={this.state.isPowerOn} onValueChange={this.togglePower} /> <Switch value={this.state.isPowerOn} onValueChange={this.togglePower} />
</View> </View>
<View style={[styles.rowContainer, theme.mt2]}> <View style={[styles.rowContainer, theme.mt2, { marginRight: Platform.OS === 'android' ? -4 : 0 }]}>
<Text style={[theme.normalText, theme.textDark]}>Active</Text> <Text style={[theme.modalText, theme.textDark]}>Active</Text>
<Switch value={this.state.isActive} onValueChange={this.toggleActive} /> <Switch value={this.state.isActive} onValueChange={this.toggleActive} />
</View> </View>
<View style={theme.mt2}> <View style={theme.mt2}>
<Text style={[theme.normalText, theme.textDark, { marginBottom: 10 }]}>Repeat</Text> <Text style={[theme.modalText, theme.textDark, { marginBottom: 10 }]}>Repeat</Text>
<View style={styles.dayContainer}> <FlatList
{this.state.repeatOn.map((item, index) => { data={this.state.repeatOn}
extraData={this.props}
contentContainerStyle={[styles.dayContainer, { marginTop: 10 }]}
keyExtractor={(item, index) => `days${item.day}`}
renderItem={({ item, index }) => {
let dynamicColor = this.state.repeatOn[index].isRepeat ? color.primary : color.grey; let dynamicColor = this.state.repeatOn[index].isRepeat ? color.primary : color.grey;
return ( return (
<View style={{ borderRadius: 20, width: 40, height: 40 }}>
<TouchableNativeFeedback <TouchableNativeFeedback
key={`repeatOn${index}`}
onPress={() => this.toggleRepeatDays(index)} onPress={() => this.toggleRepeatDays(index)}
delayPressIn={0} background={TouchableNativeFeedback.Ripple(color.lightRed, true)}
> >
<View style={[styles.dayBtn, { borderColor: dynamicColor }]}> <View style={[styles.dayBtn, { borderColor: dynamicColor }]}>
<Text style={[theme.normalText, { color: dynamicColor }]}> <Text style={[theme.modalText, { color: dynamicColor }]}>
{item.day.substr(0, 1)} {item.day.substr(0, 1)}
</Text> </Text>
</View> </View>
</TouchableNativeFeedback> </TouchableNativeFeedback>
);
})}
</View> </View>
);
}}
/>
</View> </View>
<View style={[{ flexDirection: 'row', justifyContent: 'space-evenly' }, theme.mt2]}> <View
style={{
marginTop: 30,
marginBottom: 10,
flexDirection: 'row',
justifyContent: 'space-evenly',
alignSelf: 'flex-end',
}}
>
<Button <Button
transparent transparent
style={{ flex: 1, justifyContent: 'center' }} style={{ flex: 1, justifyContent: 'center' }}
...@@ -381,7 +409,9 @@ class TimerScreen extends PureComponent { ...@@ -381,7 +409,9 @@ class TimerScreen extends PureComponent {
this.props.setEditModalVisible(false); this.props.setEditModalVisible(false);
}} }}
> >
<Text style={{ color: color.grey }}>Cancel</Text> <Text uppercase={false} style={[theme.modalBtnText, { color: color.grey }]}>
Cancel
</Text>
</Button> </Button>
<Button <Button
rounded rounded
...@@ -392,12 +422,13 @@ class TimerScreen extends PureComponent { ...@@ -392,12 +422,13 @@ class TimerScreen extends PureComponent {
}} }}
onPress={this.createNewOrEditTimer} onPress={this.createNewOrEditTimer}
> >
<Text style={{ color: color.white }}>Confirm</Text> <Text uppercase={false} style={[theme.modalBtnText, { color: color.white }]}>
Confirm
</Text>
</Button> </Button>
</View> </View>
</ScrollView> </ScrollView>
</View> </>
</Modal>
); );
}; };
...@@ -405,17 +436,18 @@ class TimerScreen extends PureComponent { ...@@ -405,17 +436,18 @@ class TimerScreen extends PureComponent {
return ( return (
<> <>
{/* Overlay */} {/* Overlay */}
<Modal {/* <Modal
transparent transparent
presentationStyle={'overFullScreen'} presentationStyle={'overFullScreen'}
animationType="fade" animationType="fade"
visible={this.state.isfilterVisible || this.state.isAddVisible || this.props.isEditVisible} visible={this.state.isfilterVisible || this.state.isAddVisible || this.props.isEditVisible}
> >
<View style={{ width, height, backgroundColor: 'rgba(0,0,0,0.5)' }} /> <View style={{ width, height, backgroundColor: 'rgba(0,0,0,0.5)' }} />
</Modal> </Modal> */}
{/* Search Bar */} {/* Search Bar */}
<View style={{ padding: 15, flexDirection: 'row', alignItems: 'center' }}>
<View style={{ marginTop: 10, padding: 15, flexDirection: 'row', alignItems: 'center' }}>
<SearchBar <SearchBar
containerStyle={styles.searchBarContainer} containerStyle={styles.searchBarContainer}
inputContainerStyle={styles.searchBarInputContainer} inputContainerStyle={styles.searchBarInputContainer}
...@@ -445,14 +477,12 @@ class TimerScreen extends PureComponent { ...@@ -445,14 +477,12 @@ class TimerScreen extends PureComponent {
colors={[color.primary]} colors={[color.primary]}
/> />
} }
// refreshing={this.props.isLoading}
// onRefresh={this.getAllTimersData}
contentContainerStyle={{ paddingBottom: isIphoneX() ? 90 : 55 }} contentContainerStyle={{ paddingBottom: isIphoneX() ? 90 : 55 }}
data={this.state.allTimersData} data={this.state.allTimersData}
extraData={this.state} extraData={this.state}
ListEmptyComponent={() => ( ListEmptyComponent={() => (
<View> <View>
<Text style={[theme.normalText, theme.mt2]}>No timers</Text> <Text style={[theme.modalText, theme.mt2]}>No timers</Text>
</View> </View>
)} )}
ItemSeparatorComponent={() => <View style={styles.separator} />} ItemSeparatorComponent={() => <View style={styles.separator} />}
...@@ -463,7 +493,92 @@ class TimerScreen extends PureComponent { ...@@ -463,7 +493,92 @@ class TimerScreen extends PureComponent {
/> />
{/* Create & Update Timer Modal */} {/* Create & Update Timer Modal */}
<Modal
transparent
presentationStyle={'overFullScreen'}
animationType="fade"
visible={this.state.isAddVisible || this.props.isEditVisible}
>
<Modal2
swipeArea={45}
swipeThreshold={65}
backdropPressToClose={false}
style={[styles.modal]}
position={'bottom'}
isOpen={this.state.isAddVisible || this.props.isEditVisible}
onClosed={() => {
this.resetStateAndProps();
this.props.setEditModalVisible(false);
}}
>
{this.renderAddAndEditTimerModal()}
</Modal2>
</Modal>
{/* <CustomBottomSheet
visible={this.state.isAddVisible}
onVisibilityChange={() => {
this.setState(prevState => {
return { isAddVisible: !prevState };
});
}}
height={height * 0.9}
>
{this.renderAddAndEditTimerModal()}
</CustomBottomSheet> */}
{/* <SwipeablePanel
fullWidth
isActive={this.state.isAddVisible}
onClose={() => this.setState({ isAddVisible: false })}
openLarge={true}
// onPressCloseButton={() => this.setState({ isAddVisible: false })}
>
{this.renderAddAndEditTimerModal()}
</SwipeablePanel> */}
{/* <BottomDrawer
ref={this.bottomSheetRef}
containerHeight={height}
offset={TAB_BAR_HEIGHT + HEADER_HEIGHT}
>
{this.renderContent()}
</BottomDrawer> */}
{/* <View style={{ display: 'flex', felx: 1, backgroundColor: '#000' }}>
<BottomSheet
ref={this.bottomSheetRef}
snapPoints={[height * 0.9, 300, 0]}
initialSnap={1}
renderContent={this.renderInner}
renderHeader={this.renderHeader}
/>
<Button onPress={() => this.bottomSheetRef.current.snapTo(2)}>
<Text>Hello</Text>
</Button>
</View> */}
{/* <RBSheet
ref={ref => (this.RBSheet = ref)}
height={height * 0.9}
duration={250}
closeOnDragDown={true}
animationType="fade"
customStyles={{
container: {
justifyContent: 'center',
alignItems: 'center',
},
}}
>
{this.renderAddAndEditTimerModal()} {this.renderAddAndEditTimerModal()}
</RBSheet> */}
{/* <BottomSheet
ref={this.bs}
initialSnap={1}
snapPoints={[450, 300, 0]}
renderContent={this.renderAddAndEditTimerModal}
// renderHeader = {this.renderHeader}
/> */}
{/* {this.renderAddAndEditTimerModal()} */}
{/* Filter Modal */} {/* Filter Modal */}
<Modal <Modal
...@@ -522,7 +637,7 @@ class TimerScreen extends PureComponent { ...@@ -522,7 +637,7 @@ class TimerScreen extends PureComponent {
// extradata={this.state.selectedBreaker} // extradata={this.state.selectedBreaker}
ListEmptyComponent={() => ( ListEmptyComponent={() => (
<View> <View>
<Text style={[theme.normalText, theme.mt2]}>No Sub breaker</Text> <Text style={[theme.modalText, theme.mt2]}>No Sub breaker</Text>
</View> </View>
)} )}
ItemSeparatorComponent={() => <View style={theme.mt1} />} ItemSeparatorComponent={() => <View style={theme.mt1} />}
...@@ -561,11 +676,11 @@ class TimerScreen extends PureComponent { ...@@ -561,11 +676,11 @@ class TimerScreen extends PureComponent {
const mapStateToProps = state => ({ const mapStateToProps = state => ({
currentSelectedData: state.currentSelectedDeviceReducer.currentSelectedData, currentSelectedData: state.currentSelectedDeviceReducer.currentSelectedData,
existedData: state.timersReducer.existedData,
allTimers: state.timersReducer.allTimers, allTimers: state.timersReducer.allTimers,
selectedTimerData: state.timersReducer.selectedTimerData, selectedTimerData: state.timersReducer.selectedTimerData,
isLoading: state.timersReducer.isLoading, isLoading: state.timersReducer.isLoading,
isEditVisible: state.timersReducer.isEditVisible, isEditVisible: state.timersReducer.isEditVisible,
existedData: state.timersReducer.existedData,
}); });
const mapDispatchToProps = { const mapDispatchToProps = {
...@@ -588,14 +703,15 @@ const pickerStyle = { ...@@ -588,14 +703,15 @@ const pickerStyle = {
fontFamily: 'Avenir-Roman', fontFamily: 'Avenir-Roman',
}, },
iconContainer: { iconContainer: {
top: Platform.OS === 'android' ? 5 : undefined, top: Platform.OS === 'android' ? 7 : undefined,
right: 0, right: 0,
}, },
inputAndroid: { inputAndroid: {
height: 20, height: 22,
fontFamily: 'Avenir-Roman', fontFamily: 'Avenir-Roman',
fontSize: 14, fontSize: 16,
paddingVertical: 0, paddingVertical: 0,
marginTop: 4,
}, },
}; };
...@@ -637,27 +753,25 @@ const styles = StyleSheet.create({ ...@@ -637,27 +753,25 @@ const styles = StyleSheet.create({
dayContainer: { dayContainer: {
alignItems: 'center', alignItems: 'center',
flexDirection: 'row', flexDirection: 'row',
justifyContent: 'space-evenly', justifyContent: 'space-between',
}, },
dayBtn: { dayBtn: {
width: 35, width: 40,
height: 35, height: 40,
borderWidth: 1, borderWidth: 1,
borderRadius: 50, borderRadius: 20,
alignItems: 'center', alignItems: 'center',
justifyContent: 'center', justifyContent: 'center',
}, },
scrollContainer: { scrollContainer: {
flex: 0.9, flex: 0.9,
top: height * 0.1, top: height * 0.1,
paddingTop: 20, paddingTop: 30,
// paddingBottom: 30,
// paddingHorizontal: 25,
backgroundColor: '#fff', backgroundColor: '#fff',
borderTopLeftRadius: 10, borderTopLeftRadius: 10,
borderTopRightRadius: 10, borderTopRightRadius: 10,
alignContent: 'space-between', alignContent: 'space-between',
justifyContent: 'space-evenly', justifyContent: 'space-between',
}, },
timerInputContainer: { timerInputContainer: {
flex: 1, flex: 1,
...@@ -682,4 +796,20 @@ const styles = StyleSheet.create({ ...@@ -682,4 +796,20 @@ const styles = StyleSheet.create({
padding: 0, padding: 0,
margin: 0, margin: 0,
}, },
modal: {
borderTopLeftRadius: 10,
borderTopRightRadius: 10,
height: height * 0.9,
},
dragIndicator: {
marginTop: 10,
width: 50,
height: 5,
borderRadius: 3,
backgroundColor: color.grey,
display: 'flex',
alignSelf: 'center',
},
}); });
screens/Public/AuthLoadingScreen.js
...@@ -35,6 +35,8 @@ class AuthLoadingScreen extends Component { ...@@ -35,6 +35,8 @@ class AuthLoadingScreen extends Component {
try { try {
app.auth().onAuthStateChanged(async user => { app.auth().onAuthStateChanged(async user => {
if (user) { if (user) {
const idToken = await app.auth().currentUser.getIdToken(/* forceRefresh */ true);
console.log(idToken);
await this.props.getCurrentUser(user); await this.props.getCurrentUser(user);
this.props.navigation.navigate(RememberedLogin === 'true' ? 'Main' : 'Login'); this.props.navigation.navigate(RememberedLogin === 'true' ? 'Main' : 'Login');
} else { } else {
......
yarn.lock
...@@ -6070,6 +6070,14 @@ react-native-linear-gradient@^2.5.4: ...@@ -6070,6 +6070,14 @@ react-native-linear-gradient@^2.5.4:
resolved "https://registry.yarnpkg.com/react-native-linear-gradient/-/react-native-linear-gradient-2.5.6.tgz#96215cbc5ec7a01247a20890888aa75b834d44a0" resolved "https://registry.yarnpkg.com/react-native-linear-gradient/-/react-native-linear-gradient-2.5.6.tgz#96215cbc5ec7a01247a20890888aa75b834d44a0"
integrity sha512-HDwEaXcQIuXXCV70O+bK1rizFong3wj+5Q/jSyifKFLg0VWF95xh8XQgfzXwtq0NggL9vNjPKXa016KuFu+VFg== integrity sha512-HDwEaXcQIuXXCV70O+bK1rizFong3wj+5Q/jSyifKFLg0VWF95xh8XQgfzXwtq0NggL9vNjPKXa016KuFu+VFg==
react-native-modalbox@^1.7.1:
version "1.7.1"
resolved "https://registry.yarnpkg.com/react-native-modalbox/-/react-native-modalbox-1.7.1.tgz#cdb623ecd1cbe8699a450217c25b2d6666dc63e6"
integrity sha512-Jqn12MKQaT5OSb1uMAEeDQF02xHS+WWdgKl55ecoIknrDy+FIoC3fXHMEoRZH6agADDg9eVBqx8w+P7+EwXTbQ==
dependencies:
create-react-class "^15.6.0"
prop-types "^15.5.10"
react-native-permissions@^1.2.0: react-native-permissions@^1.2.0:
version "1.2.0" version "1.2.0"
resolved "https://registry.yarnpkg.com/react-native-permissions/-/react-native-permissions-1.2.0.tgz#0deb616bf1565c17c91f1cb1f953809b2892c29e" resolved "https://registry.yarnpkg.com/react-native-permissions/-/react-native-permissions-1.2.0.tgz#0deb616bf1565c17c91f1cb1f953809b2892c29e"
...@@ -6095,6 +6103,11 @@ react-native-ratings@^6.3.0: ...@@ -6095,6 +6103,11 @@ react-native-ratings@^6.3.0:
lodash "^4.17.4" lodash "^4.17.4"
prop-types "^15.5.10" prop-types "^15.5.10"
react-native-reanimated@^1.2.0:
version "1.2.0"
resolved "https://registry.yarnpkg.com/react-native-reanimated/-/react-native-reanimated-1.2.0.tgz#9219227a52a5dfa4d34c324596d6726ccd874293"
integrity sha512-vkWRHrPK5qfHP/ZawlRoo38oeYe9NZaaOH/lmFxRcsKzaSK6x3H5ZPXI8lK6MfTLveqwo1QhJje3zIKXO4nQQw==
react-native-safe-area-view@^0.14.1: react-native-safe-area-view@^0.14.1:
version "0.14.6" version "0.14.6"
resolved "https://registry.yarnpkg.com/react-native-safe-area-view/-/react-native-safe-area-view-0.14.6.tgz#9a9d37d9f8f3887d60c4076eae7b5d2319539446" resolved "https://registry.yarnpkg.com/react-native-safe-area-view/-/react-native-safe-area-view-0.14.6.tgz#9a9d37d9f8f3887d60c4076eae7b5d2319539446"
......
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