add app monitoring charts and runtime metrics

src/App.tsx

@@ -47,6 +47,7 @@ import {
   InfrastructureStoragePage,
   InfrastructureWorkloadsPage
 } from './pages/infrastructure/InfrastructurePages';
+import { MonitoringPage } from './pages/system/MonitoringPage';
 import { LoadingModal, useMinimumLoading } from './pages/operations/operation-utils';
 import {
   AgentCommandsPage as AgentCommandsRestoredPage,
@@ -92,6 +93,7 @@ type ViewKey =
   | 'infraWorkloads'
   | 'infraNetwork'
   | 'infraStorage'
+  | 'monitoring'
   | 'agentRegistration'
   | 'agentInstallStatus'
   | 'agentSshKeys'
@@ -129,6 +131,7 @@ const viewByLabel: Record<string, ViewKey> = {
   워크로드: 'infraWorkloads',
   네트워크: 'infraNetwork',
   스토리지: 'infraStorage',
+  모니터링: 'monitoring',
   '장비 등록': 'agentRegistration',
   '설치 상태': 'agentInstallStatus',
   'SSH 키 배포': 'agentSshKeys',
@@ -172,6 +175,7 @@ const pathByView: Record<ViewKey, string> = {
   infraWorkloads: '/infrastructure/workloads',
   infraNetwork: '/infrastructure/network',
   infraStorage: '/infrastructure/storage',
+  monitoring: '/system/monitoring',
   agentRegistration: '/agents/registration',
   agentInstallStatus: '/agents/install-status',
   agentSshKeys: '/agents/ssh-keys',
@@ -1766,6 +1770,8 @@ function App() {
         return <InfrastructureNetworkPage />;
       case 'infraStorage':
         return <InfrastructureStoragePage />;
+      case 'monitoring':
+        return <MonitoringPage />;
       case 'agentRegistration':
         return <AgentRegistrationRestoredPage />;
       case 'agentInstallStatus':