52 lines
1.8 KiB
TypeScript
52 lines
1.8 KiB
TypeScript
import { useState, useEffect } from 'react'
|
|
import type { NextPage } from 'next'
|
|
import Head from 'next/head'
|
|
import Link from 'next/link'
|
|
|
|
interface Stats {
|
|
total_sources: number
|
|
high_risk_sources: number
|
|
categories_breakdown: { [key: string]: number }
|
|
top_domains: { domain: string; count: number; risk_level: number }[]
|
|
}
|
|
|
|
const Dashboard: NextPage = () => {
|
|
const [stats, setStats] = useState<Stats | null>(null)
|
|
|
|
useEffect(() => {
|
|
fetch('/api/stats')
|
|
.then(res => res.json())
|
|
.then(setStats)
|
|
}, [])
|
|
|
|
return (
|
|
<div>
|
|
<Head><title>Verejný dashboard - Infohliadka</title></Head>
|
|
<div style={{ padding: '40px 20px', maxWidth: '1200px', margin: '0 auto' }}>
|
|
<h1>Verejný dashboard</h1>
|
|
{stats && (
|
|
<div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(300px, 1fr))', gap: '20px', marginTop: '30px' }}>
|
|
<div style={{ padding: '20px', border: '1px solid #e5e7eb', borderRadius: '8px' }}>
|
|
<h3>Celkové štatistiky</h3>
|
|
<p>Problematické zdroje: <strong>{stats.total_sources}</strong></p>
|
|
<p>Vysoké riziko: <strong>{stats.high_risk_sources}</strong></p>
|
|
</div>
|
|
<div style={{ padding: '20px', border: '1px solid #e5e7eb', borderRadius: '8px' }}>
|
|
<h3>Top rizikoové domény</h3>
|
|
{stats.top_domains.slice(0, 5).map((domain, i) => (
|
|
<div key={i}>
|
|
<strong>{domain.domain}</strong> (riziko: {domain.risk_level})
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
)}
|
|
<div style={{ marginTop: '40px' }}>
|
|
<Link href="/">← Späť na hlavnú stránku</Link>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default Dashboard |