1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
|
//
// A form to change the user password
//
import React from 'react'
import { Button, Glyphicon, Alert } from 'react-bootstrap'
import Spinner from 'components/spinner'
import PasswordField from 'components/password_field'
import Account from 'models/account'
import bitmask from 'lib/bitmask'
export default class UserPasswordForm extends React.Component {
static get defaultProps() {return{
account: null,
}}
constructor(props) {
super(props)
this.state = {
error: null,
message: null,
loading: false,
currentPassword: null,
newPassword: null,
repeatPassword: null
}
this.submit = this.submit.bind(this)
this.setNew = this.setNew.bind(this)
this.setCurrent = this.setCurrent.bind(this)
this.setRepeat = this.setRepeat.bind(this)
}
setCurrent(value) {
this.setState({currentPassword: value})
}
setNew(value) {
this.setState({newPassword: value})
}
setRepeat(value) {
this.setState({repeatPassword: value})
}
submit(e) {
e.preventDefault() // don't reload the page please!
if (!this.maySubmit()) { return }
this.setState({loading: true})
bitmask.bonafide.user.update(
this.props.account.address,
this.state.currentPassword,
this.state.newPassword).then(
response => {
this.setState({
currentPassword: null,
newPassword: null,
repeatPassword: null,
message: response,
error: null,
loading: false
})
}, error => {
this.setState({
error: error,
message: null,
loading: false
})
}
)
}
maySubmit() {
return (
!this.state.loading &&
this.state.currentPassword &&
this.state.newPassword &&
this.state.newPassword == this.state.repeatPassword
)
}
render () {
let submitButton = null
let message = null
// style may be: success, warning, danger, info
if (this.state.error) {
message = (
<Alert bsStyle="danger">{this.state.error}</Alert>
)
} else if (this.state.message) {
message = (
<Alert bsStyle="success">{this.state.message}</Alert>
)
}
if (this.state.loading) {
submitButton = <Button block disabled={true}><Spinner /></Button>
} else {
submitButton = <Button block disabled={!this.maySubmit()} onClick={this.submit}>Change</Button>
}
return (
<form onSubmit={this.submit}>
{message}
<PasswordField id={this.props.account.id + "-current-password"}
label="Current Password"
validationMode="none"
onChange={this.setCurrent} />
<PasswordField id={this.props.account.id + "-new-password"}
label="New Password"
validationMode="crack"
onChange={this.setNew} />
<PasswordField id={this.props.account.id + "-repeat-password"}
label="Repeat Password"
validationMode="match"
matchText={this.state.newPassword}
onChange={this.setRepeat} />
{submitButton}
</form>
)
}
}
|
