Convert to using CSV output

mobile/android/DeightonAR.iml

@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<module external.linked.project.id="DeightonAR" external.linked.project.path="$MODULE_DIR$" external.root.project.path="$MODULE_DIR$/app" external.system.id="GRADLE" type="JAVA_MODULE" version="4">
+<module external.linked.project.id="DeightonAR" external.linked.project.path="$MODULE_DIR$" external.root.project.path="$MODULE_DIR$" external.system.id="GRADLE" type="JAVA_MODULE" version="4">
   <component name="FacetManager">
     <facet type="java-gradle" name="Java-Gradle">
       <configuration>
@@ -8,7 +8,7 @@
       </configuration>
     </facet>
   </component>
-  <component name="NewModuleRootManager" inherit-compiler-output="true">
+  <component name="NewModuleRootManager" LANGUAGE_LEVEL="JDK_1_7" inherit-compiler-output="true">
     <exclude-output />
     <content url="file://$MODULE_DIR$">
       <excludeFolder url="file://$MODULE_DIR$/.gradle" />

mobile/android/app/app.iml

@@ -22,7 +22,7 @@
       </configuration>
     </facet>
   </component>
-  <component name="NewModuleRootManager">
+  <component name="NewModuleRootManager" LANGUAGE_LEVEL="JDK_1_7">
     <output url="file://$MODULE_DIR$/build/intermediates/classes/debug" />
     <output-test url="file://$MODULE_DIR$/build/intermediates/classes/test/debug" />
     <exclude-output />
@@ -103,7 +103,7 @@
       <excludeFolder url="file://$MODULE_DIR$/build/reports" />
       <excludeFolder url="file://$MODULE_DIR$/build/tmp" />
     </content>
-    <orderEntry type="inheritedJdk" />
+    <orderEntry type="jdk" jdkName="Android API 27 Platform" jdkType="Android SDK" />
     <orderEntry type="sourceFolder" forTests="false" />
     <orderEntry type="library" name="Gradle: com.android.support:support-fragment-25.0.0" level="project" />
     <orderEntry type="library" name="Gradle: com.facebook.fresco:fbcore-1.3.0" level="project" />
@@ -149,6 +149,5 @@
     <orderEntry type="module" module-name="react-native-maps" />
     <orderEntry type="module" module-name="react-native-image-resizer" />
     <orderEntry type="module" module-name="react-native-image-picker" />
-    <orderEntry type="library" name="Gradle: android-android-27" level="project" />
   </component>
 </module>

mobile/android/app/build.gradle

