From 77eccc2d536935c242de836cba081654e2fb51f7 Mon Sep 17 00:00:00 2001
From: SondreB <sondre@outlook.com>
Date: Fri, 30 Aug 2024 21:16:52 +0200
Subject: [PATCH] Finish the requests management

---
 app/src/app/connection.service.ts             |  6 ++++
 app/src/app/data/index.ts                     |  1 +
 .../connections/connections.component.html    | 35 +++++++++++--------
 .../connections/connections.component.ts      | 19 ++++------
 4 files changed, 33 insertions(+), 28 deletions(-)

diff --git a/app/src/app/connection.service.ts b/app/src/app/connection.service.ts
index e2525f41..e702e948 100644
--- a/app/src/app/connection.service.ts
+++ b/app/src/app/connection.service.ts
@@ -161,6 +161,7 @@ export class ConnectionService {
     const { records } = await this.identity.web5.dwn.records.query({
       message: {
         filter: {
+          // recipient: inbound ? this.identity.did : undefined,
           protocol: connectionDefinition.protocol,
           protocolPath: 'request',
           schema: connectionDefinition.types.request.schema,
@@ -172,6 +173,11 @@ export class ConnectionService {
     for (let record of records!) {
       const data = await record.data.json();
       let notifiationEvent: ConnectionEntry = { record, data, id: record.id };
+
+      if (record.author == this.identity.did) {
+        notifiationEvent.direction = 'out';
+      }
+
       list.push(notifiationEvent);
     }
 
diff --git a/app/src/app/data/index.ts b/app/src/app/data/index.ts
index e4a1c4d7..6cd23378 100644
--- a/app/src/app/data/index.ts
+++ b/app/src/app/data/index.ts
@@ -11,4 +11,5 @@ export interface RecordEntry<T> {
   id: string;
   data: T;
   loading?: boolean;
+  direction?: 'in' | 'out' | any;
 }
diff --git a/app/src/app/settings/connections/connections.component.html b/app/src/app/settings/connections/connections.component.html
index 292ab943..59a2d0d7 100644
--- a/app/src/app/settings/connections/connections.component.html
+++ b/app/src/app/settings/connections/connections.component.html
@@ -2,7 +2,7 @@ <h1>Connections Management</h1>
 
 <mat-card class="notifications-card">
   <mat-card-header>
-    <mat-card-title>Inbound</mat-card-title>
+    <mat-card-title>Connections</mat-card-title>
   </mat-card-header>
   <mat-card-content>
     @for(entry of service.connections(); track entry) {
@@ -20,7 +20,7 @@ <h1>Connections Management</h1>
         <button mat-button (click)="deleteConnection(entry)" [disabled]="entry.loading">DELETE</button>
       </mat-card-actions>
     </mat-card>
-    } @empty { No inbound connections found. }
+    } @empty { No connections found. }
   </mat-card-content>
 </mat-card>
 
@@ -28,27 +28,32 @@ <h1>Connections Management</h1>
 
 <mat-card class="notifications-card">
   <mat-card-header>
-    <mat-card-title>Outbound</mat-card-title>
+    <mat-card-title>Requests</mat-card-title>
   </mat-card-header>
   <mat-card-content>
     @for(entry of service.requests(); track entry) {
     <mat-card class="card-notification" appearance="outlined">
-      <!-- <mat-card-header>
-        <mat-icon class="card-icon" inline="true" mat-card-avatar></mat-icon>
-        <mat-card-title>{{ entry.data }}</mat-card-title>
-        <mat-card-subtitle>{{ entry.record.dateCreated | ago }}</mat-card-subtitle>
-      </mat-card-header> -->
       <mat-card-content>
-        <!-- {{ entry.data | json }}<br /><br />
-        {{ entry.record | json }} -->
-
-        {{ entry.record.recipient }}
+        @if (entry.direction == 'out') {
+        <app-profile-header [did]="entry.record.recipient"> </app-profile-header>
+        } @else {
+        <app-profile-header [did]="entry.record.author"> </app-profile-header>
+        }
       </mat-card-content>
       <mat-card-actions>
-        <button mat-flat-button [routerLink]="['/profile', entry.record.recipient]">VIEW PROFILE</button>
-        <button mat-button (click)="deleteRequest(entry)" [disabled]="entry.loading">DELETE</button>
+        @if (entry.direction == 'out') {
+        <button mat-flat-button [routerLink]="['/profile', entry.record.recipient]">VIEW PROFILE</button>&nbsp;
+        <button mat-flat-button [disabled]="true">PENDING</button>&nbsp;
+        <button mat-button (click)="reject(entry)" [disabled]="entry.loading">CANCEL</button>
+
+        } @else {
+        <button mat-flat-button [routerLink]="['/profile', entry.record.author]">VIEW PROFILE</button>&nbsp;
+        <button mat-flat-button (click)="accept(entry)" [disabled]="entry.loading">CONFIRM</button>&nbsp;
+        <button mat-button (click)="reject(entry)" [disabled]="entry.loading">DELETE</button>
+
+        }
       </mat-card-actions>
     </mat-card>
-    } @empty { No outbound connections found. }
+    } @empty { No requests found. }
   </mat-card-content>
 </mat-card>
diff --git a/app/src/app/settings/connections/connections.component.ts b/app/src/app/settings/connections/connections.component.ts
index 674a9a42..5aec9c7e 100644
--- a/app/src/app/settings/connections/connections.component.ts
+++ b/app/src/app/settings/connections/connections.component.ts
@@ -7,11 +7,12 @@ import { MatButtonModule } from '@angular/material/button';
 import { MatIconModule } from '@angular/material/icon';
 import { RouterModule } from '@angular/router';
 import { AgoPipe } from '../../shared/pipes/ago.pipe';
+import { ProfileHeaderComponent } from '../../shared/components/profile-header/profile-header.component';
 
 @Component({
   selector: 'app-connections',
   standalone: true,
-  imports: [AgoPipe, CommonModule, MatCardModule, MatButtonModule, MatIconModule, RouterModule],
+  imports: [ProfileHeaderComponent, AgoPipe, CommonModule, MatCardModule, MatButtonModule, MatIconModule, RouterModule],
   templateUrl: './connections.component.html',
   styleUrl: './connections.component.scss',
 })
@@ -20,17 +21,7 @@ export class ConnectionsComponent {
 
   app = inject(AppService);
 
-  constructor() {
-    // effect(async () => {
-    //   if (this.app.initialized()) {
-    //   }
-    // });
-  }
-
-  // async load() {
-  //   const blocks = await this.service.loadBlocks();
-  //   this.blocks.set(blocks);
-  // }
+  constructor() {}
 
   deleteConnection(entry: any) {
     entry.loading = true;
@@ -38,7 +29,9 @@ export class ConnectionsComponent {
     this.service.deleteConnection(entry);
   }
 
-  deleteRequest(entry: any) {
+  accept(entry: any) {}
+
+  reject(entry: any) {
     entry.loading = true;
 
     this.service.deleteRequest(entry);