Adds Local Profile Pictures Implementation

src/app/shared/auth/auth.service.ts

@@ -1,11 +1,11 @@
 import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http';
 import { Injectable } from '@angular/core';
-import {first, firstValueFrom, Observable, of, Subject, take} from 'rxjs';
+import {first, firstValueFrom, map, Observable, of, Subject, take, tap} from 'rxjs';
 import { catchError } from 'rxjs/operators';
 import { environment } from 'src/environments/environment';
 import { HttpError } from '../model/httpError/httpError.model';
-import { Token } from '../model/token/token.model';
 import { User } from '../model/user/user.model';
+import * as http from "http";
 
 @Injectable({
     providedIn: 'root'
@@ -56,14 +56,28 @@ export class AuthService {
     }
 
     deleteAccount() {
-        return this.deleteAccountRequest().pipe(
-            first()
-        );
+        return this.deleteAccountRequest();
     }
 
-    addProfilePicture() {
-
+    addProfilePicture(file: File): void {
+        const fileType = file.type.split('/')[1];
+        this.getAddProfilePictureUrl(fileType).subscribe({
+            next: (url: string|null) => {
+                if (url != null) {
+                    this.uploadProfilePicture(url, file).then(
+                        (response: Observable<any>) => {
+                            response.subscribe({
+                                next: (response: any) => {
+                                    this.processProfilePicture().subscribe();
+                                }
+                            });
+                        }
+                    );
+                }
+            }
+        })
     }
+
     private loginUser(userAuthAtempt: User): Observable<User|any> {
 
         let loginParams = new URLSearchParams();
@@ -154,9 +168,11 @@ export class AuthService {
     }
 
     private deleteAccountRequest() {
+        let headers = this.createAuthorizationHeader()
+
         return this.http.delete(
-            this.BACKEND_PATH + `/user/delete/${this.userAuthenticated.id}`,
-            { withCredentials: true }
+            this.BACKEND_PATH + `/user/delete`,
+            { headers: headers, withCredentials: true }
         );
     }
 
@@ -182,4 +198,68 @@ export class AuthService {
             }
         });
     }
+
+    private getAddProfilePictureUrl(fileType: string): Observable<string|null> {
+        return this.http.post<{ presigned_url: string, file_key: string }>(
+            this.BACKEND_PATH + '/user/profile-picture?fileType=' + fileType,
+            null,
+            {
+                headers: this.createAuthorizationHeader(),
+                withCredentials: true
+            }
+        ).pipe(
+            first(),
+            map((res) => {
+                if (!!res && !!res.presigned_url) {
+                    return res.presigned_url;
+                }
+                return null
+            })
+        )
+    }
+
+    private async uploadProfilePicture(url: string, file: File): Promise<Observable<any>> {
+        const fileData = await this.readAsArrayBuffer(file);
+        let headers = new HttpHeaders({
+            'Content-Type': file.type
+        })
+        return this.http.put(
+            url,
+            fileData,
+            {
+                headers: headers,
+            }
+        );
+    }
+
+    private processProfilePicture() {
+        return this.http.post(
+            this.BACKEND_PATH + '/user/profile-picture/proccess',
+            null,
+            {
+                headers: this.createAuthorizationHeader(),
+                withCredentials: true
+            }
+        )
+    }
+
+    private createAuthorizationHeader(): HttpHeaders {
+        return new HttpHeaders({
+            'Content-Type': 'application/json',
+            'Authorization': 'Bearer ' + this.userAuthenticated.accessToken?.token
+        });
+    }
+
+    private async readAsArrayBuffer(file: File): Promise<ArrayBuffer> {
+        const reader = new FileReader();
+        reader.readAsArrayBuffer(file)
+        return new Promise<ArrayBuffer>((resolve, reject) => {
+            reader.onload = () => {
+                resolve(reader.result as ArrayBuffer);
+            };
+            reader.onerror = () => {
+                reject(reader.error);
+            };
+        });
+    }
 }