'use client'

import { TestResultCard } from './TestResultCard'
import type { TestCategoryResult } from './types'

interface TestRunnerProps {
  category: string
  categoryResult?: TestCategoryResult
  isLoading: boolean
  onRunTests: () => void
  runButtonLabel?: string
  rerunButtonLabel?: string
}

export function TestRunner({
  categoryResult,
  isLoading,
  onRunTests,
  runButtonLabel = '▶️ Tests ausfuehren',
  rerunButtonLabel = '🔄 Erneut ausfuehren',
}: TestRunnerProps) {
  if (!categoryResult) {
    return (
      <div className="text-center py-6">
        <button
          onClick={onRunTests}
          disabled={isLoading}
          className={`px-6 py-3 rounded-lg font-medium transition-colors ${
            isLoading
              ? 'bg-gray-400 cursor-not-allowed'
              : 'bg-green-600 text-white hover:bg-green-700'
          }`}
        >
          {isLoading ? '⏳ Tests laufen...' : runButtonLabel}
        </button>
      </div>
    )
  }

  return (
    <div>
      <div className="flex items-center justify-between mb-4">
        <h3 className="font-semibold text-gray-700">Testergebnisse</h3>
        <button
          onClick={onRunTests}
          disabled={isLoading}
          className="text-sm text-blue-600 hover:text-blue-800"
        >
          {rerunButtonLabel}
        </button>
      </div>
      {categoryResult.tests.map((test, index) => (
        <TestResultCard key={index} result={test} />
      ))}
    </div>
  )
}