Mirrors/ProxMenux
1
0
Fork 0
mirror of https://github.com/MacRimi/ProxMenux.git synced 2025-10-11 20:36:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update AppImage

Browse Source
This commit is contained in:
MacRimi
2025-10-05 11:48:32 +02:00
parent 816cf0141b
commit f5ac194008
2 changed files with 55 additions and 99 deletions
Download Patch File Download Diff File Expand all files Collapse all files

143
AppImage/components/network-metrics.tsx
View File

@@ -56,6 +56,7 @@ interface NetworkInterface {
bond_slaves?: string[] bond_slaves?: string[]
bond_active_slave?: string | null bond_active_slave?: string | null
bridge_members?: string[] bridge_members?: string[]
bridge_physical_interface?: string
packet_loss_in?: number packet_loss_in?: number
packet_loss_out?: number packet_loss_out?: number
vmid?: number vmid?: number
@@ -358,21 +359,26 @@ export function NetworkMetrics() {
className="flex flex-col gap-3 p-4 rounded-lg border border-border bg-card/50 hover:bg-card/80 transition-colors cursor-pointer" className="flex flex-col gap-3 p-4 rounded-lg border border-border bg-card/50 hover:bg-card/80 transition-colors cursor-pointer"
onClick={() => setSelectedInterface(interface_)} onClick={() => setSelectedInterface(interface_)}
> >
{/* First row: Icon, Name, Type Badge, Status */} {/* First row: Icon, Name, Type Badge, Physical Interface, Status */}
<div className="flex items-center gap-3 flex-wrap"> <div className="flex items-center gap-3 flex-wrap">
<Wifi className="h-5 w-5 text-muted-foreground flex-shrink-0" /> <Wifi className="h-5 w-5 text-muted-foreground flex-shrink-0" />
<div className="flex items-center gap-2 min-w-0"> <div className="flex items-center gap-2 min-w-0 flex-1">
<div className="font-medium text-foreground">{interface_.name}</div> <div className="font-medium text-foreground">{interface_.name}</div>
<Badge variant="outline" className={typeBadge.color}> <Badge variant="outline" className={typeBadge.color}>
{typeBadge.label} {typeBadge.label}
</Badge> </Badge>
{interface_.bridge_physical_interface && (
<div className="text-sm text-blue-500 font-medium">
→ {interface_.bridge_physical_interface}
</div>
)}
</div> </div>
<Badge <Badge
variant="outline" variant="outline"
className={ className={
interface_.status === "up" interface_.status === "up"
? "bg-green-500/10 text-green-500 border-green-500/20 ml-auto" ? "bg-green-500/10 text-green-500 border-green-500/20"
: "bg-red-500/10 text-red-500 border-red-500/20 ml-auto" : "bg-red-500/10 text-red-500 border-red-500/20"
} }
> >
{interface_.status.toUpperCase()} {interface_.status.toUpperCase()}
@@ -422,88 +428,6 @@ export function NetworkMetrics() {
</Card> </Card>
)} )}
{/* Network Interfaces */}
<Card className="bg-card border-border">
<CardHeader>
<CardTitle className="text-foreground flex items-center">
<Router className="h-5 w-5 mr-2" />
Network Interfaces
</CardTitle>
</CardHeader>
<CardContent>
<div className="space-y-4">
{networkData.interfaces.map((interface_, index) => {
const typeBadge = getInterfaceTypeBadge(interface_.type)
return (
<div
key={index}
className="flex flex-col gap-3 p-4 rounded-lg border border-border bg-card/50 hover:bg-card/80 transition-colors cursor-pointer"
onClick={() => setSelectedInterface(interface_)}
>
{/* First row: Icon, Name, Type Badge, Status */}
<div className="flex items-center gap-3 flex-wrap">
<Wifi className="h-5 w-5 text-muted-foreground flex-shrink-0" />
<div className="flex items-center gap-2 min-w-0">
<div className="font-medium text-foreground">{interface_.name}</div>
<Badge variant="outline" className={typeBadge.color}>
{typeBadge.label}
</Badge>
</div>
<Badge
variant="outline"
className={
interface_.status === "up"
? "bg-green-500/10 text-green-500 border-green-500/20 ml-auto"
: "bg-red-500/10 text-red-500 border-red-500/20 ml-auto"
}
>
{interface_.status.toUpperCase()}
</Badge>
</div>
{/* Second row: Details - Responsive layout */}
<div className="grid grid-cols-2 md:grid-cols-4 gap-4 text-sm">
<div>
<div className="text-muted-foreground text-xs">IP Address</div>
<div className="font-medium text-foreground font-mono text-sm truncate">
{interface_.addresses.length > 0 ? interface_.addresses[0].ip : "N/A"}
</div>
</div>
<div>
<div className="text-muted-foreground text-xs">Speed</div>
<div className="font-medium text-foreground flex items-center gap-1">
<Zap className="h-3 w-3" />
{formatSpeed(interface_.speed)}
</div>
</div>
<div className="col-span-2 md:col-span-1">
<div className="text-muted-foreground text-xs">Traffic</div>
<div className="font-medium text-foreground text-xs">
<span className="text-green-500">↓ {formatBytes(interface_.bytes_recv)}</span>
{" / "}
<span className="text-blue-500">↑ {formatBytes(interface_.bytes_sent)}</span>
</div>
</div>
{interface_.mac_address && (
<div className="col-span-2 md:col-span-1">
<div className="text-muted-foreground text-xs">MAC</div>
<div className="font-medium text-foreground font-mono text-xs truncate">
{interface_.mac_address}
</div>
</div>
)}
</div>
</div>
)
})}
</div>
</CardContent>
</Card>
{networkData.vm_lxc_interfaces && networkData.vm_lxc_interfaces.length > 0 && ( {networkData.vm_lxc_interfaces && networkData.vm_lxc_interfaces.length > 0 && (
<Card className="bg-card border-border"> <Card className="bg-card border-border">
<CardHeader> <CardHeader>
@@ -554,7 +478,7 @@ export function NetworkMetrics() {
<div className="grid grid-cols-2 md:grid-cols-4 gap-4 text-sm"> <div className="grid grid-cols-2 md:grid-cols-4 gap-4 text-sm">
<div> <div>
<div className="text-muted-foreground text-xs">VMID</div> <div className="text-muted-foreground text-xs">VMID</div>
<div className="font-medium text-foreground">{interface_.vmid ?? "N/A"}</div> <div className="font-medium">{interface_.vmid ?? "N/A"}</div>
</div> </div>
<div> <div>
@@ -617,6 +541,27 @@ export function NetworkMetrics() {
{getInterfaceTypeBadge(selectedInterface.type).label} {getInterfaceTypeBadge(selectedInterface.type).label}
</Badge> </Badge>
</div> </div>
{selectedInterface.type === "bridge" && selectedInterface.bridge_physical_interface && (
<div className="col-span-2">
<div className="text-sm text-muted-foreground">Physical Interface</div>
<div className="font-medium text-blue-500 text-lg">
{selectedInterface.bridge_physical_interface}
</div>
</div>
)}
{selectedInterface.type === "vm_lxc" && selectedInterface.vm_name && (
<div className="col-span-2">
<div className="text-sm text-muted-foreground">VM/LXC Name</div>
<div className="font-medium text-orange-500 text-lg flex items-center gap-2">
{selectedInterface.vm_name}
{selectedInterface.vm_type && (
<Badge variant="outline" className={getVMTypeBadge(selectedInterface.vm_type).color}>
{getVMTypeBadge(selectedInterface.vm_type).label}
</Badge>
)}
</div>
</div>
)}
<div> <div>
<div className="text-sm text-muted-foreground">Status</div> <div className="text-sm text-muted-foreground">Status</div>
<Badge <Badge
@@ -765,20 +710,22 @@ export function NetworkMetrics() {
<div> <div>
<h3 className="text-sm font-semibold text-muted-foreground mb-3">Bridge Configuration</h3> <h3 className="text-sm font-semibold text-muted-foreground mb-3">Bridge Configuration</h3>
<div> <div>
<div className="text-sm text-muted-foreground mb-2">Member Interfaces</div> <div className="text-sm text-muted-foreground mb-2">Virtual Member Interfaces</div>
<div className="flex flex-wrap gap-2"> <div className="flex flex-wrap gap-2">
{selectedInterface.bridge_members.length > 0 ? ( {selectedInterface.bridge_members.length > 0 ? (
selectedInterface.bridge_members.map((member, idx) => ( selectedInterface.bridge_members
<Badge .filter((member) => !member.startsWith(("enp", "eth", "eno", "ens", "wlan", "wlp")))
key={idx} .map((member, idx) => (
variant="outline" <Badge
className="bg-green-500/10 text-green-500 border-green-500/20" key={idx}
> variant="outline"
{member} className="bg-green-500/10 text-green-500 border-green-500/20"
</Badge> >
)) {member}
</Badge>
))
) : ( ) : (
<div className="text-sm text-muted-foreground">No members</div> <div className="text-sm text-muted-foreground">No virtual members</div>
)} )}
</div> </div>
</div> </div>

11
AppImage/scripts/flask_server.py
View File

@@ -985,7 +985,8 @@ def get_bond_info(bond_name):
def get_bridge_info(bridge_name): def get_bridge_info(bridge_name):
"""Get detailed information about a bridge interface""" """Get detailed information about a bridge interface"""
bridge_info = { bridge_info = {
'members': [] 'members': [],
'physical_interface': None
} }
try: try:
@@ -994,6 +995,13 @@ def get_bridge_info(bridge_name):
if os.path.exists(brif_path): if os.path.exists(brif_path):
members = os.listdir(brif_path) members = os.listdir(brif_path)
bridge_info['members'] = members bridge_info['members'] = members
for member in members:
if member.startswith(('enp', 'eth', 'eno', 'ens', 'wlan', 'wlp')):
bridge_info['physical_interface'] = member
print(f"[v0] Bridge {bridge_name} physical interface: {member}")
break
print(f"[v0] Bridge {bridge_name} members: {members}") print(f"[v0] Bridge {bridge_name} members: {members}")
except Exception as e: except Exception as e:
print(f"[v0] Error reading bridge info for {bridge_name}: {e}") print(f"[v0] Error reading bridge info for {bridge_name}: {e}")
@@ -1120,6 +1128,7 @@ def get_network_info():
if interface_type == 'bridge': if interface_type == 'bridge':
bridge_info = get_bridge_info(interface_name) bridge_info = get_bridge_info(interface_name)
interface_info['bridge_members'] = bridge_info['members'] interface_info['bridge_members'] = bridge_info['members']
interface_info['bridge_physical_interface'] = bridge_info['physical_interface']
if interface_type == 'vm_lxc': if interface_type == 'vm_lxc':
network_data['vm_lxc_interfaces'].append(interface_info) network_data['vm_lxc_interfaces'].append(interface_info)