improve profile reactiveness and action page performance

src/app/module/user/data/datasource/user-local-repository.service.ts

@@ -0,0 +1,52 @@
+import { Injectable } from '@angular/core';
+import { z } from 'zod';
+import { Dexie, EntityTable, liveQuery } from 'Dexie';
+
+const UserProfilePicture = z.object({
+  base64: z.string(),
+  id: z.number().optional(),
+})
+
+const UserTable = z.object({
+  ChunksBase64: z.number(),
+});
+
+export type UserProfilePicture = z.infer<typeof UserProfilePicture>
+
+// Database declaration (move this to its own module also)
+const session = new Dexie('session') as Dexie & {
+  profilePicture: EntityTable<UserProfilePicture, 'id'>;
+};
+
+session.version(1).stores({
+  profilePicture: '++id, base64'
+});
+
+@Injectable({
+  providedIn: 'root'
+})
+export class UserLocalRepositoryService {
+
+  constructor() { }
+
+
+  async addProfilePicture(data: UserProfilePicture) {
+    try {
+      await session.transaction('rw', session.profilePicture, async () => {
+      // Clear existing records from myTable
+      await session.profilePicture.clear();
+      await session.profilePicture.add(data);
+      });
+      console.log('Clear and add operations completed within transaction.');
+    } catch (error) {
+      console.error('Error performing transaction:', error, data);
+    }
+  }
+
+
+  getLiveProfilePicture() {
+    return  liveQuery(() =>
+      session.profilePicture.orderBy('id').reverse().first()
+    )
+  }
+}

src/app/module/user/data/datasource/user-memory-repository.service.ts

@@ -0,0 +1,9 @@
+import { Injectable } from '@angular/core';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class UserMemoryRepositoryService {
+
+  constructor() { }
+}

src/app/module/user/data/datasource/user-remote-repository.service.ts

@@ -0,0 +1,39 @@
+import { Injectable } from '@angular/core';
+import { HttpService } from 'src/app/services/http.service';
+import { environment } from 'src/environments/environment';
+import { IProfilePictureInputDTO } from '../dto/profilePictureInputDTO';
+import { HttpHeaders } from '@angular/common/http';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class UserRemoteRepositoryService {
+
+  constructor(
+    private httpService: HttpService
+  ) { }
+
+  getUserProfilePhoto(guid: string) {
+    const geturl = environment.apiURL + 'UserAuthentication/GetPhoto';
+    
+    const params = {
+      UserPhoto: guid
+    }
+
+    return this.httpService.get<string>(`${geturl}`, params);
+  }
+
+  addUserProfilePhoto(data: IProfilePictureInputDTO) {
+    const geturl = environment.apiURL + 'UserAuthentication/AddPhoto';
+
+    let http = new HttpHeaders();
+
+    http = http.set('content-type', "application/json");
+    http = http.set('accept', "application/json");
+    let options = {
+      headers: http
+    };
+    
+    return this.httpService.post<string>(`${geturl}`, data, options);
+  }
+}

src/app/module/user/data/dto/profilePictureInputDTO.ts

@@ -0,0 +1,9 @@
+import { z } from "zod";
+
+const profilePictureInputDTOSchema = z.object({
+  ImageBase64: z.string()
+})
+
+// const profilePictureInputDTOSchema =  z.string()
+
+export type IProfilePictureInputDTO = z.infer<typeof profilePictureInputDTOSchema>

src/app/module/user/data/user-repository.service.ts

@@ -0,0 +1,47 @@
+import { Injectable } from '@angular/core';
+import { UserRemoteRepositoryService } from './datasource/user-remote-repository.service';
+import { IProfilePictureInputDTO } from './dto/profilePictureInputDTO';
+import { UserLocalRepositoryService } from './datasource/user-local-repository.service';
+import { TracingType } from 'src/app/services/monitoring/opentelemetry/tracer';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class UserRepositoryService {
+
+  constructor(
+    private remote: UserRemoteRepositoryService,
+    private local: UserLocalRepositoryService
+  ) { }
+
+  async getUserProfilePhoto(guid: string , tracing?: TracingType) {
+    const result = await this.remote.getUserProfilePhoto(guid)
+
+    if(result.isOk()) {
+      this.local.addProfilePicture({base64: 'data:image/jpeg;base64,' + result.value})
+    } else {
+      tracing?.setAttribute("picture.upload", "false")
+      tracing?.hasError("cant upload picture")
+    }
+
+    return result
+  }
+
+  async addUserProfilePhoto(data: IProfilePictureInputDTO, tracing?: TracingType) {
+    const result = await this.remote.addUserProfilePhoto(data)
+
+
+    if(result.isOk()) {
+      this.local.addProfilePicture({base64: 'data:image/jpeg;base64,' + data.ImageBase64})
+    } else {
+      tracing?.setAttribute("picture.upload", "false")
+      tracing?.hasError("cant upload picture")
+    }
+
+    return result
+  }
+
+  getProfilePictureLive() {
+    return this.local.getLiveProfilePicture()
+  }
+}