feat(ui): Sync UI tab state with URL and update routes/links

ui/src/app/features/network/network.component.ts

@@ -1,4 +1,6 @@
 import { Component, inject, signal, OnInit, OnDestroy, ViewChild, ElementRef, effect } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
+import { Subscription } from 'rxjs';
 import { ApiService } from '../../core/services/api.service';
 import { ToastService } from '../../core/services/toast.service';
 import { NetworkLogStreamService } from '../../core/services/network-log-stream.service';
@@ -294,6 +296,9 @@ type TNetworkTab = 'proxy' | 'dns' | 'domains';
 export class NetworkComponent implements OnInit, OnDestroy {
   private api = inject(ApiService);
   private toast = inject(ToastService);
+  private route = inject(ActivatedRoute);
+  private router = inject(Router);
+  private routeSub?: Subscription;
   networkLogStream = inject(NetworkLogStreamService);
 
   @ViewChild('logContainer') logContainer!: ElementRef<HTMLDivElement>;
@@ -321,15 +326,24 @@ export class NetworkComponent implements OnInit, OnDestroy {
   }
 
   ngOnInit(): void {
+    // Subscribe to route params to sync tab state with URL
+    this.routeSub = this.route.paramMap.subscribe((params) => {
+      const tab = params.get('tab') as TNetworkTab;
+      if (tab && ['proxy', 'dns', 'domains'].includes(tab)) {
+        this.activeTab.set(tab);
+      }
+    });
+
     this.loadData();
   }
 
   ngOnDestroy(): void {
+    this.routeSub?.unsubscribe();
     this.networkLogStream.disconnect();
   }
 
   setTab(tab: TNetworkTab): void {
-    this.activeTab.set(tab);
+    this.router.navigate(['/network', tab]);
   }
 
   async loadData(): Promise<void> {