From 57badfe3479988202b7659c7a65485617c2d50e4 Mon Sep 17 00:00:00 2001 From: sepehr Date: Sun, 29 Mar 2026 18:40:03 +0300 Subject: [PATCH] addd installation masage for WireGuard server --- src/app/providers/mikrowizard/vpn.service.ts | 3 +- src/app/views/vpn/vpn.component.html | 69 +++++++++++++++----- src/app/views/vpn/vpn.component.ts | 36 ++++++---- 3 files changed, 78 insertions(+), 30 deletions(-) diff --git a/src/app/providers/mikrowizard/vpn.service.ts b/src/app/providers/mikrowizard/vpn.service.ts index 8a2040b..b999430 100644 --- a/src/app/providers/mikrowizard/vpn.service.ts +++ b/src/app/providers/mikrowizard/vpn.service.ts @@ -45,10 +45,11 @@ export interface VpnServerConfig { } export interface VpnStatusResponse { - status: 'running' | 'setup_required' | 'error'; + status: 'running' | 'setup_required' | 'error' | 'failed'; peers?: VpnPeer[]; server_config?: VpnServerConfig; message?: string; + error?: string; } export interface VpnLiveStatusResponse { diff --git a/src/app/views/vpn/vpn.component.html b/src/app/views/vpn/vpn.component.html index 4c10288..01b9a93 100644 --- a/src/app/views/vpn/vpn.component.html +++ b/src/app/views/vpn/vpn.component.html @@ -1,10 +1,33 @@
+ + + +
+
+ +
+
+
Need to check docker container and wireguard server
+

For this feature, the MikroWizard WireGuard server must be installed. If already installed, + please verify that the Docker container is running and accessible.

+
+
+ Troubleshooting and installation Instruction: + + Install Mikrowizard wireguard docker server + +
+
+
+ + + [ngClass]="{'bg-success text-white': status?.status === 'running' && !isCommunicationError, 'bg-danger text-white': status?.status === 'error' || isCommunicationError || !status, 'bg-warning text-dark': status?.status === 'setup_required' && !isCommunicationError}">
@@ -13,8 +36,9 @@
Server Status
- {{status?.status === 'running' ? 'Running' : (status?.status === 'setup_required' ? 'Setup Required' : - 'Error/Offline')}} + {{isCommunicationError ? 'Communication Failed' : (status?.status === 'running' ? 'Running' : + (status?.status === 'setup_required' ? 'Setup Required' : + 'Error/Offline'))}}
@@ -119,17 +143,16 @@
- +
+ [globalFilterFields]="['name', 'assigned_ip', 'public_key', 'description']" [loading]="loading"> Status @@ -182,11 +205,14 @@ - - + + - + @@ -207,7 +233,8 @@
-
+
{{ item.description }}
@@ -238,14 +265,17 @@ View Device
- Not Linked -
+ Not Linked +
Scanning...
Success
-
+
Failed
@@ -264,7 +294,8 @@
-
+
{{ formatBytes(item.stats.rx_speed || 0) }}/s @@ -275,8 +306,10 @@
- {{(item.stats.rx_bytes / 1048576) | number:'1.2-2'}} MB - {{(item.stats.tx_bytes / 1048576) | number:'1.2-2'}} MB + {{(item.stats.rx_bytes / + 1048576) | number:'1.2-2'}} MB + {{(item.stats.tx_bytes / 1048576) + | number:'1.2-2'}} MB
diff --git a/src/app/views/vpn/vpn.component.ts b/src/app/views/vpn/vpn.component.ts index b099519..ab696b3 100644 --- a/src/app/views/vpn/vpn.component.ts +++ b/src/app/views/vpn/vpn.component.ts @@ -33,6 +33,7 @@ export class VpnComponent implements OnInit, OnDestroy { public totalTx: number = 0; public liveSpeedRx: number = 0; public liveSpeedTx: number = 0; + public isCommunicationError: boolean = false; formatBytes(bytes: number, decimals: number = 2): string { if (!+bytes) return '0 B'; @@ -187,12 +188,19 @@ export class VpnComponent implements OnInit, OnDestroy { next: (res) => { if (res) { this.status = res; - this.source = (res.peers || []).map(p => ({ - ...p, - _search_index: `${p.name || ''} ${p.assigned_ip || ''} ${p.public_key || ''} ${p.description || ''}` - })); - this.computeTotals(); - this.loading = false; + this.isCommunicationError = res.status === 'failed' && (res.error?.includes('Connection refused') || false); + + if (!this.isCommunicationError) { + this.source = (res.peers || []).map(p => ({ + ...p, + _search_index: `${p.name || ''} ${p.assigned_ip || ''} ${p.public_key || ''} ${p.description || ''}` + })); + this.computeTotals(); + this.loading = false; + } else { + this.loading = false; + this.source = []; + } } else { if (!this.status) { this.loading = true; // Show loading if we never got a successful status @@ -242,11 +250,17 @@ export class VpnComponent implements OnInit, OnDestroy { next: (res) => { if (res) { this.status = res; - this.source = (res.peers || []).map(p => ({ - ...p, - _search_index: `${p.name || ''} ${p.assigned_ip || ''} ${p.public_key || ''} ${p.description || ''}` - })); - this.computeTotals(); + this.isCommunicationError = res.status === 'failed' && (res.error?.includes('Connection refused') || false); + + if (!this.isCommunicationError) { + this.source = (res.peers || []).map(p => ({ + ...p, + _search_index: `${p.name || ''} ${p.assigned_ip || ''} ${p.public_key || ''} ${p.description || ''}` + })); + this.computeTotals(); + } else { + this.source = []; + } } }, error: (err) => console.error("Error refreshing data:", err)