refactor: Remove redundant status table from service cards

The toggles (Public, Subdomains, Central TLS) already communicate
everything the table was restating. Replaced with a single routing
summary line: "Routes to X on LAN, Y externally."

Cleaner, no redundancy.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-07-09 23:58:01 +00:00
parent 7c9e8e51d7
commit e1582edfec

View File

@@ -11,7 +11,6 @@ import {
Globe, Loader2, AlertCircle, CheckCircle, Play, RotateCw,
Plus, Trash2, X, ChevronDown, ChevronUp,
} from 'lucide-react';
import { useConfig } from '../hooks';
import { useHaproxy } from '../hooks/useHaproxy';
import { useServices } from '../hooks/useServices';
import { useCert } from '../hooks/useCert';
@@ -38,7 +37,7 @@ function getTlsStatus(service: RegisteredService, certDomains: Set<string>): 'ok
export function ServicesComponent() {
const queryClient = useQueryClient();
const { config: globalConfig } = useConfig();
const {
generate: generateHaproxy, isGenerating: isHaproxyGenerating,
generateData: haproxyGenerateData, generateError: haproxyGenerateError,
@@ -278,35 +277,13 @@ export function ServicesComponent() {
</div>
</div>
{/* Status details */}
<div className="border rounded-lg divide-y text-sm">
<div className="flex items-center justify-between px-3 py-1.5">
<span className="text-muted-foreground">DNS (LAN)</span>
<span className="font-mono text-xs">
{service.domain} {isPassthrough ? backendHost : (globalConfig?.cloud?.dnsmasq?.ip ?? 'Central')}
</span>
</div>
{service.reach === 'public' && (
<div className="flex items-center justify-between px-3 py-1.5">
<span className="text-muted-foreground">DNS (Public)</span>
<span className="font-mono text-xs">A record {publicIp ?? '—'}</span>
</div>
)}
<div className="flex items-center justify-between px-3 py-1.5">
<span className="text-muted-foreground">Proxy</span>
<span className="font-mono text-xs">
{isPassthrough ? 'L4 SNI' : 'L7 HTTP'}{service.subdomains ? ' + wildcard' : ''}
</span>
</div>
<div className="flex items-center justify-between px-3 py-1.5">
<span className="text-muted-foreground">TLS</span>
<span className="font-mono text-xs">
{isPassthrough ? 'backend handles' : (certDomains.has(service.domain) ? 'cert provisioned' : 'cert missing')}
</span>
</div>
</div>
{/* Routing summary */}
<p className="text-xs text-muted-foreground">
Routes to <span className="font-mono text-foreground">{backendHost}</span> on LAN
{service.reach === 'public' && <>, <span className="font-mono text-foreground">{publicIp ?? '—'}</span> externally</>}
</p>
{/* Footer */}
{/* Source + deregister */}
<div className="flex items-center justify-between text-xs text-muted-foreground">
<span>Source: {service.source}</span>
<Button variant="ghost" size="sm"