From 566bd1aaf13cbcc119b2ce4bfb4e02ac25eb84f4 Mon Sep 17 00:00:00 2001
From: albaintor <118518828+albaintor@users.noreply.github.com>
Date: Mon, 7 Oct 2024 14:49:19 +0200
Subject: [PATCH] Various improvements

---
 .../active-entities.component.ts              | 28 +++++++++++++++++--
 .../activity-viewer.component.html            |  4 +--
 src/app/helper.ts                             | 21 ++++++++++++++
 3 files changed, 48 insertions(+), 5 deletions(-)

diff --git a/src/app/active-entities/active-entities.component.ts b/src/app/active-entities/active-entities.component.ts
index 590173b..2354da0 100644
--- a/src/app/active-entities/active-entities.component.ts
+++ b/src/app/active-entities/active-entities.component.ts
@@ -68,6 +68,7 @@ interface Dashboard
 })
 export class ActiveEntitiesComponent implements OnInit {
   remoteState: RemoteState | undefined;
+  dashboardEntities: MediaEntityState[] = [];
   mediaEntities: MediaEntityState[] = [];
   protected readonly Math = Math;
   menuItems: MenuItem[] = [
@@ -89,6 +90,7 @@ export class ActiveEntitiesComponent implements OnInit {
   showDashboardDialog = false;
   dashboardName: string | undefined;
   selectedDashboard: Dashboard | undefined;
+  addNewStates = true;
 
   constructor(private server:ServerService, protected remoteWebsocketService: RemoteWebsocketService,
               private cdr:ChangeDetectorRef, private messageService: MessageService,
@@ -123,7 +125,21 @@ export class ActiveEntitiesComponent implements OnInit {
       this.cdr.detectChanges();
     })
     this.remoteWebsocketService.onMediaStateChange().subscribe(remoteState => {
-      this.mediaEntities = this.remoteWebsocketService.mediaEntities;
+      if (this.dashboardEntities)
+      {
+        remoteState.forEach(mediaState => {
+          if (this.mediaEntities.includes(mediaState)) return;
+          const existingEntity = this.mediaEntities.find(item => item.entity_id === mediaState.entity_id);
+          if (existingEntity)
+          {
+            this.mediaEntities[this.mediaEntities.indexOf(existingEntity)] = mediaState;
+          }
+          else if (this.addNewStates)
+            this.mediaEntities.push(mediaState);
+        });
+      }
+      else
+        this.mediaEntities = this.remoteWebsocketService.mediaEntities;
       this.cdr.detectChanges();
     })
     this.remoteWebsocketService.onMediaPositionChange().subscribe(entities => {
@@ -305,14 +321,20 @@ export class ActiveEntitiesComponent implements OnInit {
     if (!dashboard || !this.selectedRemote) return;
     this.dashboardName = dashboard.name;
     this.mediaEntities = [];
+    this.dashboardEntities = [];
     const remote = this.selectedRemote;
     dashboard.dashboardEntityIds.forEach(entityId => {
       let entity = this.remoteWebsocketService.mediaEntities.find(item => item.entity_id === entityId);
       if (!entity) this.server.getRemotetEntity(remote, entityId).subscribe(entity => {
-        this.mediaEntities.push({...entity, new_state: {attributes: entity.attributes, features: entity.features }} as any);
+        const mediaState = {...entity, new_state: {attributes: entity.attributes, features: entity.features }} as any;
+        this.mediaEntities.push(mediaState)
+        this.dashboardEntities.push(mediaState);
         this.cdr.detectChanges();
       })
-      else this.mediaEntities.push(entity);
+      else {
+        this.mediaEntities.push(entity);
+        this.dashboardEntities.push(entity);
+      }
     });
     this.selectedActivities = [];
     dashboard.popupEntitiyIds.forEach(entityId => {
diff --git a/src/app/activity-viewer/activity-viewer.component.html b/src/app/activity-viewer/activity-viewer.component.html
index 0e1559e..c105123 100644
--- a/src/app/activity-viewer/activity-viewer.component.html
+++ b/src/app/activity-viewer/activity-viewer.component.html
@@ -40,8 +40,8 @@ <h3>Activity</h3>
       <div><b>{{item.name}}</b> [<span [style]="{'color': getBackgroundColor(item.entity_type)}">{{item.entity_type}}</span>] ({{item.entity_id}})</div>
     </ng-template>
   </p-dropdown>
-  <p-chip *ngFor="let entity of activity?.options?.included_entities" [label]="Helper.getEntityName(entity)"
-          [style]="getStyle(Helper.getEntityName(entity))" [pTooltip]="entity.entity_id" [removable]="editMode"
+  <p-chip *ngFor="let entity of activity?.options?.included_entities" label="{{Helper.getEntityName(entity)}} ({{Helper.getEntityType(entity)}})"
+          [style]="getStyle(Helper.getEntityType(entity))" [pTooltip]="entity.entity_id" [removable]="editMode"
           (onRemove)="deleteIncludedEntity(entity, $event)"></p-chip>&nbsp;
 </p-toolbar>
 <h3>Buttons mapping and startup/stop sequences</h3>
diff --git a/src/app/helper.ts b/src/app/helper.ts
index 3c31710..0b26e5a 100644
--- a/src/app/helper.ts
+++ b/src/app/helper.ts
@@ -323,6 +323,27 @@ export class Helper
     return "";
   }
 
+  static getEntityType(entity: any): string
+  {
+    if (!entity?.entity_type) return "";
+    switch(entity.entity_type)
+    {
+      case "media_player": return "media player";
+      case "remote": if (entity.integration && typeof entity.integration === "string") return Helper.getEntityTypeFromIntegration(entity);
+        if (entity.entity_id.startsWith("uc.main")) return "IR remote";
+        if (entity.entity_id.startsWith("uc_bt")) return "BR remote";
+        return "remote";
+      default:return entity.entity_type;
+    }
+  }
+
+  static getEntityTypeFromIntegration(entity: any): string
+  {
+    if (entity.integration === "uc.main") return "IR remote";
+    if (entity.integration === "uc_bt.main") return "BT remote";
+    return entity.entity_type;
+  }
+
   static isIntersection(rectangle1: {x: number, y: number, width: number, height:number},
                         rectangle2: {x: number, y: number, width: number, height:number}): boolean
   {