aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/+my-account
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2019-06-11 14:30:49 +0200
committerChocobozzz <me@florianbigard.com>2019-06-11 14:31:12 +0200
commit0ba5f5baade94a051710d9d9d408ac8083c14ac6 (patch)
treee470a2b546d1d1ac9796b6c8ae3afffccd0aca6c /client/src/app/+my-account
parentd1ab89deb79f70c439b58750d044d9cadf1194e5 (diff)
downloadPeerTube-0ba5f5baade94a051710d9d9d408ac8083c14ac6.tar.gz
PeerTube-0ba5f5baade94a051710d9d9d408ac8083c14ac6.tar.zst
PeerTube-0ba5f5baade94a051710d9d9d408ac8083c14ac6.zip
Add ability to change email in client
Diffstat (limited to 'client/src/app/+my-account')
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-change-email/index.ts1
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-change-email/my-account-change-email.component.html36
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-change-email/my-account-change-email.component.scss24
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-change-email/my-account-change-email.component.ts73
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.html2
-rw-r--r--client/src/app/+my-account/my-account-settings/my-account-settings.component.html3
-rw-r--r--client/src/app/+my-account/my-account.module.ts4
7 files changed, 142 insertions, 1 deletions
diff --git a/client/src/app/+my-account/my-account-settings/my-account-change-email/index.ts b/client/src/app/+my-account/my-account-settings/my-account-change-email/index.ts
new file mode 100644
index 000000000..f42af361e
--- /dev/null
+++ b/client/src/app/+my-account/my-account-settings/my-account-change-email/index.ts
@@ -0,0 +1 @@
export * from './my-account-change-email.component'
diff --git a/client/src/app/+my-account/my-account-settings/my-account-change-email/my-account-change-email.component.html b/client/src/app/+my-account/my-account-settings/my-account-change-email/my-account-change-email.component.html
new file mode 100644
index 000000000..ebfe3126d
--- /dev/null
+++ b/client/src/app/+my-account/my-account-settings/my-account-change-email/my-account-change-email.component.html
@@ -0,0 +1,36 @@
1<div *ngIf="error" class="alert alert-danger">{{ error }}</div>
2<div *ngIf="success" class="alert alert-success">{{ success }}</div>
3
4<div i18n class="current-email">
5 Your current email is <span class="email">{{ user.email }}</span>
6</div>
7
8<div i18n class="pending-email" *ngIf="user.pendingEmail">
9 <span class="email">{{ user.pendingEmail }}</span> is awaiting email verification
10</div>
11
12<form role="form" (ngSubmit)="changeEmail()" [formGroup]="form">
13
14 <div class="form-group">
15 <label i18n for="new-email">New email</label>
16 <input
17 type="email" id="new-email" i18n-placeholder placeholder="Your new email"
18 formControlName="new-email" [ngClass]="{ 'input-error': formErrors['new-email'] }"
19 >
20 <div *ngIf="formErrors['new-email']" class="form-error">
21 {{ formErrors['new-email'] }}
22 </div>
23 </div>
24
25 <div class="form-group">
26 <input
27 type="password" id="password" i18n-placeholder placeholder="Your password"
28 formControlName="password" [ngClass]="{ 'input-error': formErrors['password'] }"
29 >
30 <div *ngIf="formErrors['password']" class="form-error">
31 {{ formErrors['password'] }}
32 </div>
33 </div>
34
35 <input type="submit" i18n-value value="Change email" [disabled]="!form.valid">
36</form>
diff --git a/client/src/app/+my-account/my-account-settings/my-account-change-email/my-account-change-email.component.scss b/client/src/app/+my-account/my-account-settings/my-account-change-email/my-account-change-email.component.scss
new file mode 100644
index 000000000..81eba3ec9
--- /dev/null
+++ b/client/src/app/+my-account/my-account-settings/my-account-change-email/my-account-change-email.component.scss
@@ -0,0 +1,24 @@
1@import '_variables';
2@import '_mixins';
3
4input[type=password],
5input[type=email] {
6 @include peertube-input-text(340px);
7
8 display: block;
9}
10
11input[type=submit] {
12 @include peertube-button;
13 @include orange-button;
14}
15
16.current-email,
17.pending-email {
18 font-size: 16px;
19 margin: 15px 0;
20
21 .email {
22 font-weight: $font-semibold;
23 }
24}
diff --git a/client/src/app/+my-account/my-account-settings/my-account-change-email/my-account-change-email.component.ts b/client/src/app/+my-account/my-account-settings/my-account-change-email/my-account-change-email.component.ts
new file mode 100644
index 000000000..577c5b102
--- /dev/null
+++ b/client/src/app/+my-account/my-account-settings/my-account-change-email/my-account-change-email.component.ts
@@ -0,0 +1,73 @@
1import { Component, OnInit } from '@angular/core'
2import { AuthService, Notifier, ServerService } from '@app/core'
3import { FormReactive, UserService } from '../../../shared'
4import { I18n } from '@ngx-translate/i18n-polyfill'
5import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
6import { UserValidatorsService } from '@app/shared/forms/form-validators/user-validators.service'
7import { User } from '../../../../../../shared'
8import { switchMap, tap } from 'rxjs/operators'
9
10@Component({
11 selector: 'my-account-change-email',
12 templateUrl: './my-account-change-email.component.html',
13 styleUrls: [ './my-account-change-email.component.scss' ]
14})
15export class MyAccountChangeEmailComponent extends FormReactive implements OnInit {
16 error: string = null
17 success: string = null
18 user: User = null
19
20 constructor (
21 protected formValidatorService: FormValidatorService,
22 private userValidatorsService: UserValidatorsService,
23 private notifier: Notifier,
24 private authService: AuthService,
25 private userService: UserService,
26 private serverService: ServerService,
27 private i18n: I18n
28 ) {
29 super()
30 }
31
32 ngOnInit () {
33 this.buildForm({
34 'new-email': this.userValidatorsService.USER_EMAIL,
35 'password': this.userValidatorsService.USER_PASSWORD
36 })
37
38 this.user = this.authService.getUser()
39 }
40
41 changeEmail () {
42 this.error = null
43 this.success = null
44
45 const password = this.form.value[ 'password' ]
46 const email = this.form.value[ 'new-email' ]
47
48 this.userService.changeEmail(password, email)
49 .pipe(
50 tap(() => this.authService.refreshUserInformation())
51 )
52 .subscribe(
53 () => {
54 this.form.reset()
55
56 if (this.serverService.getConfig().signup.requiresEmailVerification) {
57 this.success = this.i18n('Please check your emails to verify your new email.')
58 } else {
59 this.success = this.i18n('Email updated.')
60 }
61 },
62
63 err => {
64 if (err.status === 401) {
65 this.error = this.i18n('You current password is invalid.')
66 return
67 }
68
69 this.error = err.message
70 }
71 )
72 }
73}
diff --git a/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.html b/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.html
index ae797d1bc..a39061ee3 100644
--- a/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.html
+++ b/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.html
@@ -2,7 +2,7 @@
2 2
3<form role="form" (ngSubmit)="changePassword()" [formGroup]="form"> 3<form role="form" (ngSubmit)="changePassword()" [formGroup]="form">
4 4
5 <label i18n for="new-password">Change password</label> 5 <label i18n for="current-password">Change password</label>
6 <input 6 <input
7 type="password" id="current-password" i18n-placeholder placeholder="Current password" 7 type="password" id="current-password" i18n-placeholder placeholder="Current password"
8 formControlName="current-password" [ngClass]="{ 'input-error': formErrors['current-password'] }" 8 formControlName="current-password" [ngClass]="{ 'input-error': formErrors['current-password'] }"
diff --git a/client/src/app/+my-account/my-account-settings/my-account-settings.component.html b/client/src/app/+my-account/my-account-settings/my-account-settings.component.html
index ad64f28fe..f93d41110 100644
--- a/client/src/app/+my-account/my-account-settings/my-account-settings.component.html
+++ b/client/src/app/+my-account/my-account-settings/my-account-settings.component.html
@@ -13,6 +13,9 @@
13<div i18n class="account-title">Password</div> 13<div i18n class="account-title">Password</div>
14<my-account-change-password></my-account-change-password> 14<my-account-change-password></my-account-change-password>
15 15
16<div i18n class="account-title">Email</div>
17<my-account-change-email></my-account-change-email>
18
16<div i18n class="account-title">Video settings</div> 19<div i18n class="account-title">Video settings</div>
17<my-account-video-settings [user]="user" [userInformationLoaded]="userInformationLoaded"></my-account-video-settings> 20<my-account-video-settings [user]="user" [userInformationLoaded]="userInformationLoaded"></my-account-video-settings>
18 21
diff --git a/client/src/app/+my-account/my-account.module.ts b/client/src/app/+my-account/my-account.module.ts
index 4a18a9968..ca5b1f7cb 100644
--- a/client/src/app/+my-account/my-account.module.ts
+++ b/client/src/app/+my-account/my-account.module.ts
@@ -36,6 +36,7 @@ import {
36 MyAccountVideoPlaylistElementsComponent 36 MyAccountVideoPlaylistElementsComponent
37} from '@app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component' 37} from '@app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component'
38import { DragDropModule } from '@angular/cdk/drag-drop' 38import { DragDropModule } from '@angular/cdk/drag-drop'
39import { MyAccountChangeEmailComponent } from '@app/+my-account/my-account-settings/my-account-change-email'
39 40
40@NgModule({ 41@NgModule({
41 imports: [ 42 imports: [
@@ -54,7 +55,10 @@ import { DragDropModule } from '@angular/cdk/drag-drop'
54 MyAccountChangePasswordComponent, 55 MyAccountChangePasswordComponent,
55 MyAccountVideoSettingsComponent, 56 MyAccountVideoSettingsComponent,
56 MyAccountProfileComponent, 57 MyAccountProfileComponent,
58 MyAccountChangeEmailComponent,
59
57 MyAccountVideosComponent, 60 MyAccountVideosComponent,
61
58 VideoChangeOwnershipComponent, 62 VideoChangeOwnershipComponent,
59 MyAccountOwnershipComponent, 63 MyAccountOwnershipComponent,
60 MyAccountAcceptOwnershipComponent, 64 MyAccountAcceptOwnershipComponent,