Implement user deletion

src/app/account/account.component.html

+<p>
+	You can delete your account. All deployments will be withdrawn if you chose to do so.
+</p>
+<p>
+	<mat-checkbox [(ngModel)]="sure"
+		style="margin-right: 8px"
+	 [checked]="sure">
+		I'm sure i want to delete all my data on the server.
+	</mat-checkbox>
+	<button mat-raised-button mat-dialog-close color="primary" (click)="delete()" [disabled]="!sure">Delete</button>
+</p>

src/app/account/account.component.spec.ts

+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AccountComponent } from './account.component';
+
+describe('AccountComponent', () => {
+  let component: AccountComponent;
+  let fixture: ComponentFixture<AccountComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ AccountComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(AccountComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/account/account.component.ts

+import { Component, OnInit } from '@angular/core';
+
+import { UserService } from '../user.service';
+
+@Component({
+  selector: 'app-account',
+  templateUrl: './account.component.html',
+  styleUrls: ['./account.component.css']
+})
+export class AccountComponent implements OnInit {
+  public sure: boolean;
+
+  constructor(
+    public userService: UserService,
+  ) {
+    this.sure = false;
+  }
+
+  ngOnInit() {
+  }
+
+  delete() {
+    this.userService.deleteUser();
+  }
+}

src/app/app.module.ts

@@ -33,6 +33,7 @@ import { LoginComponent } from './login/login.component';
 import { ProfileComponent } from './profile/profile.component';
 import { ServiceComponent } from './service/service.component';
 import { SshKeysComponent } from './ssh-keys/ssh-keys.component';
+import { AccountComponent } from './account/account.component';
 
 /*
 const routes = [
@@ -55,6 +56,7 @@ const routes = [
     ProfileComponent,
     ServiceComponent,
     SshKeysComponent,
+    AccountComponent,
   ],
   imports: [
     BrowserModule,
@@ -95,6 +97,7 @@ const routes = [
   entryComponents: [
     ProfileComponent,
     SshKeysComponent,
+    AccountComponent,
   ],
 })
 export class AppModule {

src/app/dialog.service.ts

@@ -3,11 +3,17 @@ import { MatDialog, MatDialogRef } from '@angular/material/dialog';
 
 import { ProfileComponent } from './profile/profile.component';
 import { SshKeysComponent } from './ssh-keys/ssh-keys.component';
+import { AccountComponent } from './account/account.component';
 
 @Injectable()
 export class DialogService {
   profileDialog: MatDialogRef<any>;
   sshKeysDialog: MatDialogRef<any>;
+  accountDialog: MatDialogRef<any>;
+
+  settings = {
+    width: '80%',
+  };
 
   constructor(
     public dialog: MatDialog,
@@ -16,19 +22,21 @@ export class DialogService {
   public openProfile() {
     this.profileDialog = this.dialog.open(
       ProfileComponent,
-      {
-        width: '80%',
-      }
+      this.settings,
     );
   }
 
   public openSshKeys() {
     this.sshKeysDialog = this.dialog.open(
       SshKeysComponent,
-      {
-        width: '80%',
-      }
+      this.settings,
     );
   }
 
+  public openAccount() {
+    this.accountDialog = this.dialog.open(
+      AccountComponent,
+      this.settings,
+    );
+  }
 }

src/app/login/login.component.html

@@ -12,6 +12,9 @@
 	</form>
 </span>
 <span *ngIf="userService.loggedIn">
+	<button mat-button mat-icon-button (click)="dialog.openAccount()">
+		<mat-icon>settings</mat-icon>
+	</button>
 	<button mat-button mat-icon-button (click)="dialog.openSshKeys()">
 		<mat-icon>vpn_key</mat-icon>
 	</button>

src/app/user.service.ts

@@ -210,4 +210,18 @@ export class UserService {
       }
     );
   }
+
+  public deleteUser() {
+    return this.http.delete('/backend/api/delete_user/').subscribe(
+      (data) => {
+        this.snackBar.open('Deleted user from server');
+        this.updateData(data);
+      },
+      (err) => {
+        this.snackBar.open('Error deleting user from server');
+        console.log(err);
+        this.update();
+      }
+    );
+  }
 }