Cybersecurity-Projects/PROJECTS/advanced/honeypot-network/frontend/src/components/event-feed.tsx

33 lines
914 B
TypeScript

// ©AngelaMos | 2026
// event-feed.tsx
import { useWebSocketStore } from '@/core/lib/websocket.store'
import styles from './event-feed.module.scss'
import { ServiceBadge } from './service-badge'
const MAX_VISIBLE = 15
export function EventFeed() {
const events = useWebSocketStore((s) => s.events)
const visible = events.slice(0, MAX_VISIBLE)
if (visible.length === 0) {
return <div className={styles.empty}>AWAITING SIGNAL ...</div>
}
return (
<div className={styles.feed}>
{visible.map((ev) => (
<div key={ev.id} className={styles.entry}>
<span className={styles.time}>
{new Date(ev.timestamp).toLocaleTimeString()}
</span>
<ServiceBadge service={ev.service_type} />
<span className={styles.type}>{ev.event_type}</span>
<span className={styles.ip}>{ev.source_ip}</span>
</div>
))}
</div>
)
}