'use client'

import Link from 'next/link'

interface OptimizerUpsellCardProps {
  feasibility: string
  assessmentId: string
  riskScore?: number
}

export function OptimizerUpsellCard({ feasibility, assessmentId, riskScore }: OptimizerUpsellCardProps) {
  const isRestricted = feasibility === 'CONDITIONAL' || feasibility === 'NO'

  if (isRestricted) {
    return (
      <div className="bg-amber-50 border-2 border-amber-300 rounded-xl p-5">
        <div className="flex items-start gap-3">
          <span className="text-2xl">📊</span>
          <div className="flex-1">
            <h3 className="text-base font-semibold text-amber-900">
              {feasibility === 'NO' ? 'Use Case aktuell nicht umsetzbar' : 'Use Case eingeschraenkt machbar'}
            </h3>
            <p className="text-sm text-amber-800 mt-1">
              Der <strong>Compliance Optimizer</strong> zeigt Ihnen die optimale Konfiguration,
              um den regulatorischen Spielraum maximal auszunutzen — ohne Grenzen zu ueberschreiten.
            </p>
            {riskScore != null && riskScore >= 50 && (
              <p className="text-xs text-amber-700 mt-1">
                Risiko-Score {riskScore}/100 — besonders hohes Optimierungspotenzial.
              </p>
            )}
            <Link
              href={`/sdk/compliance-optimizer/new?from_assessment=${assessmentId}`}
              className="inline-flex items-center gap-1 mt-3 px-4 py-2 bg-blue-600 text-white text-sm font-medium rounded-lg hover:bg-blue-700 transition-colors"
            >
              Jetzt optimieren →
            </Link>
          </div>
        </div>
      </div>
    )
  }

  return (
    <div className="bg-blue-50 border border-blue-200 rounded-xl p-4">
      <div className="flex items-center justify-between">
        <div>
          <h3 className="text-sm font-medium text-blue-900">Regulatorischen Spielraum pruefen</h3>
          <p className="text-xs text-blue-700 mt-0.5">
            Pruefen Sie ob Sie den regulatorischen Spielraum noch besser nutzen koennen.
          </p>
        </div>
        <Link
          href={`/sdk/compliance-optimizer/new?from_assessment=${assessmentId}`}
          className="text-sm text-blue-600 hover:underline whitespace-nowrap"
        >
          Optional optimieren →
        </Link>
      </div>
    </div>
  )
}