fix(ipam): show VM id/name/IP in IP map tooltip
All checks were successful
Deploy to Production / Trigger production update (push) Successful in 8s

The IP map tooltip read e.ip, but the backend ip-map endpoint returns
the address as ip_address, so the IP rendered as 'undefined'. Align the
IPAMIPMapEntry type with the backend response and build the tooltip from
proxmox_vmid, resource_name/hostname and ip_address.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
2026-06-20 02:27:04 +05:00
parent 14a6f5ace7
commit 5b781f9e16
2 changed files with 19 additions and 8 deletions

View File

@@ -367,13 +367,20 @@ function IPMapCard({ networkId }: { networkId: number }) {
) : (
<>
<div className="flex flex-wrap gap-1">
{shown.map(e => (
<div
key={e.ip}
title={`${e.ip}${e.resource_name ? ` · ${e.resource_name}` : ''} (${e.status})`}
className={`h-3.5 w-3.5 rounded-sm ${ipMapColors[e.status] ?? 'bg-muted'} ${e.status === 'available' ? 'border border-border' : ''}`}
/>
))}
{shown.map(e => {
const label = [
e.proxmox_vmid != null ? `VMID ${e.proxmox_vmid}` : null,
e.resource_name || e.hostname || null,
e.ip_address,
].filter(Boolean).join(' · ');
return (
<div
key={e.ip_address}
title={`${label} (${e.status})`}
className={`h-3.5 w-3.5 rounded-sm ${ipMapColors[e.status] ?? 'bg-muted'} ${e.status === 'available' ? 'border border-border' : ''}`}
/>
);
})}
</div>
{entries.length > MAX && (
<p className="mt-2 text-xs text-muted-foreground">{t('ipam.ip_map_truncated', { shown: MAX, total: entries.length })}</p>

View File

@@ -38,10 +38,14 @@ export function useIPAMNetworkStats(id: number) {
}
export interface IPAMIPMapEntry {
ip: string;
ip_address: string;
status: 'gateway' | 'allocated' | 'reserved' | 'available' | string;
resource_name?: string | null;
resource_type?: string | null;
hostname?: string | null;
proxmox_vmid?: number | null;
is_gateway?: boolean;
allocation_id?: number | null;
last_seen?: string | null;
}