john/deighton-ar
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Improve sign-up process for new users

Browse Source
This commit is contained in:
John Lyon-Smith
2018-04-15 16:06:05 -07:00
parent 8c729b604b
commit 6134c3be0f
9 changed files with 247 additions and 119 deletions
Download Patch File Download Diff File Expand all files Collapse all files

90
website/src/Auth/ConfirmEmail.js
View File

@@ -1,56 +1,76 @@
import React from 'react'
import { api } from 'src/API'
import PropTypes from 'prop-types'
import { MessageModal, WaitModal } from '../Modal'
import autobind from 'autobind-decorator'
import React from "react"
import { api } from "src/API"
import PropTypes from "prop-types"
import { MessageModal, WaitModal } from "../Modal"
import autobind from "autobind-decorator"
export class ConfirmEmail extends React.Component {
static propTypes = {
history: PropTypes.oneOfType([PropTypes.array, PropTypes.object])
history: PropTypes.oneOfType([PropTypes.array, PropTypes.object]),
}
constructor() {
super()
this.state = {
waitModal: null,
messageModal: null
messageModal: null,
}
}
componentDidMount(props) {
const emailToken = new URLSearchParams(decodeURIComponent(window.location.search)).get('email-token')
const emailToken = new URLSearchParams(
decodeURIComponent(window.location.search)
).get("email-token")
this.setState({ waitModal: { message: "Validating Email..." } })
this.setState({ waitModal: { message: 'Validating Email...' } })
if (emailToken) {
api.logout().then(() => {
return api.confirmEmail(emailToken)
}).then((response) => {
this.setState({ waitModal: null })
if (response && response.passwordToken) {
// API will send a password reset token if this is the first time loggin on
this.props.history.replace(`/reset-password?password-token=${response.passwordToken}`)
} else {
this.props.history.replace('/login')
}
}).catch((err) => {
this.setState({
waitModal: null,
messageModal: {
icon: 'hand',
message: `Please contact ${process.env.REACT_APP_SUPPORT_EMAIL} to request another confirmation email.`,
detail: err.message
api
.logout()
.then(() => {
return api.confirmEmail(emailToken)
})
.then((response) => {
this.setState({ waitModal: null })
if (response && response.passwordToken) {
this.setState({
waitModal: null,
messageModal: {
icon: "thumb",
message: `Your email is confirmed. You will be redirected to set your password.`,
// API will send a password reset token if this is the first time loggin on
redirect: `/reset-password?password-token=${
response.passwordToken
}`,
},
})
} else {
this.props.history.replace("/login")
}
})
})
.catch((err) => {
this.setState({
waitModal: null,
messageModal: {
icon: "hand",
message: `Please contact ${
process.env.REACT_APP_SUPPORT_EMAIL
} to request another confirmation email.`,
detail: err.message,
},
})
})
} else {
this.props.history.replace('/')
this.props.history.replace("/")
}
}
@autobind
handleMessageModalDismiss() {
const { redirect } = this.state.messageModal
this.setState({ messageModal: null })
this.props.history.replace('/login')
this.props.history.replace(redirect || "/login")
}
render() {
@@ -60,14 +80,16 @@ export class ConfirmEmail extends React.Component {
<div>
<WaitModal
active={!!waitModal}
message={waitModal ? waitModal.message : ''} />
message={waitModal ? waitModal.message : ""}
/>
<MessageModal
open={!!messageModal}
icon={messageModal ? messageModal.icon : ''}
message={messageModal ? messageModal.message : ''}
detail={messageModal ? messageModal.title : ''}
onDismiss={this.handleMessageModalDismiss} />
icon={messageModal ? messageModal.icon : ""}
message={messageModal ? messageModal.message : ""}
detail={messageModal ? messageModal.title : ""}
onDismiss={this.handleMessageModalDismiss}
/>
</div>
)
}