url/homelable
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(detail-panel): replace pixel math and fixed tooltip in ServiceBadge

Browse Source 
- Remove magic-number width calculations (maxTotalWidth, nameCharWidth)
- Remove useState tooltip + position:fixed custom tooltip div
- Use CSS flex/truncate for layout and Shadcn Tooltip for path hover
- Add ServiceBadge rendering tests (name, port, path, link vs plain text)
This commit is contained in:
Pouzor
2026-04-22 23:44:05 +02:00
committed by Remy
parent 26633f760d
commit 1d6127fed3
2 changed files with 46 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/panels/DetailPanel.tsx
+4 -4
View File
@@ -660,10 +660,10 @@ const CATEGORY_COLORS: Record<string, string> = {
}
function ServiceBadge({ svc, host, onEdit, onRemove }: { svc: ServiceInfo; host?: string; onEdit: () => void; onRemove: () => void }) {
const url = getServiceUrl(svc, host);
const color = CATEGORY_COLORS[svc.category ?? ''] ?? '#8b949e';
const hasPort = svc.port != null;
const portLabel = hasPort ? String(svc.port) : '';
const url = getServiceUrl(svc, host)
const color = CATEGORY_COLORS[svc.category ?? ''] ?? '#8b949e'
const hasPort = svc.port != null
const portLabel = hasPort ? String(svc.port) : ''
const pathLabel = svc.path?.trim() ? svc.path.trim() : ''
return (