@@ -101,8 +101,8 @@ android {
         applicationId "com.deightonar"
         minSdkVersion 24
         targetSdkVersion 27
-        versionCode 11
-        versionName "1.2.1"
+        versionCode 15
+        versionName "1.4.2"
         ndk {
             abiFilters "armeabi-v7a", "x86"
         }

mobile/android/app/src/main/AndroidManifest.xml

@@ -1,7 +1,7 @@
 <manifest xmlns:android="http://schemas.android.com/apk/res/android"
     package="com.deightonar"
-    android:versionCode="11"
-    android:versionName="1.2.1">
+    android:versionCode="15"
+    android:versionName="1.4.2">
 
     <uses-permission android:name="android.permission.INTERNET" />
     <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>

mobile/ios/DeightonAR/Info.plist

@@ -19,11 +19,11 @@
 	<key>CFBundlePackageType</key>
 	<string>APPL</string>
 	<key>CFBundleShortVersionString</key>
-	<string>1.2.1</string>
+	<string>1.4.2</string>
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleVersion</key>
-	<string>20180531.0</string>
+	<string>20180628.0</string>
 	<key>LSRequiresIPhoneOS</key>
 	<true/>
 	<key>NSAppTransportSecurity</key>

mobile/src/Activity/Activity.js

@@ -267,7 +267,7 @@ export class Activity extends React.Component {
     if (this.state.progressModal) {
       this.setState({
         uploadPercent: Math.round(
-          uploadData.uploadedChunks / uploadData.numberOfChunks * 100
+          (uploadData.uploadedChunks / uploadData.numberOfChunks) * 100
         ),
       })
       return true

mobile/src/Auth/Login.js

@@ -4,10 +4,7 @@ import {
   StyleSheet,
   Text,
   Image,
-  Switch,
-  TextInput,
   View,
-  Button,
   TouchableWithoutFeedback,
 } from "react-native"
 import { MessageModal, ApiModal, WaitModal } from "../Modal"
@@ -18,7 +15,6 @@ import { BoundSwitch, BoundInput, BoundButton } from "../ui"
 import KeyboardSpacer from "react-native-keyboard-spacer"
 import { versionInfo } from "../version"
 import { reactAutoBind } from "auto-bind2"
-import { isIphoneX } from "react-native-iphone-x-helper"
 import { config } from "../config"
 
 export class Login extends React.Component {

mobile/src/Home/Home.js

@@ -1,10 +1,7 @@
 import React from "react"
 import {
-  StyleSheet,
   Text,
-  TextInput,
   SectionList,
-  Image,
   View,
   TouchableOpacity,
   TouchableHighlight,
@@ -33,9 +30,6 @@ import clipboardPinImage from "./images/clipboard-pin.png"
 import questionPinImage from "./images/question-pin.png"
 import moment from "moment"
 
-const neverAskForLocationPermissionKeyName = "NeverAskForLocationPermission"
-const neverAskForCameraKeyName = "NeverAskForCameraPermission"
-
 export class Home extends React.Component {
   constructor(props) {
     super(props)
@@ -47,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
@@ -96,6 +90,7 @@ export class Home extends React.Component {
         }
       )
     } else {
+      navigator.geolocation.requestAuthorization()
       this.state.haveLocationPermission = true
       this.state.haveCameraPermission = true
     }
@@ -248,7 +243,7 @@ export class Home extends React.Component {
 
   handleMyLocationPress() {
     if (this.currentPosition && this.isMapReady) {
-      const coords = this.currentPosition.coords
+      const { coords } = this.currentPosition
 
       this.mapView.animateToCoordinate({
         latitude: coords.latitude,
@@ -283,7 +278,7 @@ export class Home extends React.Component {
 
   getCoordinateDistance(coordinate) {
     if (this.currentPosition) {
-      const coords = this.currentPosition.coords
+      const { coords } = this.currentPosition
       const { latitude, longitude } = coordinate
 
       return (
@@ -459,7 +454,7 @@ export class Home extends React.Component {
                       <Text style={{ fontSize: 14, color: "gray" }}>
                         {activity.teamName +
                           " | " +
-                          dotify(moment(activity.createdAt).format())}
+                          dotify(moment(activity.createdAt).format(), -15)}
                       </Text>
                     </View>
                     <Icon

mobile/src/WorkItem/WorkItem.js

@@ -284,7 +284,7 @@ export class WorkItem extends React.Component {
     if (this.state.progressModal) {
       this.setState({
         uploadPercent: Math.round(
-          uploadData.uploadedChunks / uploadData.numberOfChunks * 100
+          (uploadData.uploadedChunks / uploadData.numberOfChunks) * 100
         ),
       })
       return true

mobile/src/config.js

@@ -1,9 +1,6 @@
-import React from "react"
-import { Platform } from "react-native"
-
 export const config = {
-  localIPAddr: "192.168.1.175",
-  //localIPAddr: "192.168.1.14",
+  // localIPAddr: "192.168.1.175",
+  localIPAddr: "192.168.1.14",
   viroAPIKey: "06F37B6A-74DA-4A83-965A-7DE2209A5C46",
   googleGeocodeAPIKey: "AIzaSyCs4JVT6gysnY5dAJ7KjVJYeykLv_xz1GI",
   googleGeocodeURL: "https://maps.googleapis.com/maps/api/geocode/json",
@@ -15,7 +12,7 @@ export const config = {
   homeRegionDelta: 0.005,
   geocodeDelayMilliseconds: 500,
 
-  //defaultUser: "john@lyon-smith.org",
+  // defaultUser: "john@lyon-smith.org",
   defaultUser: "",
 
   // This region is downtown Toronto

mobile/src/ui/BubbleLoader.js

@@ -20,7 +20,7 @@ export class BubbleLoader extends React.Component {
         this.animatedScales.map((value, i) =>
           Animated.sequence([
             Animated.timing(value, {
-              toValue: 0.2,
+              toValue: 0.01,
               duration: 800,
               delay: 200 * i,
               easing: Easing.out(Easing.sin),

mobile/src/ui/Geolocation.js

@@ -1,6 +1,7 @@
 import React, { Component } from "react"
-import { Image, View } from "react-native"
 import PropTypes from "prop-types"
+import { config } from "../config"
+import { reactAutoBind } from "auto-bind2"
 
 export class Geolocation extends Component {
   static propTypes = {
@@ -18,15 +19,29 @@ export class Geolocation extends Component {
   }
 
   componentDidMount() {
-    navigator.geolocation.getCurrentPosition((position) => {
+    navigator.geolocation.getCurrentPosition(
+      (position) => {
         this.props.onUpdate(position)
 
         if (this.props.watch) {
-        this.watchId = navigator.geolocation.watchPosition((position) =>
+          ;(this.watchId = navigator.geolocation.watchPosition((position) =>
             this.props.onUpdate(position)
-        )
+          )),
+            null,
+            {
+              distanceFilter: 5,
+              maximumAge: 0,
+              timeout: 20000,
             }
-    })
+        }
+      },
+      null,
+      {
+        distanceFilter: 5,
+        maximumAge: 0,
+        timeout: 20000,
+      }
+    )
   }
 
   componentWillUnmount() {

mobile/src/util.js

@@ -1,13 +1,13 @@
 export const geoDistance = (lat1, lng1, lat2, lng2, unit) => {
-  var radlat1 = Math.PI * lat1 / 180
-  var radlat2 = Math.PI * lat2 / 180
+  var radlat1 = (Math.PI * lat1) / 180
+  var radlat2 = (Math.PI * lat2) / 180
   var theta = lng1 - lng2
-  var radtheta = Math.PI * theta / 180
+  var radtheta = (Math.PI * theta) / 180
   var dist =
     Math.sin(radlat1) * Math.sin(radlat2) +
     Math.cos(radlat1) * Math.cos(radlat2) * Math.cos(radtheta)
   dist = Math.acos(dist)
-  dist = dist * 180 / Math.PI
+  dist = (dist * 180) / Math.PI
   dist = dist * 60 * 1.1515
   if (unit == "K") {
     dist = dist * 1.609344
@@ -56,13 +56,22 @@ export const pad = (num, size) => {
   return s
 }
 
-export const dotify = (s) => {
+export const dotify = (s, len = 30) => {
+  let pre = false
+
+  if (len < 0) {
+    pre = true
+    len = -len
+  }
+
   if (!s) {
     return "..."
-  } else if (s.length < 30) {
+  } else if (s.length < len) {
     return s
+  } else if (pre) {
+    return "..." + s.slice(s.length - len - 3)
   } else {
-    return s.substring(0, 26) + "..."
+    return s.slice(0, len - 3) + "..."
   }
 }
 

mobile/src/version.js

@@ -1,6 +1,6 @@
 export const versionInfo = {
-  version: '1.2.1',
-  fullVersion: '1.2.1-20180531.0',
+  version: '1.4.2',
+  fullVersion: '1.4.2-20180628.0',
   title: 'Deighton AR System',
   copyright: '© 2018, Kingston Software Solutions.',
   supportEmail: 'support@kss.us.com',

package.json

@@ -1,6 +1,6 @@
 {
   "name": "deighton-ar",
-  "version": "1.2.1",
+  "version": "1.4.2",
   "description": "Deighton AR Training System",
   "main": "index.js",
   "repository": {

server/out.csv

@@ -0,0 +1,2 @@
+hello,foo
+"x,y","a,b"

server/package-lock.json

@@ -126,7 +126,6 @@
       "version": "1.0.10",
       "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz",
       "integrity": "sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==",
-      "dev": true,
       "requires": {
         "sprintf-js": "~1.0.2"
       }
@@ -1560,6 +1559,16 @@
         "cssom": "0.3.x"
       }
     },
+    "csv-write-stream": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/csv-write-stream/-/csv-write-stream-2.0.0.tgz",
+      "integrity": "sha1-/C2iGkjW6l+MF/3jnPuRHk8CkrA=",
+      "requires": {
+        "argparse": "^1.0.7",
+        "generate-object-property": "^1.0.0",
+        "ndjson": "^1.3.0"
+      }
+    },
     "d": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/d/-/d-0.1.1.tgz",
@@ -3270,6 +3279,14 @@
         }
       }
     },
+    "generate-object-property": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/generate-object-property/-/generate-object-property-1.2.0.tgz",
+      "integrity": "sha1-nA4cQDCM6AT0eDYYuTf6iPmdUNA=",
+      "requires": {
+        "is-property": "^1.0.0"
+      }
+    },
     "get-caller-file": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz",
@@ -3674,6 +3691,11 @@
       "integrity": "sha1-IHurkWOEmcB7Kt8kCkGochADRXU=",
       "dev": true
     },
+    "is-property": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/is-property/-/is-property-1.0.2.tgz",
+      "integrity": "sha1-V/4cTkhHTt1lsJkR8msc1Ald2oQ="
+    },
     "is-stream": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz",
@@ -4495,8 +4517,7 @@
     "json-stringify-safe": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz",
-      "integrity": "sha1-Epai1Y/UXxmg9s4B1lcB4sc1tus=",
-      "dev": true
+      "integrity": "sha1-Epai1Y/UXxmg9s4B1lcB4sc1tus="
     },
     "json5": {
       "version": "0.5.1",
@@ -4972,6 +4993,24 @@
       "integrity": "sha1-Sr6/7tdUHywnrPspvbvRXI1bpPc=",
       "dev": true
     },
+    "ndjson": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/ndjson/-/ndjson-1.5.0.tgz",
+      "integrity": "sha1-rmA7NrE0vOw0e0UkIrC/mNWDLsg=",
+      "requires": {
+        "json-stringify-safe": "^5.0.1",
+        "minimist": "^1.2.0",
+        "split2": "^2.1.0",
+        "through2": "^2.0.3"
+      },
+      "dependencies": {
+        "minimist": {
+          "version": "1.2.0",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
+          "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
+        }
+      }
+    },
     "negotiator": {
       "version": "0.6.1",
       "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.1.tgz",
@@ -6124,8 +6163,7 @@
     "sprintf-js": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
-      "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=",
-      "dev": true
+      "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw="
     },
     "sshpk": {
       "version": "1.13.1",

server/package.json

@@ -28,6 +28,7 @@
     "config": "^1.25.1",
     "cors": "^2.8.3",
     "credential": "^2.0.0",
+    "csv-write-stream": "^2.0.0",
     "deepmerge": "^2.1.0",
     "express": "^4.15.2",
     "gridfs-stream": "jlyonsmith/gridfs-stream",

server/src/api/routes/TeamRoutes.js

@@ -4,6 +4,7 @@ import autobind from "autobind-decorator"
 import zlib from "zlib"
 import { Readable } from "stream"
 import { catchAll, BaseRoutes } from "."
+import csvWriter from "csv-write-stream"
 
 @autobind
 export class TeamRoutes extends BaseRoutes {
@@ -29,30 +30,50 @@ export class TeamRoutes extends BaseRoutes {
       throw createError.Forbidden()
     }
 
+    res.writeHead(200, {
+      "Content-Type": "application/gzip",
+      "Content-Disposition": 'attachment; filename="team-data.csv.gzip"',
+    })
+    const gzip = zlib.createGzip()
+    const writeable = csvWriter({
+      headers: [
+        "Team Name",
+        "Start Time",
+        "Activity Status",
+        "Activity Created",
+        "WorkItem Ticket",
+        "WorkItem Type",
+        "Activity Resolution",
+        "Activity Notes",
+      ],
+    })
+
+    writeable.pipe(gzip).pipe(res)
+
     const Team = this.db.Team
+    const WorkItem = this.db.WorkItem
     const Activity = this.db.Activity
     let teams = await Team.find({}).exec()
 
-    teams = teams.map((doc) => doc.toObject({ versionKey: false }))
-
     for (let team of teams) {
       let activities = await Activity.find({ team: team._id }).exec()
 
-      team.activities = activities.map((doc) =>
-        doc.toObject({ versionKey: false })
-      )
+      for (let activity of activities) {
+        const workItem = await WorkItem.findById(activity.workItem).exec()
+
+        writeable.write([
+          team.name,
+          team.start,
+          activity.status,
+          activity.createdAt,
+          workItem.ticketNumber,
+          workItem.workItemType,
+          activity.resolution,
+          activity.notes,
+        ])
+      }
     }
 
-    const gzip = zlib.createGzip()
-    let readable = new Readable()
-
-    readable.push(JSON.stringify(teams, null, "  "))
-    readable.push(null)
-
-    res.writeHead(200, {
-      "Content-Type": "application/gzip",
-      "Content-Disposition": 'attachment; filename="team-scores.json.gzip"',
-    })
-    readable.pipe(gzip).pipe(res)
+    writeable.end()
   }
 }

server/src/api/routes/UserRoutes.js

@@ -112,7 +112,7 @@ export class UserRoutes {
     const isSelf = _id === req.user._id
     const isAdmin = req.user.administrator
 
-    // User can see themselves, otherwise must be super user
+    // User can see themselves, otherwise must be admin
     if (!isSelf && !isAdmin) {
       throw createError.Forbidden()
     }
@@ -185,8 +185,8 @@ export class UserRoutes {
       throw createError.Forbidden()
     }
 
-    if (isSelf && !isAdmin) {
-      throw createError.BadRequest("Cannot modify own administrator level")
+    if (isSelf && isAdmin && !req.body.administrator) {
+      throw createError.BadRequest("Cannot remove own administrator level")
     }
 
     const User = this.db.User
@@ -199,7 +199,7 @@ export class UserRoutes {
     // We don't allow direct updates to the email field so remove it if present
     const userUpdates = new User(req.body)
 
-    delete userUpdates.email
+    userUpdates.email = undefined
 
     user.merge(userUpdates)
     const savedUser = await user.save()

server/src/version.js

@@ -1,6 +1,6 @@
 export const versionInfo = {
-  version: '1.2.1',
-  fullVersion: '1.2.1-20180531.0',
+  version: '1.4.2',
+  fullVersion: '1.4.2-20180628.0',
   title: 'Deighton AR System',
   copyright: '© 2018, Kingston Software Solutions.',
   supportEmail: 'support@kss.us.com',

version.json5

@@ -15,11 +15,11 @@
   buildFormat: "full",
   tags: {
     major: 1,
-    minor: 2,
-    patch: 1,
-    build: 20180531,
+    minor: 4,
+    patch: 2,
+    build: 20180628,
     revision: 0,
-    sequence: 11,
+    sequence: 15,
     tz: "America/Los_Angeles",
     title: "Deighton AR System",
     copyright: "© 2018, Kingston Software Solutions.",
@@ -93,7 +93,7 @@
       glob: "**/AndroidManifest.xml",
       updates: [
         {
-          search: "(?<begin>android:versionCode=\")\\d?(?<end>\")",
+          search: "(?<begin>android:versionCode=\")\\d+(?<end>\")",
           replace: "${begin}${sequence}${end}"
         },
         {

website/src/Auth/ResetPassword.js

@@ -123,7 +123,7 @@ export class ResetPassword extends Component {
             <Row.Item grow />
             <Row.Item width={sizeInfo.formRowSpacing} />
             <Row.Item width={sizeInfo.modalWidth}>
-              <form onSubmit={this.handleSubmit} id="resetPasswordForm">
+              <form onSubmit={this.handleSubmit} id="ResetPasswordForm">
                 <Box
                   border={{
                     width: sizeInfo.headerBorderWidth,
@@ -178,7 +178,7 @@ export class ResetPassword extends Component {
                               <BoundButton
                                 text="Submit"
                                 name="submit"
-                                submit="resetPasswordForm"
+                                submit="ResetPasswordForm"
                                 binder={binder}
                               />
                             </Row.Item>

website/src/Modal/ChangePasswordModal.js

@@ -49,6 +49,8 @@ export class ChangePasswordModal extends React.Component {
   @autobind
   handleSubmit(e) {
     e.preventDefault()
+    e.stopPropagation()
+
     let passwords = null
     const { binder } = this.state
 
@@ -70,7 +72,7 @@ export class ChangePasswordModal extends React.Component {
 
     return (
       <Modal open={this.props.open} width={sizeInfo.modalWidth}>
-        <form id="changePasswordForm" onSubmit={this.handleSubmit}>
+        <form id="ChangePasswordForm" onSubmit={this.handleSubmit}>
           <Row>
             <Row.Item width={sizeInfo.formRowSpacing} />
             <Row.Item grow>
@@ -122,7 +124,7 @@ export class ChangePasswordModal extends React.Component {
                     <Row.Item>
                       <BoundButton
                         text="Submit"
-                        submit="changePasswordForm"
+                        submit="ChangePasswordForm"
                         name="submit"
                         binder={binder}
                       />

website/src/Modal/MessageModal.js

@@ -1,8 +1,8 @@
-import React from 'react'
-import PropTypes from 'prop-types'
-import { Modal, Button, Column, Row, Text, Icon } from 'ui'
-import { sizeInfo } from 'ui/style'
-import autobind from 'autobind-decorator'
+import React from "react"
+import PropTypes from "prop-types"
+import { Modal, Button, Column, Row, Text, Icon } from "ui"
+import { sizeInfo } from "ui/style"
+import autobind from "autobind-decorator"
 
 export class MessageModal extends React.Component {
   static propTypes = {
@@ -10,7 +10,7 @@ export class MessageModal extends React.Component {
     icon: PropTypes.string.isRequired,
     message: PropTypes.string.isRequired,
     detail: PropTypes.string,
-    onDismiss: PropTypes.func
+    onDismiss: PropTypes.func,
   }
 
   @autobind
@@ -30,26 +30,34 @@ export class MessageModal extends React.Component {
 
     return (
       <Modal open={open} width={sizeInfo.modalWidth}>
-        <form onSubmit={this.onSubmit} id='messageModal'>
+        <form onSubmit={this.onSubmit} id="MessageForm">
           <Row>
             <Row.Item>
               <Icon name={icon} size={sizeInfo.modalMessageIcon} />
             </Row.Item>
             <Row.Item grow>
-              <Column height='100%'>
+              <Column height="100%">
                 <Column.Item height={sizeInfo.formColumnSpacing} />
                 <Column.Item grow>
-                  <Text width='100%' align='center'>{message}</Text>
+                  <Text width="100%" align="center">
+                    {message}
+                  </Text>
                 </Column.Item>
                 <Column.Item>
-                  <Text width='100%' align='center' color='dimmed' size='small'>{detail}</Text>
+                  <Text width="100%" align="center" color="dimmed" size="small">
+                    {detail}
+                  </Text>
                 </Column.Item>
                 <Column.Item height={sizeInfo.formColumnSpacing} />
                 <Column.Item height={sizeInfo.buttonHeight}>
                   <Row>
                     <Row.Item grow />
                     <Row.Item>
-                      <Button submit='messageModal' text='OK' onClick={this.onSubmit} />
+                      <Button
+                        submit="MessageForm"
+                        text="OK"
+                        onClick={this.onSubmit}
+                      />
                     </Row.Item>
                     <Row.Item grow />
                   </Row>

website/src/ui/Loader.js

@@ -1,7 +1,7 @@
-import React from 'react'
-import Radium from 'radium'
-import { colorInfo, sizeInfo } from 'ui/style'
-import anime from 'animejs'
+import React from "react"
+import Radium from "radium"
+import { colorInfo, sizeInfo } from "ui/style"
+import anime from "animejs"
 
 @Radium
 export class Loader extends React.Component {
@@ -13,30 +13,31 @@ export class Loader extends React.Component {
       anime({
         targets: elem,
         scale: [
-          { value: 0.2, duration: 800, easing: 'easeOutSine', delay: 200 * i },
-          { value: 1.0, duration: 800, easing: 'easeOutSine' },
-          { value: 1.0, duration: 200 * (2 - i) }
+          { value: 0.0, duration: 800, easing: "easeOutSine", delay: 200 * i },
+          { value: 1.0, duration: 800, easing: "easeOutSine" },
+          { value: 1.0, duration: 200 * (2 - i) },
         ],
-        loop: true
+        loop: true,
       })
     }
 
     return (
       <div style={{ height: size }}>
-        {
-          [0, 1, 2].map((i) => (
-            <span key={i} ref={(elem) => addAnimation(elem, i)}
+        {[0, 1, 2].map((i) => (
+          <span
+            key={i}
+            ref={(elem) => addAnimation(elem, i)}
             style={{
-                display: 'inline-block',
+              display: "inline-block",
               marginLeft: i > 0 ? spacing : 0,
               width: size,
               height: size,
               background: colorInfo.textInverse,
               borderSize: 0,
-                borderRadius: '100%'
-              }} />
-          ))
-        }
+              borderRadius: "100%",
+            }}
+          />
+        ))}
       </div>
     )
   }

website/src/version.js

@@ -1,6 +1,6 @@
 export const versionInfo = {
-  version: '1.2.1',
-  fullVersion: '1.2.1-20180531.0',
+  version: '1.4.2',
+  fullVersion: '1.4.2-20180628.0',
   title: 'Deighton AR System',
   copyright: '© 2018, Kingston Software Solutions.',
   supportEmail: 'support@kss.us.com',