serve.zone/dcrouter
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(icons): standardize icon identifiers to lucide-prefixed names across operational views

Browse Source
This commit is contained in:
Jürgen Kunz
2026-02-17 10:57:27 +00:00
parent 7ce09c53ca
commit a4ddedaf46
7 changed files with 51 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
changelog.md
View File

@@ -1,5 +1,13 @@
# Changelog # Changelog
## 2026-02-17 - 6.6.1 - fix(icons)
standardize icon identifiers to lucide-prefixed names across operational views
- Replaced legacy/ambiguous icon names with 'lucide:...' identifiers in four UI modules: ts_web/elements/ops-view-certificates.ts, ops-view-network.ts, ops-view-overview.ts, and ops-view-security.ts.
- Updated common action/menu icons (e.g. arrowsRotate -> lucide:RefreshCw, magnifyingGlass -> lucide:Search, copy -> lucide:Copy, fileExport -> lucide:FileOutput).
- Mapped dashboard/tile icons to lucide equivalents (e.g. server -> lucide:Server, networkWired/sitemap -> lucide:Network, download/upload -> lucide:Download/Upload, microchip/memory -> lucide:Cpu/MemoryStick).
- Normalized alert and status icons to lucide names (e.g. triangleExclamation -> lucide:TriangleAlert, shield/userShield -> lucide:Shield/ShieldCheck, clock/clockRotateLeft -> lucide:Clock/History).
## 2026-02-17 - 6.6.0 - feat(remoteingress) ## 2026-02-17 - 6.6.0 - feat(remoteingress)
derive effective remote ingress listen ports from route configs and expose them via ops API derive effective remote ingress listen ports from route configs and expose them via ops API

2
ts/00_commitinfo_data.ts
View File

@@ -3,6 +3,6 @@
*/ */
export const commitinfo = { export const commitinfo = {
name: '@serve.zone/dcrouter', name: '@serve.zone/dcrouter',
version: '6.6.0', version: '6.6.1',
description: 'A multifaceted routing service handling mail and SMS delivery functions.' description: 'A multifaceted routing service handling mail and SMS delivery functions.'
} }

2
ts_web/00_commitinfo_data.ts
View File

@@ -3,6 +3,6 @@
*/ */
export const commitinfo = { export const commitinfo = {
name: '@serve.zone/dcrouter', name: '@serve.zone/dcrouter',
version: '6.6.0', version: '6.6.1',
description: 'A multifaceted routing service handling mail and SMS delivery functions.' description: 'A multifaceted routing service handling mail and SMS delivery functions.'
} }

16
ts_web/elements/ops-view-certificates.ts
View File

