1 import { Component, linkEvent } from 'inferno';
2 import { Subscription } from 'rxjs';
6 PasswordChange as PasswordChangeForm,
8 } from 'lemmy-js-client';
9 import { WebSocketService, UserService } from '../services';
12 capitalizeFirstLetter,
20 import { i18n } from '../i18next';
21 import { HtmlTags } from './html-tags';
24 passwordChangeForm: PasswordChangeForm;
29 export class PasswordChange extends Component<any, State> {
30 private isoData = setIsoData(this.context);
31 private subscription: Subscription;
35 token: this.props.match.params.token,
37 password_verify: undefined,
40 site_view: this.isoData.site_res.site_view,
43 constructor(props: any, context: any) {
44 super(props, context);
46 this.state = this.emptyState;
48 this.parseMessage = this.parseMessage.bind(this);
49 this.subscription = wsSubscribe(this.parseMessage);
52 componentWillUnmount() {
54 this.subscription.unsubscribe();
58 get documentTitle(): string {
59 return `${i18n.t('password_change')} - ${this.state.site_view.site.name}`;
64 <div class="container">
66 title={this.documentTitle}
67 path={this.context.router.route.match.url}
70 <div class="col-12 col-lg-6 offset-lg-3 mb-4">
71 <h5>{i18n.t('password_change')}</h5>
72 {this.passwordChangeForm()}
79 passwordChangeForm() {
81 <form onSubmit={linkEvent(this, this.handlePasswordChangeSubmit)}>
82 <div class="form-group row">
83 <label class="col-sm-2 col-form-label">
84 {i18n.t('new_password')}
86 <div class="col-sm-10">
89 value={this.state.passwordChangeForm.password}
90 onInput={linkEvent(this, this.handlePasswordChange)}
96 <div class="form-group row">
97 <label class="col-sm-2 col-form-label">
98 {i18n.t('verify_password')}
100 <div class="col-sm-10">
103 value={this.state.passwordChangeForm.password_verify}
104 onInput={linkEvent(this, this.handleVerifyPasswordChange)}
110 <div class="form-group row">
111 <div class="col-sm-10">
112 <button type="submit" class="btn btn-secondary">
113 {this.state.loading ? (
114 <svg class="icon icon-spinner spin">
115 <use xlinkHref="#icon-spinner"></use>
118 capitalizeFirstLetter(i18n.t('save'))
127 handlePasswordChange(i: PasswordChange, event: any) {
128 i.state.passwordChangeForm.password = event.target.value;
132 handleVerifyPasswordChange(i: PasswordChange, event: any) {
133 i.state.passwordChangeForm.password_verify = event.target.value;
137 handlePasswordChangeSubmit(i: PasswordChange, event: any) {
138 event.preventDefault();
139 i.state.loading = true;
142 WebSocketService.Instance.send(
143 wsClient.passwordChange(i.state.passwordChangeForm)
147 parseMessage(msg: any) {
148 let op = wsUserOp(msg);
150 toast(i18n.t(msg.error), 'danger');
151 this.state.loading = false;
152 this.setState(this.state);
154 } else if (op == UserOperation.PasswordChange) {
155 let data = wsJsonToRes<LoginResponse>(msg).data;
156 this.state = this.emptyState;
157 this.setState(this.state);
158 UserService.Instance.login(data);
159 this.props.history.push('/');