4 files changed, 63 insertions, 0 deletions

diff --git a/client/src/app/+my-account/my-account-settings/my-account-danger-zone/index.ts b/client/src/app/+my-account/my-account-settings/my-account-danger-zone/index.ts
new file mode 100644
index 000000000..88a39bb97
--- /dev/null
+++ b/client/src/app/+my-account/my-account-settings/my-account-danger-zone/index.ts
@@ -0,0 +1 @@
+export * from './my-account-danger-zone.component'
diff --git a/client/src/app/+my-account/my-account-settings/my-account-danger-zone/my-account-danger-zone.component.html b/client/src/app/+my-account/my-account-settings/my-account-danger-zone/my-account-danger-zone.component.html
new file mode 100644
index 000000000..8caff972f
--- /dev/null
+++ b/client/src/app/+my-account/my-account-settings/my-account-danger-zone/my-account-danger-zone.component.html
@@ -0,0 +1,5 @@
+<div class="delete-me">
+  <p>Once you delete your account, there is no going back. Please be certain.</p>
+
+  <button (click)="deleteMe()">Delete your account</button>
+</div>
\ No newline at end of file
diff --git a/client/src/app/+my-account/my-account-settings/my-account-danger-zone/my-account-danger-zone.component.scss b/client/src/app/+my-account/my-account-settings/my-account-danger-zone/my-account-danger-zone.component.scss
new file mode 100644
index 000000000..0ca310468
--- /dev/null
+++ b/client/src/app/+my-account/my-account-settings/my-account-danger-zone/my-account-danger-zone.component.scss
@@ -0,0 +1,11 @@
+@import '_variables';
+@import '_mixins';
+
+.delete-me {
+  font-size: 15px;
+
+  button {
+    @include peertube-button;
+    @include grey-button;
+  }
+}
\ No newline at end of file
diff --git a/client/src/app/+my-account/my-account-settings/my-account-danger-zone/my-account-danger-zone.component.ts b/client/src/app/+my-account/my-account-settings/my-account-danger-zone/my-account-danger-zone.component.ts
new file mode 100644
index 000000000..63a121f64
--- /dev/null
+++ b/client/src/app/+my-account/my-account-settings/my-account-danger-zone/my-account-danger-zone.component.ts
@@ -0,0 +1,46 @@
+import { Component, Input } from '@angular/core'
+import { NotificationsService } from 'angular2-notifications'
+import { AuthService, ConfirmService, RedirectService } from '../../../core'
+import { UserService } from '../../../shared'
+import { I18n } from '@ngx-translate/i18n-polyfill'
+import { User } from '@app/shared'
+
+@Component({
+  selector: 'my-account-danger-zone',
+  templateUrl: './my-account-danger-zone.component.html',
+  styleUrls: [ './my-account-danger-zone.component.scss' ]
+})
+export class MyAccountDangerZoneComponent {
+  @Input() user: User = null
+
+  constructor (
+    private authService: AuthService,
+    private notificationsService: NotificationsService,
+    private userService: UserService,
+    private confirmService: ConfirmService,
+    private redirectService: RedirectService,
+    private i18n: I18n
+  ) { }
+
+  async deleteMe () {
+    const res = await this.confirmService.confirmWithInput(
+      this.i18n('Are you sure you want to delete your account? This will delete all you data, including channels, videos etc.'),
+      this.i18n('Type your username to confirm'),
+      this.user.username,
+      this.i18n('Delete your account'),
+      this.i18n('Delete my account')
+    )
+    if (res === false) return
+
+    this.userService.deleteMe().subscribe(
+      () => {
+        this.notificationsService.success(this.i18n('Success'), this.i18n('Your account is deleted.'))
+
+        this.authService.logout()
+        this.redirectService.redirectToHomepage()
+      },
+
+      err => this.notificationsService.error(this.i18n('Error'), err.message)
+    )
+  }
+}