From 03159ecde44a24707c7ffda0344cc7b9d4dd1208 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Sun, 21 Jun 2026 20:13:18 +0000
Subject: [PATCH] Match SSH connection name to specific icon (e.g. Linode,
 Portainer) before falling back to generic Linux icon

---
 src/pages/Infrastructure.tsx | 25 ++++++++++++++++++++++++-
 1 file changed, 24 insertions(+), 1 deletion(-)

diff --git a/src/pages/Infrastructure.tsx b/src/pages/Infrastructure.tsx
index 588a681..5d06099 100644
--- a/src/pages/Infrastructure.tsx
+++ b/src/pages/Infrastructure.tsx
@@ -107,6 +107,29 @@ const cdnIconCandidatesByIntegrationType: Record<string, string[]> = {
   ],
 }
 
+// SSH connections are named by the user after whatever host/service they point at
+// (e.g. "Linode", "Portainer") — match known keywords in the connection name to a
+// more specific icon before falling back to the generic Linux icon above.
+const sshNameIconCandidates: { keyword: string; candidates: string[] }[] = [
+  { keyword: 'linode', candidates: [
+    'https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons/png/linode.png',
+    'https://api.iconify.design/simple-icons/linode.svg',
+  ] },
+  { keyword: 'portainer', candidates: [
+    'https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons/png/portainer.png',
+    'https://api.iconify.design/simple-icons/portainer.svg',
+  ] },
+]
+
+function iconCandidatesForNode(node: NodeTile): string[] {
+  if (node.integrationType === 'ssh') {
+    const name = ('isGroup' in node ? node.integration : node.name).toLowerCase()
+    const match = sshNameIconCandidates.find((m) => name.includes(m.keyword))
+    if (match) return [...match.candidates, ...cdnIconCandidatesByIntegrationType.ssh]
+  }
+  return cdnIconCandidatesByIntegrationType[node.integrationType] ?? []
+}
+
 interface NodeGroup {
   isGroup: true
   integration: string
@@ -385,7 +408,7 @@ export default function Infrastructure() {
                         <span style={{ width: '7px', height: '7px', borderRadius: '50%', backgroundColor: nodeStatusColor[node.status], boxShadow: `0 0 6px ${nodeStatusColor[node.status]}` }} />
                         <TileIcon
                           customUrl={node.iconUrl}
-                          candidates={cdnIconCandidatesByIntegrationType[node.integrationType] ?? []}
+                          candidates={iconCandidatesForNode(node)}
                           fallback={NodeIcon}
                         />
                       </div>