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:
@@ -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"
|
||||
|
||||
Reference in New Issue
Block a user