update timer dragable modal

android/app/build.gradle

@@ -134,6 +134,7 @@ android {
         versionCode 1
         versionName "1.0"
         missingDimensionStrategy 'react-native-camera', 'general'
+        multiDexEnabled true
     }
     splits {
         abi {
@@ -190,6 +191,7 @@ android {
 }
 
 dependencies {
+    implementation project(':react-native-reanimated')
     implementation project(':react-native-svg')
     implementation fileTree(dir: "libs", include: ["*.jar"])
     implementation "com.facebook.react:react-native:+"  // From node_modules
@@ -201,6 +203,7 @@ dependencies {
     } else {
       implementation jscFlavor
     }
+    implementation 'com.android.support:multidex:1.0.3'
 }
 
 // Run this once to be able to run the application with BUCK

android/build.gradle

@@ -11,6 +11,7 @@ buildscript {
     repositories {
         google()
         jcenter()
+        maven { url "https://maven.google.com" }
     }
     dependencies {
         classpath("com.android.tools.build:gradle:3.4.1")

android/settings.gradle

 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'
 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)

components/MeterCard.js

@@ -10,6 +10,7 @@ class MeterCard extends Component {
 		return Platform.OS === 'android' ? (
 			<BaseButton onPress={this.props.onPressEachCard} rippleColor={'#fcc5c5'} style={styles.cardContainer}>
 				<View
+					accessible
 					style={[
 						styles.meterOn,
 						{ 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({
 		fontFamily: 'Avenir-Roman',
 		color: color.grey,
 	},
+	modalText: {
+		fontSize: 17,
+		fontFamily: 'Avenir-Roman',
+		color: color.grey,
+	},
+	modalBtnText: {
+		fontSize: 20,
+		fontFamily: 'Avenir-Roman',
+		fontWeight: '600',
+	},
 	description: {
 		fontSize: 12,
 		fontFamily: 'Avenir-Roman',

ios/Podfile

@@ -31,6 +31,8 @@ target 'rn_safetcutapp' do
 
   pod 'RNSVG', :path => '../node_modules/react-native-svg'
 
+  pod 'RNReanimated', :path => '../node_modules/react-native-reanimated'
+
   target 'rn_safetcutappTests' do
     inherit! :search_paths
     # Pods for testing

package.json

@@ -27,8 +27,10 @@
 		"react-native-elements": "^1.1.0",
 		"react-native-gesture-handler": "^1.3.0",
 		"react-native-linear-gradient": "^2.5.4",
+		"react-native-modalbox": "^1.7.1",
 		"react-native-permissions": "^1.2.0",
 		"react-native-picker-select": "^6.3.0",
+		"react-native-reanimated": "^1.2.0",
 		"react-native-svg": "^9.7.1",
 		"react-native-svg-charts": "^5.3.0",
 		"react-native-swipe-list-view": "^2.0.0",

screens/Private/SmartMeterScreen/SmartMeterDetailScreen.js

 import React, { Component } from 'react';
 import { View, Text, Content, Card, Row, Right, Left, Switch, Icon } from 'native-base';
 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 { connect } from 'react-redux';
 import { getCurrentSelectedData } from '../../../reduxStore/actions/currentSelectedAction';
@@ -97,7 +97,7 @@ class SmartMeterDetailScreen extends Component {
 		const { name, description, rcbo, isOnline, isPowerOn } = this.state;
 		return (
 			<Card style={{ padding: 15, marginBottom: 20, borderRadius: 10, borderColor: color.white }}>
-				<Row>
+				<Row style={{ justifyContent: 'center', alignItems: 'center' }}>
 					<Left>
 						<Text style={[theme.smallTitle, { color: color.darkGrey }]}>{name}</Text>
 					</Left>
@@ -188,7 +188,14 @@ class SmartMeterDetailScreen extends Component {
 				);
 
 			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>
 						<Left style={{ flex: 4 }}>
 							<View>
@@ -214,7 +221,10 @@ class SmartMeterDetailScreen extends Component {
 
 		return (
 			<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 }}>
 						<Text style={[theme.normalText, theme.textDark]}>
 							{mcbLink.name
@@ -321,6 +331,6 @@ const styles = StyleSheet.create({
 	},
 	mcbExpand: {
 		fontSize: 18,
-		color: color.darkGrey,
+		color: color.grey,
 	},
 });

screens/Public/AuthLoadingScreen.js

@@ -35,6 +35,8 @@ class AuthLoadingScreen extends Component {
 		try {
 			app.auth().onAuthStateChanged(async user => {
 				if (user) {
+					const idToken = await app.auth().currentUser.getIdToken(/* forceRefresh */ true);
+					console.log(idToken);
 					await this.props.getCurrentUser(user);
 					this.props.navigation.navigate(RememberedLogin === 'true' ? 'Main' : 'Login');
 				} else {

yarn.lock

@@ -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"
   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:
   version "1.2.0"
   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:
     lodash "^4.17.4"
     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:
   version "0.14.6"
   resolved "https://registry.yarnpkg.com/react-native-safe-area-view/-/react-native-safe-area-view-0.14.6.tgz#9a9d37d9f8f3887d60c4076eae7b5d2319539446"