More webapp changes+fixes

webapp/src/app/features/account/account-info/account-info.component.ts

@@ -1,6 +1,7 @@
 import { Component, inject, signal, OnInit } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { FormsModule } from '@angular/forms';
+import { Router } from '@angular/router';
 import { NzCardModule } from 'ng-zorro-antd/card';
 import { NzButtonModule } from 'ng-zorro-antd/button';
 import { NzIconModule } from 'ng-zorro-antd/icon';
@@ -12,11 +13,14 @@ import { NzModalModule } from 'ng-zorro-antd/modal';
 import { NzFormModule } from 'ng-zorro-antd/form';
 import { NzInputModule } from 'ng-zorro-antd/input';
 import { NzDividerModule } from 'ng-zorro-antd/divider';
+import { NzPopconfirmModule } from 'ng-zorro-antd/popconfirm';
 import { ApiService } from '../../../core/services/api.service';
 import { AuthService } from '../../../core/services/auth.service';
 import { NotificationService } from '../../../core/services/notification.service';
+import { SettingsService } from '../../../core/services/settings.service';
 import { UserWithExtra } from '../../../core/models';
 import { RelativeTimePipe } from '../../../shared/pipes/relative-time.pipe';
+import { MetadataGridComponent, MetadataValueComponent } from '../../../shared/components/metadata-grid';
 
 @Component({
   selector: 'app-account-info',
@@ -35,7 +39,10 @@ import { RelativeTimePipe } from '../../../shared/pipes/relative-time.pipe';
     NzFormModule,
     NzInputModule,
     NzDividerModule,
+    NzPopconfirmModule,
     RelativeTimePipe,
+    MetadataGridComponent,
+    MetadataValueComponent,
   ],
   templateUrl: './account-info.component.html',
   styleUrl: './account-info.component.scss'
@@ -44,9 +51,13 @@ export class AccountInfoComponent implements OnInit {
   private apiService = inject(ApiService);
   private authService = inject(AuthService);
   private notification = inject(NotificationService);
+  private settingsService = inject(SettingsService);
+  private router = inject(Router);
 
   user = signal<UserWithExtra | null>(null);
   loading = signal(true);
+  deleting = signal(false);
+  expertMode = this.settingsService.expertMode;
 
   // Edit username modal
   showEditModal = signal(false);
@@ -116,4 +127,21 @@ export class AccountInfoComponent implements OnInit {
       }
     });
   }
+
+  deleteAccount(): void {
+    const userId = this.authService.getUserId();
+    if (!userId) return;
+
+    this.deleting.set(true);
+    this.apiService.deleteUser(userId).subscribe({
+      next: () => {
+        this.notification.success('Account deleted');
+        this.authService.logout();
+        this.router.navigate(['/login']);
+      },
+      error: () => {
+        this.deleting.set(false);
+      }
+    });
+  }
 }