gsadmin/pulse
1
0
Fork 0
mirror of https://github.com/rcourtman/Pulse.git synced 2026-09-22 03:04:03 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: make node names clickable in summary cards

Browse Source 
Added clickable links to node names in both regular and mobile summary cards.
When a node URL is available, users can now click the node name to open the
node's web interface in a new tab.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
courtmanr@gmail.com
2025-05-31 23:50:49 +01:00
parent 04ae1fd0bf
commit b4bae69b83
1 changed files with 18 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/public/js/ui/nodes.js
+18 -2
View File
@@ -97,9 +97,17 @@ PulseApp.ui.nodes = (() => {
const card = document.createElement('div');
card.className = 'bg-white dark:bg-gray-800 shadow-md rounded-lg p-2 border border-gray-200 dark:border-gray-700 flex flex-col gap-1';
// Check if we can make the node name clickable
const hostUrl = PulseApp.utils.getHostUrl(node.displayName || node.node);
let nodeNameContent = node.displayName || node.node || 'N/A';
if (hostUrl) {
nodeNameContent = `<a href="${hostUrl}" target="_blank" rel="noopener noreferrer" class="text-gray-800 dark:text-gray-200 hover:text-blue-600 dark:hover:text-blue-400 transition-colors duration-150 cursor-pointer" title="Open ${node.displayName || node.node} web interface">${node.displayName || node.node || 'N/A'}</a>`;
}
card.innerHTML = `
<div class="flex justify-between items-center">
<h3 class="text-sm font-semibold text-gray-800 dark:text-gray-200 truncate" title="${node.displayName || node.node || 'N/A'}">${node.displayName || node.node || 'N/A'}</h3>
<h3 class="text-sm font-semibold truncate">${nodeNameContent}</h3>
<div class="flex items-center">
<span class="h-2.5 w-2.5 rounded-full ${statusColor} mr-1.5 flex-shrink-0"></span>
<span class="text-xs capitalize text-gray-600 dark:text-gray-400">${statusText}</span>
@@ -233,11 +241,19 @@ PulseApp.ui.nodes = (() => {
const card = document.createElement('div');
card.className = 'bg-white dark:bg-gray-800 shadow-sm rounded-lg p-2 border border-gray-200 dark:border-gray-700';
// Check if we can make the node name clickable
const hostUrl = PulseApp.utils.getHostUrl(node.displayName || node.node);
let nodeNameContent = node.displayName || node.node || 'Unknown';
if (hostUrl) {
nodeNameContent = `<a href="${hostUrl}" target="_blank" rel="noopener noreferrer" class="text-current hover:text-blue-600 dark:hover:text-blue-400 transition-colors duration-150 cursor-pointer" title="Open ${node.displayName || node.node} web interface">${node.displayName || node.node || 'Unknown'}</a>`;
}
card.innerHTML = `
<div class="flex items-center justify-between gap-2">
<div class="flex items-center min-w-0">
<span class="h-2 w-2 rounded-full ${statusDotColor} mr-1.5 flex-shrink-0"></span>
<h3 class="font-semibold text-xs truncate">${node.displayName || node.node || 'Unknown'}</h3>
<h3 class="font-semibold text-xs truncate">${nodeNameContent}</h3>
</div>
<div class="flex items-center gap-3 text-[10px] text-gray-600 dark:text-gray-400">
<span class="flex items-center gap-1">