From 067e14d5a498ae5e467db50da3701de7c6299a82 Mon Sep 17 00:00:00 2001
From: Andrii Shvaika <ashvayka@thingsboard.io>
Date: Fri, 10 Apr 2026 19:12:15 +0300
Subject: [PATCH] fix(iot-hub): load installed devices for browse page card
 state

The device card's "Installed" chip, guide button, and delete/update
buttons need the installed item data. Added installedDevices loading
when DEVICE tab is active, included in getInstalledItem() lookup
and reloadInstalledItems() refresh.

Without this, getInstalledItem() returned undefined for DEVICE type,
so cards showed "Install" instead of "Installed" and the guide button
was never visible.
---
 .../iot-hub/iot-hub-browse.component.ts       | 21 +++++++++++++++++++
 1 file changed, 21 insertions(+)

diff --git a/ui-ngx/src/app/modules/home/components/iot-hub/iot-hub-browse.component.ts b/ui-ngx/src/app/modules/home/components/iot-hub/iot-hub-browse.component.ts
index 86d258c8d9..9182ff5696 100644
--- a/ui-ngx/src/app/modules/home/components/iot-hub/iot-hub-browse.component.ts
+++ b/ui-ngx/src/app/modules/home/components/iot-hub/iot-hub-browse.component.ts
@@ -119,6 +119,7 @@ export class TbIotHubBrowseComponent implements OnInit, OnDestroy {
 
   installedWidgets: IotHubInstalledItem[] = null;
   installedSolutionTemplates: IotHubInstalledItem[] = null;
+  installedDevices: IotHubInstalledItem[] = null;
 
   private searchSubject = new Subject<string>();
   private destroy$ = new Subject<void>();
@@ -197,6 +198,7 @@ export class TbIotHubBrowseComponent implements OnInit, OnDestroy {
       this.loadInstalledSolutionTemplates();
     } else if (type === ItemType.DEVICE) {
       this.loadVendors();
+      this.loadInstalledDevices();
     }
     this.loadItems();
   }
@@ -519,6 +521,9 @@ export class TbIotHubBrowseComponent implements OnInit, OnDestroy {
     if (this.activeType === ItemType.SOLUTION_TEMPLATE && this.installedSolutionTemplates) {
       return this.installedSolutionTemplates.find(i => i.itemId === item.itemId);
     }
+    if (this.activeType === ItemType.DEVICE && this.installedDevices) {
+      return this.installedDevices.find(i => i.itemId === item.itemId);
+    }
     return undefined;
   }
 
@@ -614,6 +619,18 @@ export class TbIotHubBrowseComponent implements OnInit, OnDestroy {
     });
   }
 
+  private loadInstalledDevices(): void {
+    if (this.installedDevices !== null) {
+      return;
+    }
+    const pageLink = new PageLink(10000, 0);
+    this.iotHubApiService.getInstalledItems(pageLink, 'DEVICE', {ignoreLoading: true}).subscribe({
+      next: (data) => {
+        this.installedDevices = data.data;
+      }
+    });
+  }
+
   private loadInstalledSolutionTemplates(): void {
     if (this.installedSolutionTemplates !== null) {
       return;
@@ -637,6 +654,10 @@ export class TbIotHubBrowseComponent implements OnInit, OnDestroy {
       this.iotHubApiService.getInstalledItems(pageLink, ItemType.SOLUTION_TEMPLATE, config).subscribe(data => {
         this.installedSolutionTemplates = data.data;
       });
+    } else if (this.activeType === ItemType.DEVICE) {
+      this.iotHubApiService.getInstalledItems(pageLink, 'DEVICE', config).subscribe(data => {
+        this.installedDevices = data.data;
+      });
     }
   }