114 lines
3.2 KiB
TypeScript
114 lines
3.2 KiB
TypeScript
import * as React from "react";
|
|
import axios from "axios";
|
|
import { error as log, init as logInit } from "../toast/toast";
|
|
import { prettyPrintApiErrors } from "../util";
|
|
import { API } from "../api";
|
|
import { Widget, WidgetHeader, WidgetBody, Row, Col } from "../ui/index";
|
|
import { Session } from "../session";
|
|
import { t } from "../i18next_wrapper";
|
|
|
|
export interface State {
|
|
password?: string;
|
|
passwordConfirmation?: string;
|
|
serverURL?: string;
|
|
serverPort?: string;
|
|
}
|
|
|
|
export interface Props { }
|
|
|
|
export class PasswordReset extends React.Component<Props, State> {
|
|
constructor(props: Props) {
|
|
super(props);
|
|
this.state = {
|
|
password: "",
|
|
passwordConfirmation: "",
|
|
serverURL: "",
|
|
serverPort: ""
|
|
};
|
|
}
|
|
|
|
componentDidMount() {
|
|
logInit();
|
|
API.setBaseUrl(API.fetchBrowserLocation());
|
|
this.setState({
|
|
serverURL: API.fetchHostName(),
|
|
serverPort: API.inferPort()
|
|
});
|
|
}
|
|
|
|
set = (name: string) => (event: React.FormEvent<HTMLInputElement>) => {
|
|
const state: { [name: string]: string } = {};
|
|
state[name] = (event.currentTarget).value;
|
|
this.setState(state);
|
|
};
|
|
|
|
submit(e: React.SyntheticEvent<HTMLInputElement>) {
|
|
e.preventDefault();
|
|
const { password, passwordConfirmation } = this.state;
|
|
const token = window.location.href.split("/").pop();
|
|
axios.put(API.current.passwordResetPath, {
|
|
id: token,
|
|
password,
|
|
password_confirmation: passwordConfirmation,
|
|
})
|
|
.then(Session.clear)
|
|
.catch((error: string) => {
|
|
log(prettyPrintApiErrors(error as {}));
|
|
});
|
|
}
|
|
|
|
render() {
|
|
|
|
const buttonStylesUniqueToOnlyThisPage = {
|
|
marginTop: "1rem",
|
|
padding: ".5rem 1.6rem",
|
|
fontSize: "1.2rem",
|
|
borderBottom: "none"
|
|
};
|
|
|
|
return <div className="static-page">
|
|
<div className="all-content-wrapper">
|
|
<h1 className="text-center">
|
|
{t("Reset your password")}
|
|
</h1>
|
|
<br />
|
|
<Row>
|
|
<Col xs={12} sm={6} className="col-sm-push-3">
|
|
<Widget>
|
|
<WidgetHeader
|
|
title={"Reset Password"}
|
|
helpText={t("Password must be 8 or more characters.")} />
|
|
<WidgetBody>
|
|
<form onSubmit={this.submit.bind(this)}>
|
|
<label>
|
|
{t("New Password")}
|
|
</label>
|
|
<input
|
|
type="password"
|
|
onChange={this.set("password").bind(this)} />
|
|
<label>
|
|
{t("Confirm New Password")}
|
|
</label>
|
|
<input
|
|
type="password"
|
|
onChange={this.set("passwordConfirmation").bind(this)} />
|
|
<Row>
|
|
<Col xs={12}>
|
|
<button
|
|
className="fb-button green pull-right"
|
|
title={t("Reset password")}
|
|
style={buttonStylesUniqueToOnlyThisPage}>
|
|
{t("Reset")}
|
|
</button>
|
|
</Col>
|
|
</Row>
|
|
</form>
|
|
</WidgetBody>
|
|
</Widget>
|
|
</Col>
|
|
</Row>
|
|
</div>
|
|
</div>;
|
|
}
|
|
}
|