fix: add go.sum and fixes

2026-02-06 14:26:15 -03:00
parent cf2b4f7b91
commit d6b08cb586
36 changed files with 3613 additions and 423 deletions
--- a/dashboard/src/app/metrics/page.tsx
+++ b/dashboard/src/app/metrics/page.tsx
@@ -0,0 +1,108 @@
+'use client';
+
+import { useState } from 'react';
+import { useQuery } from '@tanstack/react-query';
+import { RefreshCw, TrendingUp, Cpu, HardDrive, Activity } from 'lucide-react';
+import { api } from '@/lib/api';
+import { MetricsChart } from '@/components/metrics/MetricsChart';
+
+const METRIC_PRESETS = [
+  { name: 'CPU Usage', metric: 'cpu.usage_percent', service: 'system', icon: Cpu },
+  { name: 'Memory Usage', metric: 'memory.used_percent', service: 'system', icon: Activity },
+  { name: 'Load Average', metric: 'cpu.load_avg_1', service: 'system', icon: TrendingUp },
+  { name: 'Disk Usage', metric: 'disk.used_percent', service: 'system', icon: HardDrive },
+  { name: 'Network Sent', metric: 'network.bytes_sent', service: 'system', icon: TrendingUp },
+  { name: 'Network Recv', metric: 'network.bytes_recv', service: 'system', icon: TrendingUp },
+  { name: 'Containers Running', metric: 'containers.running', service: 'docker', icon: Activity },
+  { name: 'Container CPU', metric: 'container.cpu_percent', service: 'docker', icon: Cpu },
+];
+
+export default function MetricsPage() {
+  const [timeRange, setTimeRange] = useState('1h');
+  const [selectedMetrics, setSelectedMetrics] = useState<string[]>([
+    'cpu.usage_percent',
+    'memory.used_percent',
+  ]);
+
+  const getTimeFrom = () => {
+    const ranges: Record<string, number> = {
+      '15m': 15 * 60 * 1000,
+      '1h': 60 * 60 * 1000,
+      '6h': 6 * 60 * 60 * 1000,
+      '24h': 24 * 60 * 60 * 1000,
+    };
+    return new Date(Date.now() - (ranges[timeRange] || ranges['1h'])).toISOString();
+  };
+
+  const toggleMetric = (metric: string) => {
+    setSelectedMetrics((prev) =>
+      prev.includes(metric)
+        ? prev.filter((m) => m !== metric)
+        : [...prev, metric]
+    );
+  };
+
+  return (
+    <div className="p-6 space-y-6">
+      <div className="flex items-center justify-between">
+        <h1 className="text-2xl font-bold text-white">Metrics</h1>
+        <div className="flex items-center gap-4">
+          <select
+            value={timeRange}
+            onChange={(e) => setTimeRange(e.target.value)}
+            className="px-3 py-2 bg-gray-800 border border-gray-700 rounded-lg text-white focus:outline-none focus:border-indigo-500"
+          >
+            <option value="15m">Last 15 minutes</option>
+            <option value="1h">Last hour</option>
+            <option value="6h">Last 6 hours</option>
+            <option value="24h">Last 24 hours</option>
+          </select>
+        </div>
+      </div>
+
+      {/* Metric Selector */}
+      <div className="flex flex-wrap gap-2">
+        {METRIC_PRESETS.map((preset) => {
+          const Icon = preset.icon;
+          const isSelected = selectedMetrics.includes(preset.metric);
+          return (
+            <button
+              key={preset.metric}
+              onClick={() => toggleMetric(preset.metric)}
+              className={`flex items-center gap-2 px-3 py-2 rounded-lg border transition-colors ${
+                isSelected
+                  ? 'bg-indigo-600 border-indigo-500 text-white'
+                  : 'bg-gray-800 border-gray-700 text-gray-300 hover:border-gray-600'
+              }`}
+            >
+              <Icon className="h-4 w-4" />
+              {preset.name}
+            </button>
+          );
+        })}
+      </div>
+
+      {/* Charts Grid */}
+      <div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
+        {selectedMetrics.map((metric) => {
+          const preset = METRIC_PRESETS.find((p) => p.metric === metric);
+          return (
+            <MetricsChart
+              key={metric}
+              title={preset?.name || metric}
+              service={preset?.service || 'system'}
+              metric={metric}
+              from={getTimeFrom()}
+            />
+          );
+        })}
+      </div>
+
+      {selectedMetrics.length === 0 && (
+        <div className="flex items-center justify-center h-64 bg-gray-900/50 rounded-lg border border-gray-800 text-gray-500">
+          Select metrics to display
+        </div>
+      )}
+    </div>
+  );
+}