tag improvements + avatars

src/app/profile/dashboard/orientation-details/orientation-details.component.html

@@ -34,27 +34,27 @@
             <span class="tags">
               <app-tag-item
                 *ngIf="orientation.status"
-                [label]="this.orientationService.getLabel('status', orientation.status)"
+                [label]="this.orientationService.getTagProperty('status', orientation.status, 'label')"
                 [size]="'small'"
-                [color]="this.orientationService.getColor('status', orientation.status)"
+                [color]="this.orientationService.getTagProperty('status', orientation.status, 'color')"
                 [iconFolder]="'tags'"
-                [iconName]="this.orientationService.getIcon('status', orientation.status)"
+                [iconName]="this.orientationService.getTagProperty('status', orientation.status, 'icon')"
               />
               <app-tag-item
                 *ngIf="orientation.action"
-                [label]="this.orientationService.getLabel('action', orientation.action)"
+                [label]="this.orientationService.getTagProperty('action', orientation.action, 'label')"
                 [size]="'small'"
-                [color]="this.orientationService.getColor('action', orientation.action)"
+                [color]="this.orientationService.getTagProperty('action', orientation.action, 'color')"
                 [iconFolder]="'tags'"
-                [iconName]="this.orientationService.getIcon('action', orientation.action)"
+                [iconName]="this.orientationService.getTagProperty('action', orientation.action, 'icon')"
               />
               <app-tag-item
                 *ngIf="orientation.accompanimentType"
-                [label]="this.orientationService.getType(orientation.accompanimentType).label"
+                [label]="this.orientationService.getTagProperty('type', orientation.accompanimentType, 'label')"
                 [size]="'small'"
-                [color]="this.orientationService.getType(orientation.accompanimentType).color"
+                [color]="this.orientationService.getTagProperty('type', orientation.accompanimentType, 'color')"
                 [iconFolder]="'tags'"
-                [iconName]="this.orientationService.getType(orientation.accompanimentType).icon"
+                [iconName]="this.orientationService.getTagProperty('type', orientation.accompanimentType, 'icon')"
               />
             </span>
           </p>
@@ -81,7 +81,7 @@
               "
               [label]="orientation.socialWorker.name + ' ' + orientation.socialWorker.surname.toUpperCase()"
               [iconFolder]="'avatar'"
-              [iconName]="'avatar1'"
+              [iconName]="orientation.socialWorker.avatar || 'avatar1'"
               [type]="'entity light'"
             />
             <span *ngIf="!orientation.socialWorker" class="hide-on-mobile">Non renseigné</span>
@@ -109,7 +109,7 @@
             <app-tag-item
               [label]="'Jean-Paul Machin'"
               [iconFolder]="'avatar'"
-              [iconName]="'avatar2'"
+              [iconName]="'avatar1'"
               [type]="'entity light'"
             />
           </p>
@@ -177,7 +177,7 @@
               "
               [label]="orientation.orientator.name + ' ' + orientation.orientator.surname.toUpperCase()"
               [iconFolder]="'avatar'"
-              [iconName]="'avatar1'"
+              [iconName]="orientation.orientator.avatar || 'avatar1'"
               [type]="'entity light'"
             />
           </p>

src/app/profile/dashboard/orientations-table/orientations-table.component.html

@@ -40,7 +40,7 @@
         "
         [label]="orientation.socialWorker.name + ' ' + orientation.socialWorker.surname.toUpperCase()"
         [iconFolder]="'avatar'"
-        [iconName]="'avatar1'"
+        [iconName]="orientation.socialWorker.avatar || 'avatar1'"
         [type]="'entity light'"
       />
       <span *ngIf="!orientation.socialWorker" class="hide-on-mobile">Non renseigné</span>
@@ -55,7 +55,7 @@
         "
         [iconClass]="'icon-32'"
         [folder]="'avatar'"
-        [icon]="'avatar1'"
+        [icon]="orientation.socialWorker.avatar || 'avatar1'"
       />
     </div>
     <div>
@@ -79,29 +79,29 @@
     <div>
       <app-tag-item
         *ngIf="orientation.status"
