Revert to user location from map with better GPS accuracy

mobile/src/Home/Home.js

@@ -1,10 +1,7 @@
 import React from "react"
 import {
-  StyleSheet,
   Text,
-  TextInput,
   SectionList,
-  Image,
   View,
   TouchableOpacity,
   TouchableHighlight,
@@ -31,12 +28,8 @@ import KeyboardSpacer from "react-native-keyboard-spacer"
 import hardhatPinImage from "./images/hardhat-pin.png"
 import clipboardPinImage from "./images/clipboard-pin.png"
 import questionPinImage from "./images/question-pin.png"
-import locationImage from "./images/location.png"
 import moment from "moment"
 
-const neverAskForLocationPermissionKeyName = "NeverAskForLocationPermission"
-const neverAskForCameraKeyName = "NeverAskForCameraPermission"
-
 export class Home extends React.Component {
   constructor(props) {
     super(props)
@@ -48,8 +41,8 @@ export class Home extends React.Component {
       showWorkItems: true,
       haveCameraPermission: false,
       haveLocationPermission: false,
-      currentPosition: null,
     }
+    this.currentPosition = null
     this.isMapReady = false
     this.goToRegionWhenReady = false
     this.region = null
@@ -97,6 +90,7 @@ export class Home extends React.Component {
         }
       )
     } else {
+      navigator.geolocation.requestAuthorization()
       this.state.haveLocationPermission = true
       this.state.haveCameraPermission = true
     }
@@ -176,8 +170,8 @@ export class Home extends React.Component {
   }
 
   handleWorkItemsListPress() {
-    if (this.state.currentPosition) {
-      const { coords } = this.state.currentPosition
+    if (this.currentPosition) {
+      const { coords } = this.currentPosition
 
       this.props.history.push(
         `/workItemList?latLng=${coords.latitude},${coords.longitude}`
@@ -210,13 +204,13 @@ export class Home extends React.Component {
   }
 
   handleGlassesPress() {
-    const { sections: workItems, currentPosition } = this.state
+    const { sections: workItems } = this.state
 
-    if (currentPosition) {
+    if (this.currentPosition) {
       const {
         latitude: latitude1,
         longitude: longitude1,
-      } = currentPosition.coords
+      } = this.currentPosition.coords
       let closestWorkItem = config.alwaysShowWorkItemInAR ? workItems[0] : null
       let shortestDistance = config.minDistanceToItem
 
@@ -248,10 +242,8 @@ export class Home extends React.Component {
   }
 
   handleMyLocationPress() {
-    const { currentPosition } = this.state
-
-    if (currentPosition && this.isMapReady) {
-      const { coords } = currentPosition
+    if (this.currentPosition && this.isMapReady) {
+      const { coords } = this.currentPosition
 
       this.mapView.animateToCoordinate({
         latitude: coords.latitude,
@@ -281,14 +273,12 @@ export class Home extends React.Component {
   }
 
   handlePositionUpdate(position) {
-    this.setState({ currentPosition: position })
+    this.currentPosition = position
   }
 
   getCoordinateDistance(coordinate) {
-    const { currentPosition } = this.state
-
-    if (currentPosition) {
-      const { coords } = currentPosition
+    if (this.currentPosition) {
+      const { coords } = this.currentPosition
       const { latitude, longitude } = coordinate
 
       return (
@@ -313,7 +303,6 @@ export class Home extends React.Component {
       waitModal,
       haveCameraPermission,
       haveLocationPermission,
-      currentPosition,
     } = this.state
 
     return (
@@ -340,7 +329,7 @@ export class Home extends React.Component {
             showWorkItems && { height: "40%" },
             !showWorkItems && { flexGrow: 1 },
           ]}
-          showsUserLocation={false}
+          showsUserLocation
           showsBuildings={false}
           showsTraffic={false}
           showsIndoors={false}
@@ -376,14 +365,6 @@ export class Home extends React.Component {
               </Callout>
             </Marker>
           ))}
-          {currentPosition && (
-            <Marker
-              key={sections.length}
-              coordinate={currentPosition.coords}
-              anchor={{ x: 0.5, y: 0.5 }}
-              image={locationImage}
-            />
-          )}
         </MapView>
         <View
           style={{