'use client'

import React from 'react'
import Link from 'next/link'

export default function AgentStatisticsPage() {
  return (
    <div className="p-8 max-w-5xl">
      <div className="flex items-center gap-4 mb-8">
        <Link href="/sdk/agents" className="text-gray-400 hover:text-gray-600 transition-colors">
          <svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M15 19l-7-7 7-7" />
          </svg>
        </Link>
        <div>
          <h1 className="text-2xl font-bold text-gray-900">Agent-Statistiken</h1>
          <p className="text-gray-500 mt-1">Performance-Metriken und Nutzungsanalysen</p>
        </div>
      </div>

      <div className="bg-white border border-gray-200 rounded-xl p-12 text-center">
        <svg className="w-20 h-20 text-gray-300 mx-auto mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
          <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1.5}
            d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z" />
        </svg>
        <h2 className="text-xl font-medium text-gray-900 mb-2">Agent-Statistiken</h2>
        <p className="text-gray-500 max-w-md mx-auto">
          Detaillierte Statistiken wie Antwortzeiten, Erfolgsraten, haeufigste Themen und
          RAG-Trefferquoten werden in einer zukuenftigen Version implementiert.
        </p>
      </div>
    </div>
  )
}