feat(web-ui): reorganize network and security views into tabbed subviews with route-aware navigation

ts_web/elements/ops-dashboard.ts

@@ -14,19 +14,15 @@ import {
 
 // Import view components
 import { OpsViewOverview } from './ops-view-overview.js';
-import { OpsViewNetwork } from './ops-view-network.js';
+import { OpsViewNetwork } from './network/ops-view-network.js';
 import { OpsViewEmails } from './ops-view-emails.js';
 import { OpsViewLogs } from './ops-view-logs.js';
 import { OpsViewConfig } from './ops-view-config.js';
-import { OpsViewRoutes } from './ops-view-routes.js';
 import { OpsViewApiTokens } from './ops-view-apitokens.js';
-import { OpsViewSecurity } from './ops-view-security.js';
+import { OpsViewSecurity } from './security/ops-view-security.js';
 import { OpsViewCertificates } from './ops-view-certificates.js';
 import { OpsViewRemoteIngress } from './ops-view-remoteingress.js';
 import { OpsViewVpn } from './ops-view-vpn.js';
-import { OpsViewSourceProfiles } from './ops-view-sourceprofiles.js';
-import { OpsViewNetworkTargets } from './ops-view-networktargets.js';
-import { OpsViewTargetProfiles } from './ops-view-targetprofiles.js';
 
 @customElement('ops-dashboard')
 export class OpsDashboard extends DeesElement {
@@ -37,6 +33,7 @@ export class OpsDashboard extends DeesElement {
 
   @state() accessor uiState: appstate.IUiState = {
     activeView: 'overview',
+    activeSubview: null,
     sidebarCollapsed: false,
     autoRefresh: true,
     refreshInterval: 1000,
@@ -76,26 +73,6 @@ export class OpsDashboard extends DeesElement {
       iconName: 'lucide:scrollText',
       element: OpsViewLogs,
     },
-    {
-      name: 'Routes',
-      iconName: 'lucide:route',
-      element: OpsViewRoutes,
-    },
-    {
-      name: 'SourceProfiles',
-      iconName: 'lucide:shieldCheck',
-      element: OpsViewSourceProfiles,
-    },
-    {
-      name: 'NetworkTargets',
-      iconName: 'lucide:server',
-      element: OpsViewNetworkTargets,
-    },
-    {
-      name: 'TargetProfiles',
-      iconName: 'lucide:target',
-      element: OpsViewTargetProfiles,
-    },
     {
       name: 'ApiTokens',
       iconName: 'lucide:key',