diff options
author | Dessalines <tyhou13@gmx.com> | 2019-10-29 20:35:39 -0700 |
---|---|---|
committer | Dessalines <tyhou13@gmx.com> | 2019-10-29 20:35:39 -0700 |
commit | 9f35b33dc7238f0d6748beafa79ca0af192b5ca6 (patch) | |
tree | 9199b38cc553822d2e43eed2f5d3d7975d2b702a /ui/src | |
parent | 198b5f10dd18244744b6d82b93155a5c5b569bb9 (diff) |
Halfway done with email, not fully working yet.
Diffstat (limited to 'ui/src')
-rw-r--r-- | ui/src/components/login.tsx | 16 | ||||
-rw-r--r-- | ui/src/components/navbar.tsx | 80 | ||||
-rw-r--r-- | ui/src/components/user.tsx | 13 | ||||
-rw-r--r-- | ui/src/interfaces.ts | 16 | ||||
-rw-r--r-- | ui/src/services/WebSocketService.ts | 5 | ||||
-rw-r--r-- | ui/src/translations/en.ts | 3 |
6 files changed, 70 insertions, 63 deletions
diff --git a/ui/src/components/login.tsx b/ui/src/components/login.tsx index 87fa39fe..c2db7ee6 100644 --- a/ui/src/components/login.tsx +++ b/ui/src/components/login.tsx @@ -6,6 +6,7 @@ import { RegisterForm, LoginResponse, UserOperation, + PasswordResetForm, } from '../interfaces'; import { WebSocketService, UserService } from '../services'; import { msgOp } from '../utils'; @@ -112,6 +113,12 @@ export class Login extends Component<any, State> { class="form-control" required /> + <div + onClick={linkEvent(this, this.handlePasswordReset)} + class="pointer d-inline-block float-right text-muted small font-weight-bold" + > + <T i18nKey="forgot_password">#</T> + </div> </div> </div> <div class="form-group row"> @@ -279,6 +286,13 @@ export class Login extends Component<any, State> { i.setState(i.state); } + handlePasswordReset(i: Login) { + let resetForm: PasswordResetForm = { + email: i.state.loginForm.username_or_email, + }; + WebSocketService.Instance.passwordReset(resetForm); + } + parseMessage(msg: any) { let op: UserOperation = msgOp(msg); if (msg.error) { @@ -299,6 +313,8 @@ export class Login extends Component<any, State> { let res: LoginResponse = msg; UserService.Instance.login(res); this.props.history.push('/communities'); + } else if (op == UserOperation.PasswordReset) { + alert(i18n.t('reset_password_mail_sent')); } } } diff --git a/ui/src/components/navbar.tsx b/ui/src/components/navbar.tsx index 151559df..306dc74f 100644 --- a/ui/src/components/navbar.tsx +++ b/ui/src/components/navbar.tsx @@ -21,7 +21,6 @@ import { T } from 'inferno-i18next'; interface NavbarState { isLoggedIn: boolean; expanded: boolean; - expandUserDropdown: boolean; replies: Array<Comment>; mentions: Array<Comment>; fetchCount: number; @@ -39,14 +38,12 @@ export class Navbar extends Component<any, NavbarState> { replies: [], mentions: [], expanded: false, - expandUserDropdown: false, siteName: undefined, }; constructor(props: any, context: any) { super(props, context); this.state = this.emptyState; - this.handleOverviewClick = this.handleOverviewClick.bind(this); this.keepFetchingUnreads(); @@ -137,50 +134,25 @@ export class Navbar extends Component<any, NavbarState> { <ul class="navbar-nav ml-auto mr-2"> {this.state.isLoggedIn ? ( <> - { - <li className="nav-item"> - <Link class="nav-link" to="/inbox"> - <svg class="icon"> - <use xlinkHref="#icon-mail"></use> - </svg> - {this.state.unreadCount > 0 && ( - <span class="ml-1 badge badge-light"> - {this.state.unreadCount} - </span> - )} - </Link> - </li> - } - <li - className={`nav-item dropdown ${this.state - .expandUserDropdown && 'show'}`} - > - <a - class="pointer nav-link dropdown-toggle" - onClick={linkEvent(this, this.expandUserDropdown)} - role="button" + <li className="nav-item"> + <Link class="nav-link" to="/inbox"> + <svg class="icon"> + <use xlinkHref="#icon-mail"></use> + </svg> + {this.state.unreadCount > 0 && ( + <span class="ml-1 badge badge-light"> + {this.state.unreadCount} + </span> + )} + </Link> + </li> + <li className="nav-item"> + <Link + class="nav-link" + to={`/u/${UserService.Instance.user.username}`} > {UserService.Instance.user.username} - </a> - <div - className={`dropdown-menu dropdown-menu-right ${this.state - .expandUserDropdown && 'show'}`} - > - <a - role="button" - class="dropdown-item pointer" - onClick={linkEvent(this, this.handleOverviewClick)} - > - <T i18nKey="overview">#</T> - </a> - <a - role="button" - class="dropdown-item pointer" - onClick={linkEvent(this, this.handleLogoutClick)} - > - <T i18nKey="logout">#</T> - </a> - </div> + </Link> </li> </> ) : ( @@ -194,24 +166,6 @@ export class Navbar extends Component<any, NavbarState> { ); } - expandUserDropdown(i: Navbar) { - i.state.expandUserDropdown = !i.state.expandUserDropdown; - i.setState(i.state); - } - - handleLogoutClick(i: Navbar) { - i.state.expandUserDropdown = false; - UserService.Instance.logout(); - i.context.router.history.push('/'); - } - - handleOverviewClick(i: Navbar) { - i.state.expandUserDropdown = false; - i.setState(i.state); - let userPage = `/u/${UserService.Instance.user.username}`; - i.context.router.history.push(userPage); - } - expandNavbar(i: Navbar) { i.state.expanded = !i.state.expanded; i.setState(i.state); diff --git a/ui/src/components/user.tsx b/ui/src/components/user.tsx index 3006afc4..361ce633 100644 --- a/ui/src/components/user.tsx +++ b/ui/src/components/user.tsx @@ -376,6 +376,14 @@ export class User extends Component<any, UserState> { </tr> </table> </div> + {this.isCurrentUser && ( + <button + class="btn btn-block btn-secondary mt-3" + onClick={linkEvent(this, this.handleLogoutClick)} + > + <T i18nKey="logout">#</T> + </button> + )} </div> </div> </div> @@ -693,6 +701,11 @@ export class User extends Component<any, UserState> { i.setState(i.state); } + handleLogoutClick(i: User) { + UserService.Instance.logout(); + i.context.router.history.push('/'); + } + handleDeleteAccount(i: User, event: any) { event.preventDefault(); i.state.deleteAccountLoading = true; diff --git a/ui/src/interfaces.ts b/ui/src/interfaces.ts index 2f75efd9..9cd9bef4 100644 --- a/ui/src/interfaces.ts +++ b/ui/src/interfaces.ts @@ -36,6 +36,8 @@ export enum UserOperation { TransferCommunity, TransferSite, DeleteAccount, + PasswordReset, + PasswordChange, } export enum CommentSortType { @@ -686,3 +688,17 @@ export interface SearchResponse { export interface DeleteAccountForm { password: string; } + +export interface PasswordResetForm { + email: string; +} + +export interface PasswordResetResponse { + op: string; +} + +export interface PasswordChangeForm { + token: string; + password: string; + password_verify: string; +} diff --git a/ui/src/services/WebSocketService.ts b/ui/src/services/WebSocketService.ts index ea6c7722..c77816df 100644 --- a/ui/src/services/WebSocketService.ts +++ b/ui/src/services/WebSocketService.ts @@ -30,6 +30,7 @@ import { SearchForm, UserSettingsForm, DeleteAccountForm, + PasswordResetForm, } from '../interfaces'; import { webSocket } from 'rxjs/webSocket'; import { Subject } from 'rxjs'; @@ -274,6 +275,10 @@ export class WebSocketService { this.subject.next(this.wsSendWrapper(UserOperation.DeleteAccount, form)); } + public passwordReset(form: PasswordResetForm) { + this.subject.next(this.wsSendWrapper(UserOperation.PasswordReset, form)); + } + private wsSendWrapper(op: UserOperation, data: any) { let send = { op: UserOperation[op], data: data }; console.log(send); diff --git a/ui/src/translations/en.ts b/ui/src/translations/en.ts index a971ae6e..4e0d81db 100644 --- a/ui/src/translations/en.ts +++ b/ui/src/translations/en.ts @@ -116,6 +116,9 @@ export const en = { unread_messages: 'Unread Messages', password: 'Password', verify_password: 'Verify Password', + forgot_password: 'forgot password', + reset_password_mail_sent: 'Sent an Email to reset your password.', + no_email_setup: "This server hasn't correctly set up email.", email: 'Email', optional: 'Optional', expires: 'Expires', |