120 lines
3.7 KiB
JavaScript

import React from "react"
import { connect } from "react-redux"
import { bindActionCreators } from "redux"
import { updateUser } from "../../actions/users"
import Modules from "../modules/modules"
function mapStateToProps(state) {
return {
polochonToken: state.userStore.get("polochonToken"),
polochonUrl: state.userStore.get("polochonUrl"),
modules : state.userStore.get("modules"),
};
}
const mapDispatchToProps = (dispatch) =>
bindActionCreators({ updateUser }, dispatch)
function UserProfile(props) {
return (
<div>
<UserEdit
polochonToken={props.polochonToken}
polochonUrl={props.polochonUrl}
updateUser={props.updateUser}
/>
<Modules modules={props.modules} />
</div>
)
}
class UserEdit extends React.PureComponent {
constructor(props) {
super(props);
this.state = {
polochonToken: props.polochonToken,
polochonUrl: props.polochonUrl,
};
this.handleSubmit = this.handleSubmit.bind(this);
this.handleUrlInput = this.handleUrlInput.bind(this);
this.handleTokenInput = this.handleTokenInput.bind(this);
}
handleSubmit(ev) {
ev.preventDefault();
this.props.updateUser({
"polochon_url": this.refs.polochonUrl.value,
"polochon_token": this.refs.polochonToken.value,
"password": this.refs.newPassword.value,
"password_confirm": this.refs.newPasswordConfirm.value,
});
}
handleTokenInput() {
this.setState({ polochonToken: this.refs.polochonToken.value });
}
handleUrlInput() {
this.setState({ polochonUrl: this.refs.polochonUrl.value });
}
componentWillReceiveProps(nextProps) {
if ((nextProps.polochonUrl !== "")
&& (this.state.polochonUrl === "")
&& (nextProps.polochonToken !== "")
&& (this.state.polochonToken === "")) {
this.setState({
polochonToken: nextProps.polochonToken,
polochonUrl: nextProps.polochonUrl,
});
}
}
render() {
return (
<div className="container">
<div className="content-fluid">
<div className="col-md-6 col-md-offset-3 col-xs-12">
<h2>Edit user</h2>
<hr />
<form className="form-horizontal" onSubmit={(ev) => this.handleSubmit(ev)}>
<div className="form-group">
<label className="control-label">Polochon URL</label>
<input
className="form-control"
value={this.state.polochonUrl}
onChange={this.handleUrlInput}
ref="polochonUrl"
/>
</div>
<div className="form-group">
<label className="control-label">Polochon token</label>
<input
className="form-control"
value={this.state.polochonToken}
onChange={this.handleTokenInput}
ref="polochonToken"
/>
</div>
<hr />
<div className="form-group">
<label className="control-label">Password</label>
<input type="password" autoComplete="off" ref="newPassword" className="form-control"/>
</div>
<div className="form-group">
<label className="control-label">Confirm Password</label>
<input type="password" autoComplete="off" ref="newPasswordConfirm" className="form-control"/>
</div>
<div>
<input type="submit" className="btn btn-primary pull-right" value="Update"/>
</div>
</form>
</div>
</div>
</div>
);
}
}
export default connect(mapStateToProps, mapDispatchToProps)(UserProfile);