Merge branch 'master' of https://github.com/CodetheChangeFoundation/U…

…HN-Mobile-App into restructure

components/README.md

@@ -130,7 +130,7 @@ Props:
   - type: string
 - variant: changes the keyboard type
   - optional
-  - type: one of "text", "email", "password", "number"
+  - type: one of "text", "password", "number"
   - default: "text"
 - hasError: set to true if the current input value is invalid. Invalid inputs have a red underline.
   - optional

components/drawer/DrawerContent.js

@@ -1,7 +1,6 @@
 import React, { Fragment } from "react";
-import { StyleSheet, AsyncStorage, TouchableOpacity } from "react-native";
+import { StyleSheet, AsyncStorage, TouchableOpacity, Image } from "react-native";
 import { Actions } from "react-native-router-flux";
-import { Modal } from "../popups";
 import { View } from "../layout";
 import { Button } from "../buttons";
 import { Text } from "../typography";
@@ -50,7 +49,7 @@ const DrawerContent = (props) => {
   return (
     <Fragment>
       <View style={styles.topContainer}>
-        <Text>Logo here</Text>
+        <Image source={require("../../assets/logo.png")} resizeMode="contain"></Image>
       </View>
       <View style={styles.bottomContainer}>
         <List style={styles.list}>

components/forms/Input.js

@@ -61,7 +61,7 @@ const Input = React.forwardRef((props, ref) => {
 
   return (
     <Fragment>
-    <Item floatingLabel {...combinedProps.item} last={props.last} style={combinedStyles.item}>
+    <Item floatingLabel {...combinedProps.item} last={props.last} style={[combinedStyles.item, props.itemStyle]}>
       <Label style={combinedStyles.label}>{props.label}</Label>
       <NBInput {...combinedProps} style={[combinedStyles.input, props.style]} getRef={ref}/>
         {(props.variant == "password") && ((passwordHidden)? 
@@ -79,7 +79,7 @@ const Input = React.forwardRef((props, ref) => {
 /* Prop Types */
 
 Input.propTypes = {
-  variant: PropTypes.oneOf([ "text", "email", "password", "number"]),
+  variant: PropTypes.oneOf([ "text", "password", "number"]),
   label: PropTypes.string.isRequired,
   hasNext: PropTypes.bool,
   hasError: PropTypes.bool,
@@ -106,10 +106,6 @@ const inputProps = {
     autoCapitalize: "none",
     autoCorrect: false,
   },
-  email: {
-    ...baseProps,
-    keyboardType: "email-address",
-  },
   number: {
     ...baseProps,
     keyboardType: (Platform.OS == "ios")? "numbers-and-punctuation" : "phone-pad",

screens/LoadingScreen.js

@@ -10,7 +10,7 @@ var jwtDecode = require("jwt-decode");
 import { Notifications } from "expo";
 import { tokenRedirect, setLocalLocation, receiveNotification } from "../store/actions";
 import { connect } from "react-redux";
-import { getDeviceLocation } from "../services/location-functions.service";
+import { getDeviceLocation, promptLocationPermissions } from "../services/location-functions.service";
 
 const LoadingScreen = props => {
   const fontsLoaded = false;
@@ -54,9 +54,8 @@ const LoadingScreen = props => {
       if (!isExpired) {
         // TODO: Set actual remember me
         props.tokenRedirect(decodedToken.id, token, false);
-        getDeviceLocation(coords => {
-          props.setLocalLocation({ coords });
-        });
+        // Prompt for location permissions but don't save it to redux.
+        await promptLocationPermissions();
         Actions.main();
       } else {
         Actions.auth();

screens/LocationScreen.js

@@ -172,6 +172,8 @@ const LocationScreen = (props) => {
                 onChangeText={text => { setAddressConfirm(false); setAddress(text) }}
                 placeholder="Enter Address"
                 value={address}
+                itemStyle={styles.inputItem}
+                style={styles.inputText}
                 onSubmitEditing={() => {
                     if(!addressConfirm) handleSearch()
                     notesInputRef._root.focus() }}
@@ -183,11 +185,13 @@ const LocationScreen = (props) => {
                 placeholder="note"
                 defaultValue={registeredNote}
                 value={note}
+                itemStyle={styles.inputItem}
+                style={styles.inputText}
                 onSubmitEditing={addressConfirm ? handleConfirm : handleSearch}
             />
             { registeredAddress ? (
             <React.Fragment>
-                <Text style={{marginVertical: 20, width: "80%", height: 20}}>Registered Location:</Text>
+                <Text style={{marginVertical: 20, width: "80%"}}>Registered Location:</Text>
                 <TouchableOpacity onPress={pickRegistered}>
                     <TextInput  editable={false}
                                 style={styles.clickableText}
@@ -196,7 +200,7 @@ const LocationScreen = (props) => {
                 </TouchableOpacity>
             </React.Fragment>
             ) : (
-                <Text style={{marginVertical: 20, width: "80%", height: 20}}>No Registered Location Found!</Text>
+                <Text style={{marginVertical: 20, width: "80%"}}>No Registered Location Found!</Text>
             )
         }
         </Form>
@@ -219,16 +223,23 @@ const styles = StyleSheet.create({
     height: "30%",
   },
   inputWrapper: {
-      width: "100%",
-      flex: 6,
+    width: "100%",
+    marginTop: 10,
+    flex: 5,
+  },
+  inputItem: {
+    marginLeft: 0,
+    marginTop: 0,
+  },
+  inputText: {
+    height: "auto",
+    top: 0,
+    paddingBottom: 0,
   },
   clickableText: {
-    height: 40,
     width: "100%",
     borderBottomColor: 'lightgrey',
     borderBottomWidth: 1,
-    padding: 10,
-    margin: 5,
     fontFamily: theme.fonts.body,
     fontSize: theme.fontSizes.medium,
     color: theme.colors.darkGrey,
@@ -237,8 +248,8 @@ const styles = StyleSheet.create({
     flex: 3,
   },
   rowFlex: {
-      display: 'flex',
-      flexDirection: 'row',
+    display: 'flex',
+    flexDirection: 'row',
   }
 });
 

screens/LoginScreen.js

@@ -8,7 +8,7 @@ import { Button, Switch } from "../components/buttons";
 import { Form, Input } from "../components/forms";
 import { connect } from 'react-redux';
 import { loginHandler, setLoading, setLocalLocation, setStatus } from '../store/actions';
-import { getDeviceLocation } from "../services/location-functions.service";
+import { getDeviceLocation, promptLocationPermissions } from "../services/location-functions.service";
 
 class LoginScreen extends Component {
 
@@ -29,11 +29,11 @@ class LoginScreen extends Component {
     }
   }
 
-  onLoginButtonPress = () => {
+  onLoginButtonPress = async () => {
     const { username, password, rememberMe } = this.state;
     console.log("[DEBUG] LOGIN Button pressed.");
     console.log("[DEBUG] username is " + username + ", password is " + password);
-    getDeviceLocation((coords) => { this.props.setLocalLocation({ coords }) })
+    await promptLocationPermissions();
     this.props.setLoading(true);
     this.props.loginHandler({ username: username, password: password }, rememberMe);
   }

screens/ProfileScreen.js

@@ -10,7 +10,6 @@ import theme from "../styles/base";
 
 const DEFAULT_USER_INFO = {
   username: "",
-  email: "",
   phone: ""
 };
 
@@ -46,11 +45,6 @@ const ProfileScreen = (props) => {
           <Text style={styles.value}>{userInfo.username}</Text>
         </View>
 
-        <View style={styles.row}>
-          <Text style={styles.attribute}>Email:</Text>
-          <Text style={styles.value}>{userInfo.email}</Text>
-        </View>
-
         <View style={styles.row}>
           <Text style={styles.attribute}>Phone:</Text>
           <Text style={styles.value}>{userInfo.phone}</Text>

screens/SignupScreen.js

@@ -18,14 +18,12 @@ class SignupScreen extends Component {
     super(props);
     this.initialState = {
       phoneNumber: "",
-      email: "",
       username: "",
       password: "",
     }
     this.state = {
       ...this.initialState,
       inputIsValid: {
-        email: true,
         phoneNumber: true,
         username: true,
         password: true
@@ -35,8 +33,7 @@ class SignupScreen extends Component {
   }
 
   componentDidUpdate(prevProps, prevState) {
-    if (   (this.state.email !== prevState.email)
-        || (this.state.phoneNumber !== prevState.phoneNumber)
+    if (   (this.state.phoneNumber !== prevState.phoneNumber)
         || (this.state.username !== prevState.username)
         || (this.state.password !== prevState.password)
         || (this.state.signupAttempted != prevState.signupAttempted)) {
@@ -45,9 +42,8 @@ class SignupScreen extends Component {
   }
 
   checkIfInputIsValid = (signupAttempted) => {
-    const {email, phoneNumber, username, password} = this.state;
+    const {phoneNumber, username, password} = this.state;
     let inputIsValid = {
-      email: (!signupAttempted && email === "") || ((typeof email !== "undefined") && (accountRules.email.regex.test(email))),
       phoneNumber: (!signupAttempted && phoneNumber === "") || ((typeof phoneNumber !== "undefined") && (accountRules.phoneNumber.regex.test(phoneNumber))),
       username: (!signupAttempted && username === "") || ((typeof username !== "undefined") && (accountRules.username.regex.test(username))),
       password: (!signupAttempted && password === "") || ((typeof password !== "undefined") && (accountRules.password.regex.test(password))),
@@ -59,18 +55,17 @@ class SignupScreen extends Component {
     if (this.state.signupAttempted == false) {
       this.setState({signupAttempted: true});
     }
-    const { email, phoneNumber, username, password } = this.state;
+    const { phoneNumber, username, password } = this.state;
     console.log("[DEBUG] SignUp Button pressed.");
-    console.log("\tEmail: " + email + "\n\tPhoneNumber: " + phoneNumber + "\n\tUsername: " + username + "\n\tPassword: " + password);
+    console.log("\tPhoneNumber: " + phoneNumber + "\n\tUsername: " + username + "\n\tPassword: " + password);
     const inputIsValidAndFilled = this.checkIfInputIsValid(true);
-    if (!inputIsValidAndFilled.email || !inputIsValidAndFilled.phoneNumber || !inputIsValidAndFilled.username || !inputIsValidAndFilled.password) {
+    if (!inputIsValidAndFilled.phoneNumber || !inputIsValidAndFilled.username || !inputIsValidAndFilled.password) {
       console.log("Signup rejected");
       this.setState({inputIsValid: inputIsValidAndFilled});
     } else {
       console.log("Signp accepted");
       this.props.setLoading(true);
       this.props.signupHandler({
-        email: email,
         phone: phoneNumber,
         username: username,
         password: password,
@@ -105,15 +100,6 @@ class SignupScreen extends Component {
               <Text variant="title">Create your account</Text>
             </View>
             <View style={styles.loginInfo}>
-              <Input variant="email"
-                label="Email"
-                hasNext hasError={!this.state.inputIsValid.email}
-                errorText="Email format is invalid."
-                onChangeText={email => {
-                  this.setState({ email });
-                }}
-                onSubmitEditing={() => phoneNumberInputRef._root.focus()}
-              />
               <Input variant="number"
                 label="Phone Number"
                 ref={(input) => phoneNumberInputRef = input}

screens/UsingScreen.js

@@ -21,6 +21,27 @@ const UsingScreen = props => {
   const { timeRemaining } = time;
 
   const startAlarm = () => {
+    // Check if location has been set
+    if (
+      location === null ||
+      location.coords === null ||
+      (location.coords.lat === 0 && location.coords.lng === 0)
+    ) {
+      Actions.alert({
+        alertTitle: "Cannot start alarm",
+        alertBody: "Your location is not set. Please set your location in the 'locations' page' and enable location services on your device.",
+        positiveButton: {
+          text: "Set my location now",
+          onPress: () => {
+            Actions.location();
+          },
+          cancelable: false
+        },
+      });
+      return null;
+    }
+
+    // Check for responders in the area
     const distance = computeDistance(fredVictorCoordinates, props.location.coords)
     if( distance > MAXIMUM_DISTANCE ) {
       Actions.alert({
@@ -29,12 +50,13 @@ const UsingScreen = props => {
         positiveButton: { text: 'OK' },
         cancelable: false
       });
-    } else {
-      Actions.alarm();
-
-      props.makeAlarmLog(userId, timeRemaining, token);
+      return null;
     }
-  };
+
+    Actions.alarm();
+
+    props.makeAlarmLog(userId, timeRemaining, token);
+  }
 
   useEffect(() => {
     let interval = setInterval(

services/location-functions.service.js

@@ -109,9 +109,23 @@ const convertToAddress = (coordinates, success, fail) => {
     })
 }
 
+const promptLocationPermissions = async () => {
+    Location.requestPermissionsAsync()
+    .then(() => { console.log("User permissions enabled!")})
+    .catch((error)  => {
+        Actions.alert({
+            alertTitle: "Please allow location services!",
+            alertBody: (error.response?.data?.errors[0]?.message || ''),
+            positiveButton: { text: "OK" },
+            cancelable: true 
+        });
+    })
+}
+
 module.exports = {
     getDeviceLocation,
     computeDistance,
     convertToAddress,
-    convertToCoordinates
+    convertToCoordinates,
+    promptLocationPermissions
 }

store/actions/UserDataActions.js

@@ -4,6 +4,7 @@ import { SERVER_ROOT } from "react-native-dotenv";
 import { Actions } from "react-native-router-flux";
 
 export const setLocalLocation = location => {
+  console.log('setting', {location})
   return {
     type: SET_LOCATION,
     data: { location: location }