1import { useEffect, useState } from 'react';
2import { Card } from '@/components/ui/card';
3import { Metric } from '@/types/metrics';
4import { fetchMetrics } from '@/lib/api';
5
6export default function Dashboard() {
7 const [metrics, setMetrics] = useState<Metric[]>([]);
8 const [loading, setLoading] = useState(true);
9
10 useEffect(() => {
11 loadMetrics();
12 }, []);
13
14 async function loadMetrics() {
15 try {
16 setLoading(true);
17 const data = await fetchMetrics();
18 setMetrics(data);
19 } catch (error) {
20 console.error('Failed to load metrics:', error);
21 } finally {
22 setLoading(false);
23 }
24 }
25
26 return (
27 <div className="space-y-6">
28
29