'use client'

import React from 'react'
import { AssessmentResultCard } from '@/components/sdk/use-case-assessment/AssessmentResultCard'

interface Props {
  result: unknown
  onGoToAssessment: (id: string) => void
  onGoToOverview: () => void
}

export function ResultView({ result, onGoToAssessment, onGoToOverview }: Props) {
  const r = result as { assessment?: { id: string }; result?: Record<string, unknown> }
  return (
    <div className="max-w-4xl mx-auto space-y-6">
      <div className="flex items-center justify-between">
        <h1 className="text-2xl font-bold text-gray-900">Assessment Ergebnis</h1>
        <div className="flex gap-2">
          {r.assessment?.id && (
            <button
              onClick={() => onGoToAssessment(r.assessment!.id)}
              className="px-4 py-2 bg-purple-600 text-white rounded-lg hover:bg-purple-700"
            >
              Zum Assessment
            </button>
          )}
          <button
            onClick={onGoToOverview}
            className="px-4 py-2 bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200"
          >
            Zur Uebersicht
          </button>
        </div>
      </div>
      {r.result && (
        <AssessmentResultCard result={r.result as unknown as Parameters<typeof AssessmentResultCard>[0]['result']} />
      )}
    </div>
  )
}