From 8008afb09f4d6f757561546ff7fcce019909ef51 Mon Sep 17 00:00:00 2001
From: Igor Kulikov <ikulikov@thingsboard.io>
Date: Tue, 21 Apr 2026 10:42:03 +0300
Subject: [PATCH] feat(iot-hub): use 'Connect' label for DEVICE items in cards
 and install dialog

- Item card install button shows 'Connect' instead of 'Install' for DEVICE type
- Device install dialog title shows 'Connect "{name}"' instead of 'Install "{name}"'
- Add prismjs python/c/cpp syntax components for device instruction snippets
---
 ui-ngx/angular.json                                           | 3 +++
 .../home/components/iot-hub/iot-hub-item-card.component.html  | 4 ++--
 ui-ngx/src/assets/locale/locale.constant-en_US.json           | 3 ++-
 3 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/ui-ngx/angular.json b/ui-ngx/angular.json
index 6d90f9ec20..a5e140322b 100644
--- a/ui-ngx/angular.json
+++ b/ui-ngx/angular.json
@@ -130,6 +130,9 @@
               "node_modules/prismjs/components/prism-json.min.js",
               "node_modules/prismjs/components/prism-javascript.min.js",
               "node_modules/prismjs/components/prism-typescript.min.js",
+              "node_modules/prismjs/components/prism-python.min.js",
+              "node_modules/prismjs/components/prism-c.min.js",
+              "node_modules/prismjs/components/prism-cpp.min.js",
               "node_modules/prismjs/plugins/line-numbers/prism-line-numbers.min.js"
             ],
             "allowedCommonJsDependencies": [
diff --git a/ui-ngx/src/app/modules/home/components/iot-hub/iot-hub-item-card.component.html b/ui-ngx/src/app/modules/home/components/iot-hub/iot-hub-item-card.component.html
index ef20917b8f..bdfd149ba1 100644
--- a/ui-ngx/src/app/modules/home/components/iot-hub/iot-hub-item-card.component.html
+++ b/ui-ngx/src/app/modules/home/components/iot-hub/iot-hub-item-card.component.html
@@ -71,7 +71,7 @@
         </button>
       }
     } @else {
-      <button class="tb-iot-hub-card-install-btn" (click)="onInstallClick($event)">{{ 'iot-hub.install' | translate }}</button>
+      <button class="tb-iot-hub-card-install-btn" (click)="onInstallClick($event)">{{ (item.type === ItemType.DEVICE ? 'iot-hub.connect' : 'iot-hub.install') | translate }}</button>
     }
   </div>
 } @else {
@@ -137,7 +137,7 @@
               </button>
             }
           } @else {
-            <button class="tb-iot-hub-card-install-btn" (click)="onInstallClick($event)">{{ 'iot-hub.install' | translate }}</button>
+            <button class="tb-iot-hub-card-install-btn" (click)="onInstallClick($event)">{{ (item.type === ItemType.DEVICE ? 'iot-hub.connect' : 'iot-hub.install') | translate }}</button>
           }
         </span>
       </div>
diff --git a/ui-ngx/src/assets/locale/locale.constant-en_US.json b/ui-ngx/src/assets/locale/locale.constant-en_US.json
index 85221035a0..73381a3f58 100644
--- a/ui-ngx/src/assets/locale/locale.constant-en_US.json
+++ b/ui-ngx/src/assets/locale/locale.constant-en_US.json
@@ -3803,6 +3803,7 @@
         "install-type": "Type: {{type}}",
         "install-creator": "Creator: {{creator}}",
         "install": "Install",
+        "connect": "Connect",
         "connect-device": "Connect device",
         "install-one-more": "Install one more",
         "installing": "Installing...",
@@ -3877,7 +3878,7 @@
         "device-install-resolution-overwrite": "Overwritten",
         "device-install-resolution-create-copy": "Created copy",
         "device-install-gateway-docker-compose": "Download docker-compose.yml for your gateway",
-        "device-install-title": "Install \"{{name}}\"",
+        "device-install-title": "Connect \"{{name}}\"",
         "device-install-complete-title": "Install \"{{name}}\" — Complete",
         "device-installing-title": "Installing \"{{name}}\"",
         "done": "Done",