Enabling test server and bug fixes

mobile/src/Activity/Activity.js

@@ -51,24 +51,26 @@ const styles = StyleSheet.create({
 
 export class Activity extends React.Component {
   static bindings = {
-    dateTime: {
+    header: {
-      isValid: true,
+      noValue: true,
+      isDisabled: (r) => !(r.anyModified && r.allValid),
     },
-    location: {
+    dateTime: {
       isValid: (r, v) => v !== "",
       isReadOnly: true,
     },
     details: {
-      isValid: true,
+      isValid: (r, v) => v !== "",
     },
     resolution: {
-      isValid: true,
+      isValid: (r, v) => v !== "",
     },
     notes: {
-      isValid: true,
+      isValid: (r, v) => v !== "",
     },
     status: {
-      isValid: true,
+      isValid: (r, v) => v !== "",
+      alwaysGet: true,
     },
   }
 
@@ -136,14 +138,55 @@ export class Activity extends React.Component {
     }
   }
 
+  @autobind
+  handleDonePress() {
+    const { binder } = this.state
+    let obj = binder.getModifiedFieldValues()
+
+    if (!obj._id) {
+      api
+        .createActivity(obj)
+        .then((activity) => {
+          this.handleBackPress()
+        })
+        .catch((error) => {
+          this.setState({
+            messageModal: {
+              icon: "hand",
+              message: "Unable to create activity",
+              detail: error.message,
+            },
+          })
+        })
+    } else {
+      api
+        .updateActivity(obj)
+        .then((activity) => {
+          this.handleBackPress()
+        })
+        .catch((error) => {
+          this.setState({
+            messageModal: {
+              icon: "hand",
+              message: "Unable to update activity",
+              detail: error.message,
+            },
+          })
+        })
+    }
+  }
+
   render() {
     const { binder, messageModal, region } = this.state
 
     return (
       <View style={{ width: "100%", height: "100%" }}>
-        <Header
+        <BoundHeader
-          title="Activity"
+          binder={binder}
+          name="header"
+          title="Work Item"
           leftButton={{ icon: "back", onPress: this.handleBackPress }}
+          rightButton={{ icon: "done", onPress: this.handleDonePress }}
         />
         <ScrollView style={styles.container}>
           <View style={styles.panel}>

server/config/default-test.json5

@@ -0,0 +1,27 @@
+{
+  logDir: '',
+  serviceName: {
+    server: 'dar-test-server',
+    api: 'dar-test-api',
+    email: 'dar-test-email',
+    image: 'dar-test-image',
+  },
+  uri: {
+    mongo: 'mongodb://localhost/dar-test-v1',
+    amqp: 'amqp://localhost',
+    redis: 'redis://localhost',
+  },
+  api: {
+    port: '3002',
+    loginKey: '6508b427b3cc486498671cfd7967218bd6b95fbb42f5e17a112f4c9e9900057c',
+    uploadTimout: 3600,
+  },
+  email: {
+    senderEmail: 'support@kss.us.com',
+    maxEmailTokenAgeInHours: 36,
+    maxPasswordTokenAgeInHours: 3,
+    sendEmailDelayInSeconds: 3,
+    supportEmail: 'support@kss.us.com',
+    sendEmail: true
+  }
+}

server/config/default.json5

@@ -1,5 +1,11 @@
 {
   logDir: '',
+  serviceName: {
+    server: 'dar-server',
+    api: 'dar-api',
+    email: 'dar-email',
+    image: 'dar-image',
+  },
   uri: {
     mongo: 'mongodb://localhost/dar-v1',
     amqp: 'amqp://localhost',

server/config/production-test.json5

@@ -0,0 +1,5 @@
+{
+  api: {
+    port: '3006',
+  },
+}

server/deighton-ar-test.service

@@ -0,0 +1,16 @@
+[Unit]
+Description=Deighton AR Test Service
+After=rabbitmq-server.service mongod.service redis-server.service
+
+[Service]
+Type=simple
+User=ubuntu
+Group=ubuntu
+WorkingDirectory=/home/ubuntu/deighton-ar/server
+Environment='NODE_ENV=production'
+Environment='NODE_APP_INSTANCE=test'
+ExecStart=/usr/bin/node dist/server.js
+Restart=on-abort
+
+[Install]
+WantedBy=multi-user.target

server/src/api/index.js

@@ -19,8 +19,8 @@ import * as Routes from "./routes"
 let app = express()
 let server = http.createServer(app)
 let container = { app, server }
-const serviceName = "dar-api"
+const serviceName = config.get("serviceName.api")
-const isProduction = process.env.NODE_ENV == "production"
+const isProduction = process.env.NODE_ENV === "production"
 let log = null
 
 if (isProduction) {
@@ -71,6 +71,7 @@ Promise.all([
     log.info(`Connected to Redis at ${redisUri}`)
 
     try {
+      container.systemRoutes = new Routes.SystemRoutes(container)
       container.authRoutes = new Routes.AuthRoutes(container)
       container.userRoutes = new Routes.UserRoutes(container)
       container.assetRoutes = new Routes.AssetRoutes(container)

server/src/api/routes/SystemRoutes.js

@@ -0,0 +1,23 @@
+import createError from "http-errors"
+import autobind from "autobind-decorator"
+import { catchAll } from "."
+import { versionInfo } from "../../version"
+import { version } from "urlsafe-base64/lib/urlsafe-base64"
+
+@autobind
+export class SystemRoutes {
+  constructor(container) {
+    const app = container.app
+
+    this.log = container.log
+
+    app.route("/system/version").get(this.getVersion)
+  }
+
+  async getVersion(req, res, next) {
+    const { fullVersion } = versionInfo
+    res.json({
+      fullVersion,
+    })
+  }
+}

server/src/api/routes/index.js

@@ -4,6 +4,7 @@ export { UserRoutes } from "./UserRoutes"
 export { WorkItemRoutes } from "./WorkItemRoutes"
 export { ActivityRoutes } from "./ActivityRoutes"
 export { TeamRoutes } from "./TeamRoutes"
+export { SystemRoutes } from "./SystemRoutes"
 import createError from "http-errors"
 
 export function catchAll(routeHandler) {

server/src/email/index.js

@@ -1,19 +1,20 @@
-import config from 'config'
+import config from "config"
-import pino from 'pino'
+import pino from "pino"
-import * as pinoExpress from 'pino-pretty-express'
+import * as pinoExpress from "pino-pretty-express"
-import createError from 'http-errors'
+import createError from "http-errors"
-import { MS } from '../message-service'
+import { MS } from "../message-service"
-import { EmailHandlers } from './EmailHandlers'
+import { EmailHandlers } from "./EmailHandlers"
-import path from 'path'
+import path from "path"
-import fs from 'fs'
+import fs from "fs"
 
-const serviceName = 'dar-email'
+const serviceName = config.get("serviceName.email")
-const isProduction = (process.env.NODE_ENV == 'production')
+const isProduction = process.env.NODE_ENV === "production"
 let log = null
 
 if (isProduction) {
-  log = pino( { name: serviceName },
+  log = pino(
-    fs.createWriteStream(path.join(config.get('logDir'), serviceName + '.log'))
+    { name: serviceName },
+    fs.createWriteStream(path.join(config.get("logDir"), serviceName + ".log"))
   )
 } else {
   const pretty = pinoExpress.pretty({})
@@ -24,17 +25,20 @@ if (isProduction) {
 const ms = new MS(serviceName, { durable: true }, log)
 let container = { ms, log }
 
-const amqpUri = config.get('uri.amqp')
+const amqpUri = config.get("uri.amqp")
 
-ms.connect(amqpUri).then(() => {
+ms
-  log.info(`Connected to RabbitMQ at ${amqpUri}`)
+  .connect(amqpUri)
+  .then(() => {
+    log.info(`Connected to RabbitMQ at ${amqpUri}`)
 
-  container = {
+    container = {
-    ...container,
+      ...container,
-    handlers: new EmailHandlers(container)
+      handlers: new EmailHandlers(container),
-  }
+    }
 
-  ms.listen(container.handlers)
+    ms.listen(container.handlers)
-}).catch((err) => {
+  })
-  log.error(isProduction ? err.message : err)
+  .catch((err) => {
-})
+    log.error(isProduction ? err.message : err)
+  })

server/src/image/index.js

@@ -1,19 +1,20 @@
-import config from 'config'
+import config from "config"
-import pino from 'pino'
+import pino from "pino"
-import * as pinoExpress from 'pino-pretty-express'
+import * as pinoExpress from "pino-pretty-express"
-import { DB } from '../database'
+import { DB } from "../database"
-import { MS } from '../message-service'
+import { MS } from "../message-service"
-import { ImageHandlers } from './ImageHandlers'
+import { ImageHandlers } from "./ImageHandlers"
-import path from 'path'
+import path from "path"
-import fs from 'fs'
+import fs from "fs"
 
-const serviceName = 'dar-image'
+const serviceName = config.get("serviceName.image")
-const isProduction = (process.env.NODE_ENV == 'production')
+const isProduction = process.env.NODE_ENV === "production"
 let log = null
 
 if (isProduction) {
-  log = pino( { name: serviceName },
+  log = pino(
-    fs.createWriteStream(path.join(config.get('logDir'), serviceName + '.log'))
+    { name: serviceName },
+    fs.createWriteStream(path.join(config.get("logDir"), serviceName + ".log"))
   )
 } else {
   const pretty = pinoExpress.pretty({})
@@ -24,22 +25,21 @@ if (isProduction) {
 const ms = new MS(serviceName, { durable: false }, log)
 const db = new DB()
 let container = { db, ms, log }
-const mongoUri = config.get('uri.mongo')
+const mongoUri = config.get("uri.mongo")
-const amqpUri = config.get('uri.amqp')
+const amqpUri = config.get("uri.amqp")
 
-Promise.all([
+Promise.all([db.connect(mongoUri), ms.connect(amqpUri)])
-  db.connect(mongoUri),
+  .then(() => {
-  ms.connect(amqpUri)
+    log.info(`Connected to MongoDB at ${mongoUri}`)
-]).then(() => {
+    log.info(`Connected to RabbitMQ at ${amqpUri}`)
-  log.info(`Connected to MongoDB at ${mongoUri}`)
-  log.info(`Connected to RabbitMQ at ${amqpUri}`)
 
-  container = {
+    container = {
-    ...container,
+      ...container,
-    handlers: new ImageHandlers(container)
+      handlers: new ImageHandlers(container),
-  }
+    }
 
-  ms.listen(container.handlers)
+    ms.listen(container.handlers)
-}).catch((err) => {
+  })
-  log.error(isProduction ? err.message : err)
+  .catch((err) => {
-})
+    log.error(isProduction ? err.message : err)
+  })

server/src/server.js

@@ -1,18 +1,19 @@
 #!/usr/bin/env node
-import { ServerTool } from './ServerTool'
+import { ServerTool } from "./ServerTool"
-import pino from 'pino'
+import pino from "pino"
-import * as pinoExpress from 'pino-pretty-express'
+import * as pinoExpress from "pino-pretty-express"
-import path from 'path'
+import path from "path"
-import fs from 'fs'
+import fs from "fs"
-import config from 'config'
+import config from "config"
 
-const serviceName = 'dar-server'
+const serviceName = config.get("serviceName.server")
-const isProduction = (process.env.NODE_ENV == 'production')
+const isProduction = process.env.NODE_ENV === "production"
 let log = null
 
 if (isProduction) {
-  log = pino( { name: serviceName },
+  log = pino(
-    fs.createWriteStream(path.join(config.get('logDir'), serviceName + '.log'))
+    { name: serviceName },
+    fs.createWriteStream(path.join(config.get("logDir"), serviceName + ".log"))
   )
 } else {
   const pretty = pinoExpress.pretty({})
@@ -20,10 +21,13 @@ if (isProduction) {
   log = pino({ name: serviceName }, pretty)
 }
 
-const tool = new ServerTool(path.basename(process.argv[1], '.js'), log)
+const tool = new ServerTool(path.basename(process.argv[1], ".js"), log)
 
-tool.run(process.argv.slice(2)).then((exitCode) => {
+tool
-  process.exitCode = exitCode
+  .run(process.argv.slice(2))
-}).catch((err) => {
+  .then((exitCode) => {
-  console.error(err)
+    process.exitCode = exitCode
-})
+  })
+  .catch((err) => {
+    console.error(err)
+  })

server/src/version.js

@@ -0,0 +1,7 @@
+export const versionInfo = {
+  version: '1.0.0',
+  fullVersion: '1.0.0-20180415.0',
+  title: 'Deighton AR System',
+  copyright: '© 2018, Kingston Software Solutions.',
+  supportEmail: 'support@kss.us.com',
+}

version.json5

@@ -7,6 +7,7 @@
     "mobile/ios/DeightonAR/info.plist",
     "mobile/android/app/build.gradle",
     "mobile/android/app/src/main/AndroidManifest.xml",
+    "service/src/version.js",
     "scratch/version.txt",
     "scratch/version.tag.txt",
     "scratch/version.desc.txt"

website/src/Users/UserForm.js

@@ -1,13 +1,19 @@
-import React from 'react'
+import React from "react"
-import PropTypes from 'prop-types'
+import PropTypes from "prop-types"
-import autobind from 'autobind-decorator'
+import autobind from "autobind-decorator"
-import { regExpPattern } from 'regexp-pattern'
+import { regExpPattern } from "regexp-pattern"
-import { api } from 'src/API'
+import { api } from "src/API"
 import {
-  Row, Column, BoundInput, BoundButton, BoundCheckbox, BoundEmailIcon, BoundDropdown,
+  Row,
-} from 'ui'
+  Column,
-import { FormBinder } from 'react-form-binder'
+  BoundInput,
-import { sizeInfo } from 'ui/style'
+  BoundButton,
+  BoundCheckbox,
+  BoundEmailIcon,
+  BoundDropdown,
+} from "ui"
+import { FormBinder } from "react-form-binder"
+import { sizeInfo } from "ui/style"
 
 export class UserForm extends React.Component {
   static propTypes = {
@@ -16,63 +22,72 @@ export class UserForm extends React.Component {
     onRemove: PropTypes.func,
     onModifiedChanged: PropTypes.func,
     onChangeEmail: PropTypes.func,
-    onResendEmail: PropTypes.func
+    onResendEmail: PropTypes.func,
+    onResetPassword: PropTypes.func,
   }
 
   static bindings = {
     email: {
-      isValid: (r, v) => (regExpPattern.email.test(v)),
+      isValid: (r, v) => regExpPattern.email.test(v),
-      isDisabled: (r) => (r._id)
+      isDisabled: (r) => r._id,
     },
     emailValidated: {
       initValue: false,
-      isDisabled: (r) => (!r._id)
+      isDisabled: (r) => !r._id,
+    },
+    resetPassword: {
+      noValue: true,
+      isDisabled: (r) => !r._id || api.loggedInUser._id === r._id,
     },
     changeEmail: {
       noValue: true,
-      isDisabled: (r) => (!r._id)
+      isDisabled: (r) => !r._id,
     },
     resendEmail: {
       noValue: true,
-      isDisabled: (r) => (!r._id || !!r.getFieldValue('emailValidated'))
+      isDisabled: (r) => !r._id || !!r.getFieldValue("emailValidated"),
     },
     firstName: {
-      isValid: (r, v) => (v !== '')
+      isValid: (r, v) => v !== "",
     },
     lastName: {
-      isValid: (r, v) => (v !== '')
+      isValid: (r, v) => v !== "",
     },
     team: {
-      isValid: true
+      isValid: true,
     },
     administrator: {
       isValid: (r, v) => true,
       initValue: false,
-      isDisabled: (r) => (api.loggedInUser._id === r._id), // Adding a new user
+      isDisabled: (r) => api.loggedInUser._id === r._id, // Adding a new user
       alwaysGet: true,
     },
     remove: {
       noValue: true,
-      isVisible: (r) => (r._id),
+      isVisible: (r) => r._id,
-      isDisabled: (r) => (api.loggedInUser._id === r._id)
+      isDisabled: (r) => api.loggedInUser._id === r._id,
     },
     reset: {
       noValue: true,
       isDisabled: (r) => {
         return !r.anyModified
-      }
+      },
     },
     submit: {
       noValue: true,
-      isDisabled: (r) => (!r.anyModified || !r.allValid),
+      isDisabled: (r) => !r.anyModified || !r.allValid,
     },
   }
 
   constructor(props) {
     super(props)
     this.state = {
-      binder: new FormBinder(props.user, UserForm.bindings, props.onModifiedChanged),
+      binder: new FormBinder(
-      teams: []
+        props.user,
+        UserForm.bindings,
+        props.onModifiedChanged
+      ),
+      teams: [],
     }
 
     this.getTeams()
@@ -81,17 +96,28 @@ export class UserForm extends React.Component {
   // TODO: This is not very efficient.  Better to get the teams in User.js and pass them in
   // This however will always be up-to-date.  Need to use the WebSocket to refresh.
   getTeams() {
-    api.listTeams().then((list) => {
+    api
-      this.setState({ teams: list.items.map((item) => ({ value: item._id, text: item.name, icon: 'team' })).sort((a, b) => (a.text.localeCompare(b.text))) })
+      .listTeams()
-    }).catch(() => {
+      .then((list) => {
-      this.setState({ teams: [] })
+        this.setState({
-    })
+          teams: list.items
+            .map((item) => ({ value: item._id, text: item.name, icon: "team" }))
+            .sort((a, b) => a.text.localeCompare(b.text)),
+        })
+      })
+      .catch(() => {
+        this.setState({ teams: [] })
+      })
   }
 
   componentWillReceiveProps(nextProps) {
     if (nextProps.user !== this.props.user) {
       this.setState({
-        binder: new FormBinder(nextProps.user, UserForm.bindings, nextProps.onModifiedChanged)
+        binder: new FormBinder(
+          nextProps.user,
+          UserForm.bindings,
+          nextProps.onModifiedChanged
+        ),
       })
 
       this.getTeams()
@@ -113,7 +139,9 @@ export class UserForm extends React.Component {
   handleReset() {
     const { user, onModifiedChanged } = this.props
 
-    this.setState({ binder: new FormBinder(user, UserForm.bindings, onModifiedChanged) })
+    this.setState({
+      binder: new FormBinder(user, UserForm.bindings, onModifiedChanged),
+    })
 
     if (onModifiedChanged) {
       onModifiedChanged(false)
@@ -122,19 +150,37 @@ export class UserForm extends React.Component {
 
   @autobind
   handleChangeEmail() {
-    this.props.onChangeEmail()
+    const { onChangeEmail } = this.props
+
+    if (onChangeEmail) {
+      onChangeEmail()
+    }
   }
 
   @autobind
   handleResendEmail() {
-    this.props.onResendEmail()
+    const { onResendEmail } = this.props
+    if (onResendEmail) {
+      onResendEmail()
+    }
+  }
+
+  @autobind
+  handleResetPassword() {
+    const { onResetPassword } = this.props
+    if (onResetPassword) {
+      onResetPassword()
+    }
   }
 
   render() {
     const { binder, teams } = this.state
 
     return (
-      <form style={{ width: '100%', height: '100%', overflow: 'scroll' }} id='userForm' onSubmit={this.handleSubmit}>
+      <form
+        style={{ width: "100%", height: "100%", overflow: "scroll" }}
+        id="userForm"
+        onSubmit={this.handleSubmit}>
         <Column>
           <Column.Item height={sizeInfo.formColumnSpacing} />
           <Row>
@@ -145,39 +191,79 @@ export class UserForm extends React.Component {
                   <Column.Item>
                     <Row>
                       <Row.Item grow>
-                        <BoundInput label='First Name' name='firstName' message='Must not be empty' binder={binder} />
+                        <BoundInput
+                          label="First Name"
+                          name="firstName"
+                          message="Must not be empty"
+                          binder={binder}
+                        />
                       </Row.Item>
                       <Row.Item width={sizeInfo.formRowSpacing} />
                       <Row.Item grow>
-                        <BoundInput label='Last Name' name='lastName' binder={binder} />
+                        <BoundInput
+                          label="Last Name"
+                          name="lastName"
+                          binder={binder}
+                        />
                       </Row.Item>
                     </Row>
                   </Column.Item>
                   <Column.Item>
                     <Row>
                       <Row.Item grow>
-                        <BoundInput label='Email' name='email' message='Must be a valid email address. Required.' binder={binder} />
+                        <BoundInput
+                          label="Email"
+                          name="email"
+                          message="Must be a valid email address. Required."
+                          binder={binder}
+                        />
                       </Row.Item>
                       <Row.Item width={sizeInfo.formRowSpacing} />
                       <Row.Item>
-                        <BoundEmailIcon name='emailValidated' binder={binder} />
+                        <BoundEmailIcon name="emailValidated" binder={binder} />
                       </Row.Item>
                     </Row>
                   </Column.Item>
                   <Column.Item>
-                    <BoundDropdown name='team' label='Team' icon='team' items={teams} binder={binder} />
+                    <BoundDropdown
+                      name="team"
+                      label="Team"
+                      icon="team"
+                      items={teams}
+                      binder={binder}
+                    />
                   </Column.Item>
                   <Column.Item height={sizeInfo.formColumnSpacing} />
                   <Column.Item minHeight={sizeInfo.buttonHeight}>
                     <Row>
                       <Row.Item>
-                        <BoundButton text='Change Email' name='changeEmail' binder={binder}
+                        <BoundButton
-                          width={sizeInfo.buttonWideWidth} onClick={this.handleChangeEmail} />
+                          text="Reset Password"
+                          name="resetPassword"
+                          binder={binder}
+                          width={sizeInfo.buttonWideWidth}
+                          onClick={this.handleResetPassword}
+                        />
                       </Row.Item>
                       <Row.Item grow />
                       <Row.Item>
-                        <BoundButton text='Resend Confirmation Email' name='resendEmail' binder={binder}
+                        <BoundButton
-                          width={sizeInfo.buttonWideWidth} onClick={this.handleResendEmail} />
+                          text="Change Email"
+                          name="changeEmail"
+                          binder={binder}
+                          width={sizeInfo.buttonWideWidth}
+                          onClick={this.handleChangeEmail}
+                        />
+                      </Row.Item>
+                      <Row.Item width={sizeInfo.formRowSpacing} />
+                      <Row.Item>
+                        <BoundButton
+                          text="Resend Confirmation Email"
+                          name="resendEmail"
+                          binder={binder}
+                          width={sizeInfo.buttonWideWidth}
+                          onClick={this.handleResendEmail}
+                        />
                       </Row.Item>
                     </Row>
                   </Column.Item>
@@ -185,7 +271,11 @@ export class UserForm extends React.Component {
                   <Column.Item>
                     <Row>
                       <Row.Item>
-                        <BoundCheckbox label={'Administrator'} name='administrator' binder={this.state.binder} />
+                        <BoundCheckbox
+                          label={"Administrator"}
+                          name="administrator"
+                          binder={this.state.binder}
+                        />
                       </Row.Item>
                       <Row.Item grow />
                     </Row>
@@ -194,15 +284,30 @@ export class UserForm extends React.Component {
                   <Column.Item minHeight={sizeInfo.buttonHeight}>
                     <Row>
                       <Row.Item>
-                        <BoundButton text='Reset' name='reset' binder={binder} onClick={this.handleReset} />
+                        <BoundButton
+                          text="Reset"
+                          name="reset"
+                          binder={binder}
+                          onClick={this.handleReset}
+                        />
                       </Row.Item>
                       <Row.Item grow />
                       <Row.Item>
-                        <BoundButton text='Remove' name='remove' binder={binder} onClick={this.props.onRemove} />
+                        <BoundButton
+                          text="Remove"
+                          name="remove"
+                          binder={binder}
+                          onClick={this.props.onRemove}
+                        />
                       </Row.Item>
                       <Row.Item width={sizeInfo.formRowSpacing} />
                       <Row.Item>
-                        <BoundButton submit='userForm' text={binder._id ? 'Save' : 'Add'} name='submit' binder={binder} />
+                        <BoundButton
+                          submit="userForm"
+                          text={binder._id ? "Save" : "Add"}
+                          name="submit"
+                          binder={binder}
+                        />
                       </Row.Item>
                     </Row>
                   </Column.Item>

website/src/Users/Users.js

@@ -148,6 +148,35 @@ export class Users extends Component {
     })
   }
 
+  @autobind
+  handleSendPasswordReset() {
+    this.setState({ waitModal: "Sending Password Reset Email..." })
+    api
+      .sendResetPassword(this.state.selectedUser.email)
+      .then(() => {
+        this.setState({
+          waitModal: null,
+          messageModal: {
+            icon: "thumb",
+            message: `An email has been sent to '${
+              this.state.selectedUser.email
+            }' with instructions on how to reset their password`,
+          },
+        })
+      })
+      .catch((error) => {
+        this.setState({
+          error: true,
+          waitModal: null,
+          messageModal: {
+            icon: "hand",
+            message: "Unable to request password reset.",
+            detail: error.message,
+          },
+        })
+      })
+  }
+
   @autobind
   handleResendEmail() {
     this.setState({
@@ -339,6 +368,7 @@ export class Users extends Component {
                     onModifiedChanged={this.handleModifiedChanged}
                     onChangeEmail={this.handleChangeEmail}
                     onResendEmail={this.handleResendEmail}
+                    onResetPassword={this.handleSendPasswordReset}
                   />
                 ) : (
                   <UserFormPlaceholder />