-        [label]="this.orientationService.getLabel('status', orientation.status)"
+        [label]="this.orientationService.getTagProperty('status', orientation.status, 'label')"
         [size]="'small'"
-        [color]="this.orientationService.getColor('status', orientation.status)"
+        [color]="this.orientationService.getTagProperty('status', orientation.status, 'color')"
         [iconFolder]="'tags'"
-        [iconName]="this.orientationService.getIcon('status', orientation.status)"
+        [iconName]="this.orientationService.getTagProperty('status', orientation.status, 'icon')"
       />
     </div>
     <div>
       <app-tag-item
-        *ngIf="type === 'myOrientations' && this.orientationService.getType(orientation.accompanimentType)"
-        [label]="this.orientationService.getType(orientation.accompanimentType).label"
+        *ngIf="type === 'myOrientations' && orientation.accompanimentType"
+        [label]="this.orientationService.getTagProperty('type', orientation.accompanimentType, 'label')"
         [size]="'small'"
-        [color]="this.orientationService.getType(orientation.accompanimentType).color"
+        [color]="this.orientationService.getTagProperty('type', orientation.accompanimentType, 'color')"
         [iconFolder]="'tags'"
-        [iconName]="this.orientationService.getType(orientation.accompanimentType).icon"
+        [iconName]="this.orientationService.getTagProperty('type', orientation.accompanimentType, 'icon')"
       />
       <app-tag-item
         *ngIf="type !== 'myOrientations' && orientation.action"
-        [label]="this.orientationService.getLabel('action', orientation.action)"
+        [label]="this.orientationService.getTagProperty('action', orientation.action, 'label')"
         [size]="'small'"
-        [color]="this.orientationService.getColor('action', orientation.action)"
+        [color]="this.orientationService.getTagProperty('action', orientation.action, 'color')"
         [iconFolder]="'tags'"
-        [iconName]="this.orientationService.getIcon('action', orientation.action)"
+        [iconName]="this.orientationService.getTagProperty('action', orientation.action, 'icon')"
       />
     </div>
     <div class="hide-on-mobile">🢒</div>

src/app/services/orientation.service.ts

@@ -89,38 +89,21 @@ export class OrientationService {
   /**
    * Get label from orientation enum
    */
-  public getLabel(category: 'status' | 'action' | 'type', slug: string): string {
-    return this.getProperty(category, slug, 'label', slug);
+  public getTagProperty<K extends 'label' | 'color' | 'icon'>(
+    category: keyof typeof this.enumMap,
+    slug: string,
+    property: K,
+  ): K extends 'color' ? AllowedColor : string {
+    const value = this.getProperty(category, slug, property);
+
+    if (property === 'color') {
+      return (this.allowedColors.includes(value as AllowedColor) ? value : 'grey') as any;
+    }
+
+    return (value || '') as any;
   }
 
-  /**
-   * Get color from orientation enum
-   */
-  public getColor(category: 'status' | 'action' | 'type', slug: string): AllowedColor {
-    const color = this.getProperty(category, slug, 'color', null);
-    return this.allowedColors.includes(color as AllowedColor) ? (color as AllowedColor) : 'grey';
-  }
-
-  /**
-   * Get icon from orientation enum
-   */
-  public getIcon(category: 'status' | 'action' | 'type', slug: string): string {
-    return this.getProperty(category, slug, 'icon', 'default-icon');
-  }
-
-  /**
-   * helper method to get a property from the enum
-   */
-  private getProperty(category: 'status' | 'action' | 'type', slug: string, property: string, fallback: any): any {
-    const enumObj = this.enumMap[category];
-    return enumObj[slug as keyof typeof enumObj]?.[property] || fallback;
-  }
-
-  /**
-   * Get type from orientation enum
-   */
-  public getType(type: string): any {
-    const displayType = Type[type as keyof typeof Type];
-    return displayType;
+  private getProperty(category: keyof typeof this.enumMap, slug: string, property: string): string {
+    return this.enumMap[category]?.[slug as keyof (typeof this.enumMap)[typeof category]]?.[property] || '';
   }
 }