More webapp changes+fixes

webapp/src/app/features/messages/message-detail/message-detail.component.ts

@@ -1,33 +1,33 @@
 import { Component, inject, signal, OnInit } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { ActivatedRoute, Router } from '@angular/router';
+import { CommonModule, DatePipe } from '@angular/common';
+import { ActivatedRoute, Router, RouterLink } from '@angular/router';
 import { NzCardModule } from 'ng-zorro-antd/card';
 import { NzButtonModule } from 'ng-zorro-antd/button';
 import { NzIconModule } from 'ng-zorro-antd/icon';
-import { NzDescriptionsModule } from 'ng-zorro-antd/descriptions';
 import { NzTagModule } from 'ng-zorro-antd/tag';
 import { NzSpinModule } from 'ng-zorro-antd/spin';
-import { NzPopconfirmModule } from 'ng-zorro-antd/popconfirm';
-import { NzDividerModule } from 'ng-zorro-antd/divider';
 import { ApiService } from '../../../core/services/api.service';
 import { NotificationService } from '../../../core/services/notification.service';
+import { KeyCacheService, ResolvedKey } from '../../../core/services/key-cache.service';
 import { Message } from '../../../core/models';
 import { RelativeTimePipe } from '../../../shared/pipes/relative-time.pipe';
+import { MetadataGridComponent, MetadataValueComponent } from '../../../shared/components/metadata-grid';
 
 @Component({
   selector: 'app-message-detail',
   standalone: true,
   imports: [
     CommonModule,
+    DatePipe,
     NzCardModule,
     NzButtonModule,
     NzIconModule,
-    NzDescriptionsModule,
     NzTagModule,
     NzSpinModule,
-    NzPopconfirmModule,
-    NzDividerModule,
+    RouterLink,
     RelativeTimePipe,
+    MetadataGridComponent,
+    MetadataValueComponent,
   ],
   templateUrl: './message-detail.component.html',
   styleUrl: './message-detail.component.scss'
@@ -37,8 +37,10 @@ export class MessageDetailComponent implements OnInit {
   private router = inject(Router);
   private apiService = inject(ApiService);
   private notification = inject(NotificationService);
+  private keyCacheService = inject(KeyCacheService);
 
   message = signal<Message | null>(null);
+  resolvedKey = signal<ResolvedKey | null>(null);
   loading = signal(true);
   deleting = signal(false);
 
@@ -55,6 +57,7 @@ export class MessageDetailComponent implements OnInit {
       next: (message) => {
         this.message.set(message);
         this.loading.set(false);
+        this.resolveKey(message.used_key_id);
       },
       error: () => {
         this.loading.set(false);
@@ -62,6 +65,12 @@ export class MessageDetailComponent implements OnInit {
     });
   }
 
+  private resolveKey(keyId: string): void {
+    this.keyCacheService.resolveKey(keyId).subscribe({
+      next: (resolved) => this.resolvedKey.set(resolved)
+    });
+  }
+
   goBack(): void {
     this.router.navigate(['/messages']);
   }