@@ -175,7 +175,7 @@ export class OpsViewCertificates extends DeesElement {
title: 'Total Certificates', title: 'Total Certificates',
value: summary.total, value: summary.total,
type: 'number', type: 'number',
icon: 'shieldHalved', icon: 'lucide:ShieldHalf',
color: '#3b82f6', color: '#3b82f6',
}, },
{ {
@@ -183,7 +183,7 @@ export class OpsViewCertificates extends DeesElement {
title: 'Valid', title: 'Valid',
value: summary.valid, value: summary.valid,
type: 'number', type: 'number',
icon: 'check', icon: 'lucide:Check',
color: '#22c55e', color: '#22c55e',
}, },
{ {
@@ -191,7 +191,7 @@ export class OpsViewCertificates extends DeesElement {
title: 'Expiring Soon', title: 'Expiring Soon',
value: summary.expiring, value: summary.expiring,
type: 'number', type: 'number',
icon: 'clock', icon: 'lucide:Clock',
color: '#f59e0b', color: '#f59e0b',
}, },
{ {
@@ -199,7 +199,7 @@ export class OpsViewCertificates extends DeesElement {
title: 'Failed / Expired', title: 'Failed / Expired',
value: summary.failed + summary.expired, value: summary.failed + summary.expired,
type: 'number', type: 'number',
icon: 'triangleExclamation', icon: 'lucide:TriangleAlert',
color: '#ef4444', color: '#ef4444',
}, },
]; ];
@@ -211,7 +211,7 @@ export class OpsViewCertificates extends DeesElement {
.gridActions=${[ .gridActions=${[
{ {
name: 'Refresh', name: 'Refresh',
iconName: 'arrowsRotate', iconName: 'lucide:RefreshCw',
action: async () => { action: async () => {
await appstate.certificateStatePart.dispatchAction( await appstate.certificateStatePart.dispatchAction(
appstate.fetchCertificateOverviewAction, appstate.fetchCertificateOverviewAction,
@@ -243,7 +243,7 @@ export class OpsViewCertificates extends DeesElement {
.dataActions=${[ .dataActions=${[
{ {
name: 'Reprovision', name: 'Reprovision',
iconName: 'arrowsRotate', iconName: 'lucide:RefreshCw',
type: ['inRow'], type: ['inRow'],
actionFunc: async (actionData: { item: interfaces.requests.ICertificateInfo }) => { actionFunc: async (actionData: { item: interfaces.requests.ICertificateInfo }) => {
const cert = actionData.item; const cert = actionData.item;
@@ -270,7 +270,7 @@ export class OpsViewCertificates extends DeesElement {
}, },
{ {
name: 'View Details', name: 'View Details',
iconName: 'magnifyingGlass', iconName: 'lucide:Search',
type: ['doubleClick', 'contextmenu'], type: ['doubleClick', 'contextmenu'],
actionFunc: async (actionData: { item: interfaces.requests.ICertificateInfo }) => { actionFunc: async (actionData: { item: interfaces.requests.ICertificateInfo }) => {
const cert = actionData.item; const cert = actionData.item;
@@ -289,7 +289,7 @@ export class OpsViewCertificates extends DeesElement {
menuOptions: [ menuOptions: [
{ {
name: 'Copy Domain', name: 'Copy Domain',
iconName: 'copy', iconName: 'lucide:Copy',
action: async () => { action: async () => {
await navigator.clipboard.writeText(cert.domain); await navigator.clipboard.writeText(cert.domain);
}, },

16
ts_web/elements/ops-view-network.ts
View File

@@ -287,7 +287,7 @@ export class OpsViewNetwork extends DeesElement {
.dataActions=${[ .dataActions=${[
{ {
name: 'View Details', name: 'View Details',
iconName: 'magnifyingGlass', iconName: 'lucide:Search',
type: ['inRow', 'doubleClick', 'contextmenu'], type: ['inRow', 'doubleClick', 'contextmenu'],
actionFunc: async (actionData) => { actionFunc: async (actionData) => {
await this.showRequestDetails(actionData.item); await this.showRequestDetails(actionData.item);
@@ -336,7 +336,7 @@ export class OpsViewNetwork extends DeesElement {
menuOptions: [ menuOptions: [
{ {
name: 'Copy Request ID', name: 'Copy Request ID',
iconName: 'copy', iconName: 'lucide:Copy',
action: async () => { action: async () => {
await navigator.clipboard.writeText(request.id); await navigator.clipboard.writeText(request.id);
} }
@@ -429,13 +429,13 @@ export class OpsViewNetwork extends DeesElement {
title: 'Active Connections', title: 'Active Connections',
value: activeConnections, value: activeConnections,
type: 'number', type: 'number',
icon: 'plug', icon: 'lucide:Plug',
color: activeConnections > 100 ? '#f59e0b' : '#22c55e', color: activeConnections > 100 ? '#f59e0b' : '#22c55e',
description: `Total: ${this.networkState.requestsTotal || this.statsState.serverStats?.totalConnections || 0}`, description: `Total: ${this.networkState.requestsTotal || this.statsState.serverStats?.totalConnections || 0}`,
actions: [ actions: [
{ {
name: 'View Details', name: 'View Details',
iconName: 'magnifyingGlass', iconName: 'lucide:Search',
action: async () => { action: async () => {
}, },
}, },
@@ -446,7 +446,7 @@ export class OpsViewNetwork extends DeesElement {
title: 'Requests/sec', title: 'Requests/sec',
value: reqPerSec, value: reqPerSec,
type: 'trend', type: 'trend',
icon: 'chartLine', icon: 'lucide:ChartLine',
color: '#3b82f6', color: '#3b82f6',
trendData: trendData, trendData: trendData,
description: `Total: ${this.formatNumber(this.networkState.requestsTotal || 0)} requests`, description: `Total: ${this.formatNumber(this.networkState.requestsTotal || 0)} requests`,
@@ -457,7 +457,7 @@ export class OpsViewNetwork extends DeesElement {
value: this.formatBitsPerSecond(throughput.in), value: this.formatBitsPerSecond(throughput.in),
unit: '', unit: '',
type: 'number', type: 'number',
icon: 'download', icon: 'lucide:Download',
color: '#22c55e', color: '#22c55e',
description: `Total: ${this.formatBytes(this.networkState.totalBytes?.in || 0)}`, description: `Total: ${this.formatBytes(this.networkState.totalBytes?.in || 0)}`,
}, },
@@ -467,7 +467,7 @@ export class OpsViewNetwork extends DeesElement {
value: this.formatBitsPerSecond(throughput.out), value: this.formatBitsPerSecond(throughput.out),
unit: '', unit: '',
type: 'number', type: 'number',
icon: 'upload', icon: 'lucide:Upload',
color: '#8b5cf6', color: '#8b5cf6',
description: `Total: ${this.formatBytes(this.networkState.totalBytes?.out || 0)}`, description: `Total: ${this.formatBytes(this.networkState.totalBytes?.out || 0)}`,
}, },
@@ -480,7 +480,7 @@ export class OpsViewNetwork extends DeesElement {
.gridActions=${[ .gridActions=${[
{ {
name: 'Export Data', name: 'Export Data',
iconName: 'fileExport', iconName: 'lucide:FileOutput',
action: async () => { action: async () => {
console.log('Export feature coming soon'); console.log('Export feature coming soon');
}, },

30
ts_web/elements/ops-view-overview.ts
View File

@@ -163,7 +163,7 @@ export class OpsViewOverview extends DeesElement {
title: 'Server Status', title: 'Server Status',
value: this.statsState.serverStats.uptime ? 'Online' : 'Offline', value: this.statsState.serverStats.uptime ? 'Online' : 'Offline',
type: 'text', type: 'text',
icon: 'server', icon: 'lucide:Server',
color: this.statsState.serverStats.uptime ? '#22c55e' : '#ef4444', color: this.statsState.serverStats.uptime ? '#22c55e' : '#ef4444',
description: `Uptime: ${this.formatUptime(this.statsState.serverStats.uptime)}`, description: `Uptime: ${this.formatUptime(this.statsState.serverStats.uptime)}`,
}, },
@@ -172,7 +172,7 @@ export class OpsViewOverview extends DeesElement {
title: 'Active Connections', title: 'Active Connections',
value: this.statsState.serverStats.activeConnections, value: this.statsState.serverStats.activeConnections,
type: 'number', type: 'number',
icon: 'networkWired', icon: 'lucide:Network',
color: '#3b82f6', color: '#3b82f6',
description: `Total: ${this.statsState.serverStats.totalConnections}`, description: `Total: ${this.statsState.serverStats.totalConnections}`,
}, },
@@ -181,7 +181,7 @@ export class OpsViewOverview extends DeesElement {
title: 'Throughput In', title: 'Throughput In',
value: this.formatBitsPerSecond(this.statsState.serverStats.throughput?.bytesInPerSecond || 0), value: this.formatBitsPerSecond(this.statsState.serverStats.throughput?.bytesInPerSecond || 0),
type: 'text', type: 'text',
icon: 'download', icon: 'lucide:Download',
color: '#22c55e', color: '#22c55e',
description: `Total: ${this.formatBytes(this.statsState.serverStats.throughput?.bytesIn || 0)}`, description: `Total: ${this.formatBytes(this.statsState.serverStats.throughput?.bytesIn || 0)}`,
}, },
@@ -190,7 +190,7 @@ export class OpsViewOverview extends DeesElement {
title: 'Throughput Out', title: 'Throughput Out',
value: this.formatBitsPerSecond(this.statsState.serverStats.throughput?.bytesOutPerSecond || 0), value: this.formatBitsPerSecond(this.statsState.serverStats.throughput?.bytesOutPerSecond || 0),
type: 'text', type: 'text',
icon: 'upload', icon: 'lucide:Upload',
color: '#8b5cf6', color: '#8b5cf6',
description: `Total: ${this.formatBytes(this.statsState.serverStats.throughput?.bytesOut || 0)}`, description: `Total: ${this.formatBytes(this.statsState.serverStats.throughput?.bytesOut || 0)}`,
}, },
@@ -199,7 +199,7 @@ export class OpsViewOverview extends DeesElement {
title: 'CPU Usage', title: 'CPU Usage',
value: cpuUsage, value: cpuUsage,
type: 'gauge', type: 'gauge',
icon: 'microchip', icon: 'lucide:Cpu',
gaugeOptions: { gaugeOptions: {
min: 0, min: 0,
max: 100, max: 100,
@@ -215,7 +215,7 @@ export class OpsViewOverview extends DeesElement {
title: 'Memory Usage', title: 'Memory Usage',
value: memoryUsage, value: memoryUsage,
type: 'percentage', type: 'percentage',
icon: 'memory', icon: 'lucide:MemoryStick',
color: memoryUsage > 80 ? '#ef4444' : memoryUsage > 60 ? '#f59e0b' : '#22c55e', color: memoryUsage > 80 ? '#ef4444' : memoryUsage > 60 ? '#f59e0b' : '#22c55e',
description: this.statsState.serverStats.memoryUsage.actualUsageBytes !== undefined && this.statsState.serverStats.memoryUsage.maxMemoryMB !== undefined description: this.statsState.serverStats.memoryUsage.actualUsageBytes !== undefined && this.statsState.serverStats.memoryUsage.maxMemoryMB !== undefined
? `${this.formatBytes(this.statsState.serverStats.memoryUsage.actualUsageBytes)} / ${this.formatBytes(this.statsState.serverStats.memoryUsage.maxMemoryMB * 1024 * 1024)}` ? `${this.formatBytes(this.statsState.serverStats.memoryUsage.actualUsageBytes)} / ${this.formatBytes(this.statsState.serverStats.memoryUsage.maxMemoryMB * 1024 * 1024)}`
@@ -229,7 +229,7 @@ export class OpsViewOverview extends DeesElement {
.gridActions=${[ .gridActions=${[
{ {
name: 'Refresh', name: 'Refresh',
iconName: 'arrowsRotate', iconName: 'lucide:RefreshCw',
action: async () => { action: async () => {
await appstate.statsStatePart.dispatchAction(appstate.fetchAllStatsAction, null); await appstate.statsStatePart.dispatchAction(appstate.fetchAllStatsAction, null);
}, },
@@ -251,7 +251,7 @@ export class OpsViewOverview extends DeesElement {
title: 'Emails Sent', title: 'Emails Sent',
value: this.statsState.emailStats.sent, value: this.statsState.emailStats.sent,
type: 'number', type: 'number',
icon: 'paperPlane', icon: 'lucide:Send',
color: '#22c55e', color: '#22c55e',
description: `Delivery rate: ${(deliveryRate * 100).toFixed(1)}%`, description: `Delivery rate: ${(deliveryRate * 100).toFixed(1)}%`,
}, },
@@ -260,7 +260,7 @@ export class OpsViewOverview extends DeesElement {
title: 'Emails Received', title: 'Emails Received',
value: this.statsState.emailStats.received, value: this.statsState.emailStats.received,
type: 'number', type: 'number',
icon: 'envelope', icon: 'lucide:Mail',
color: '#3b82f6', color: '#3b82f6',
}, },
{ {
@@ -268,7 +268,7 @@ export class OpsViewOverview extends DeesElement {
title: 'Queued', title: 'Queued',
value: this.statsState.emailStats.queued, value: this.statsState.emailStats.queued,
type: 'number', type: 'number',
icon: 'clock', icon: 'lucide:Clock',
color: '#f59e0b', color: '#f59e0b',
description: 'Pending delivery', description: 'Pending delivery',
}, },
@@ -277,7 +277,7 @@ export class OpsViewOverview extends DeesElement {
title: 'Failed', title: 'Failed',
value: this.statsState.emailStats.failed, value: this.statsState.emailStats.failed,
type: 'number', type: 'number',
icon: 'triangleExclamation', icon: 'lucide:TriangleAlert',
color: '#ef4444', color: '#ef4444',
description: `Bounce rate: ${(bounceRate * 100).toFixed(1)}%`, description: `Bounce rate: ${(bounceRate * 100).toFixed(1)}%`,
}, },
@@ -300,7 +300,7 @@ export class OpsViewOverview extends DeesElement {
title: 'DNS Queries', title: 'DNS Queries',
value: this.statsState.dnsStats.totalQueries, value: this.statsState.dnsStats.totalQueries,
type: 'number', type: 'number',
icon: 'globe', icon: 'lucide:Globe',
color: '#3b82f6', color: '#3b82f6',
description: 'Total queries handled', description: 'Total queries handled',
}, },
@@ -309,7 +309,7 @@ export class OpsViewOverview extends DeesElement {
title: 'Cache Hit Rate', title: 'Cache Hit Rate',
value: cacheHitRate, value: cacheHitRate,
type: 'percentage', type: 'percentage',
icon: 'database', icon: 'lucide:Database',
color: cacheHitRate > 80 ? '#22c55e' : cacheHitRate > 60 ? '#f59e0b' : '#ef4444', color: cacheHitRate > 80 ? '#22c55e' : cacheHitRate > 60 ? '#f59e0b' : '#ef4444',
description: `${this.statsState.dnsStats.cacheHits} hits / ${this.statsState.dnsStats.cacheMisses} misses`, description: `${this.statsState.dnsStats.cacheHits} hits / ${this.statsState.dnsStats.cacheMisses} misses`,
}, },
@@ -318,7 +318,7 @@ export class OpsViewOverview extends DeesElement {
title: 'Active Domains', title: 'Active Domains',
value: this.statsState.dnsStats.activeDomains, value: this.statsState.dnsStats.activeDomains,
type: 'number', type: 'number',
icon: 'sitemap', icon: 'lucide:Network',
color: '#8b5cf6', color: '#8b5cf6',
}, },
{ {
@@ -327,7 +327,7 @@ export class OpsViewOverview extends DeesElement {
value: this.statsState.dnsStats.averageResponseTime.toFixed(1), value: this.statsState.dnsStats.averageResponseTime.toFixed(1),
unit: 'ms', unit: 'ms',
type: 'number', type: 'number',
icon: 'clockRotateLeft', icon: 'lucide:History',
color: this.statsState.dnsStats.averageResponseTime < 50 ? '#22c55e' : '#f59e0b', color: this.statsState.dnsStats.averageResponseTime < 50 ? '#22c55e' : '#f59e0b',
}, },
]; ];

20
ts_web/elements/ops-view-security.ts
View File

@@ -256,7 +256,7 @@ export class OpsViewSecurity extends DeesElement {
title: 'Threat Level', title: 'Threat Level',
value: threatScore, value: threatScore,
type: 'gauge', type: 'gauge',
icon: 'shield', icon: 'lucide:Shield',
gaugeOptions: { gaugeOptions: {
min: 0, min: 0,
max: 100, max: 100,
@@ -273,7 +273,7 @@ export class OpsViewSecurity extends DeesElement {
title: 'Blocked Threats', title: 'Blocked Threats',
value: metrics.blockedIPs.length + metrics.spamDetected, value: metrics.blockedIPs.length + metrics.spamDetected,
type: 'number', type: 'number',
icon: 'userShield', icon: 'lucide:ShieldCheck',
color: '#ef4444', color: '#ef4444',
description: 'Total threats blocked today', description: 'Total threats blocked today',
}, },
@@ -282,7 +282,7 @@ export class OpsViewSecurity extends DeesElement {
title: 'Active Sessions', title: 'Active Sessions',
value: 0, value: 0,
type: 'number', type: 'number',
icon: 'users', icon: 'lucide:Users',
color: '#22c55e', color: '#22c55e',
description: 'Current authenticated sessions', description: 'Current authenticated sessions',
}, },
@@ -291,7 +291,7 @@ export class OpsViewSecurity extends DeesElement {
title: 'Auth Failures', title: 'Auth Failures',
value: metrics.authenticationFailures, value: metrics.authenticationFailures,
type: 'number', type: 'number',
icon: 'lockOpen', icon: 'lucide:LockOpen',
color: metrics.authenticationFailures > 10 ? '#ef4444' : '#f59e0b', color: metrics.authenticationFailures > 10 ? '#ef4444' : '#f59e0b',
description: 'Failed login attempts today', description: 'Failed login attempts today',
}, },
@@ -355,7 +355,7 @@ export class OpsViewSecurity extends DeesElement {
title: 'Authentication Failures', title: 'Authentication Failures',
value: metrics.authenticationFailures, value: metrics.authenticationFailures,
type: 'number', type: 'number',
icon: 'lockOpen', icon: 'lucide:LockOpen',
color: metrics.authenticationFailures > 10 ? '#ef4444' : '#f59e0b', color: metrics.authenticationFailures > 10 ? '#ef4444' : '#f59e0b',
description: 'Failed authentication attempts today', description: 'Failed authentication attempts today',
}, },
@@ -364,7 +364,7 @@ export class OpsViewSecurity extends DeesElement {
title: 'Successful Logins', title: 'Successful Logins',
value: 0, value: 0,
type: 'number', type: 'number',
icon: 'lock', icon: 'lucide:Lock',
color: '#22c55e', color: '#22c55e',
description: 'Successful logins today', description: 'Successful logins today',
}, },
@@ -399,7 +399,7 @@ export class OpsViewSecurity extends DeesElement {
title: 'Malware Detection', title: 'Malware Detection',
value: metrics.malwareDetected, value: metrics.malwareDetected,
type: 'number', type: 'number',
icon: 'virusSlash', icon: 'lucide:BugOff',
color: metrics.malwareDetected > 0 ? '#ef4444' : '#22c55e', color: metrics.malwareDetected > 0 ? '#ef4444' : '#22c55e',
description: 'Malware detected', description: 'Malware detected',
}, },
@@ -408,7 +408,7 @@ export class OpsViewSecurity extends DeesElement {
title: 'Phishing Detection', title: 'Phishing Detection',
value: metrics.phishingDetected, value: metrics.phishingDetected,
type: 'number', type: 'number',
icon: 'fishFins', icon: 'lucide:Fish',
color: metrics.phishingDetected > 0 ? '#ef4444' : '#22c55e', color: metrics.phishingDetected > 0 ? '#ef4444' : '#22c55e',
description: 'Phishing attempts detected', description: 'Phishing attempts detected',
}, },
@@ -417,7 +417,7 @@ export class OpsViewSecurity extends DeesElement {
title: 'Suspicious Activities', title: 'Suspicious Activities',
value: metrics.suspiciousActivities, value: metrics.suspiciousActivities,
type: 'number', type: 'number',
icon: 'triangleExclamation', icon: 'lucide:TriangleAlert',
color: metrics.suspiciousActivities > 5 ? '#ef4444' : '#f59e0b', color: metrics.suspiciousActivities > 5 ? '#ef4444' : '#f59e0b',
description: 'Suspicious activities detected', description: 'Suspicious activities detected',
}, },
@@ -426,7 +426,7 @@ export class OpsViewSecurity extends DeesElement {
title: 'Spam Detection', title: 'Spam Detection',
value: metrics.spamDetected, value: metrics.spamDetected,
type: 'number', type: 'number',
icon: 'ban', icon: 'lucide:Ban',
color: '#f59e0b', color: '#f59e0b',
description: 'Spam emails blocked', description: 'Spam emails blocked',
}, },