Added wait modals everywhere. Reduce required distance to item

mobile/src/Activity/Activity.js

@@ -97,16 +97,19 @@ export class Activity extends React.Component {
     this.region = null
     this.isMapReady = false
     this.goToRegionWhenReady = false
+  }
 
+  componentDidMount() {
     const { search } = this.props.location
     const params = search ? new URLSearchParams(search) : { get: () => null }
     const id = params.get("id")
     const workItemId = params.get("workItemId")
-
     const getWorkItem = (id) => {
+      this.setState({ waitModal: { message: "Loading Work Item Details..." } })
       api
         .getWorkItem(id)
         .then((workItem) => {
+          this.setState({ waitModal: null })
           if (workItem) {
             const [lng, lat] = workItem.location.coordinates
 
@@ -139,6 +142,7 @@ export class Activity extends React.Component {
         })
         .catch((err) => {
           this.setState({
+            waitModal: null,
             messageModal: {
               icon: "hand",
               message: "Unable to get work item details",
@@ -150,9 +154,12 @@ export class Activity extends React.Component {
     }
 
     if (id) {
+      this.setState({ waitModal: { message: "Loading Activity..." } })
       api
         .getActivity(id)
         .then((activity) => {
+          this.setState({ waitModal: null })
+
           if (activity) {
             this.setState({
               binder: new FormBinder(activity, Activity.bindings),
@@ -163,6 +170,7 @@ export class Activity extends React.Component {
         })
         .catch((err) => {
           this.setState({
+            waitModal: null,
             messageModal: {
               icon: "hand",
               message: "Unable to get activity details",