'use client'

import { useState } from 'react'
import { EvaluationForm } from './evaluation-form'
import { COIDeclarationDialog } from './coi-declaration-dialog'
import { Card, CardContent } from '@/components/ui/card'
import { ShieldAlert } from 'lucide-react'

interface Criterion {
  id: string
  label: string
  description?: string
  type?: 'numeric' | 'text' | 'boolean' | 'section_header'
  scale?: number
  weight?: number
  required?: boolean
  maxLength?: number
  placeholder?: string
  trueLabel?: string
  falseLabel?: string
  condition?: {
    criterionId: string
    operator: 'equals' | 'greaterThan' | 'lessThan'
    value: number | string | boolean
  }
  sectionId?: string
}

interface EvaluationFormWithCOIProps {
  assignmentId: string
  evaluationId: string | null
  projectTitle: string
  criteria: Criterion[]
  initialData?: {
    criterionScoresJson: Record<string, number | string | boolean> | null
    globalScore: number | null
    binaryDecision: boolean | null
    feedbackText: string | null
    status: string
  }
  isVotingOpen: boolean
  deadline?: Date | null
  coiStatus: {
    hasConflict: boolean
    declared: boolean
  }
}

export function EvaluationFormWithCOI({
  assignmentId,
  evaluationId,
  projectTitle,
  criteria,
  initialData,
  isVotingOpen,
  deadline,
  coiStatus,
}: EvaluationFormWithCOIProps) {
  const [coiDeclared, setCOIDeclared] = useState(coiStatus.declared)
  const [hasConflict, setHasConflict] = useState(coiStatus.hasConflict)

  const handleCOIComplete = (conflictDeclared: boolean) => {
    setCOIDeclared(true)
    setHasConflict(conflictDeclared)
  }

  // Show COI dialog if not yet declared
  if (!coiDeclared) {
    return (
      <COIDeclarationDialog
        open={true}
        assignmentId={assignmentId}
        projectTitle={projectTitle}
        onComplete={handleCOIComplete}
      />
    )
  }

  // Show warning banner if conflict was declared
  if (hasConflict) {
    return (
      <Card className="border-amber-500 bg-amber-500/5">
        <CardContent className="flex items-center gap-3 py-6">
          <ShieldAlert className="h-6 w-6 text-amber-600 shrink-0" />
          <div>
            <p className="font-medium text-amber-800">
              Conflict of Interest Declared
            </p>
            <p className="text-sm text-amber-700 mt-1">
              You declared a conflict of interest for this project. An admin will
              review your declaration. You cannot evaluate this project while the
              conflict is under review.
            </p>
          </div>
        </CardContent>
      </Card>
    )
  }

  // No conflict - show the evaluation form
  return (
    <EvaluationForm
      assignmentId={assignmentId}
      evaluationId={evaluationId}
      projectTitle={projectTitle}
      criteria={criteria}
      initialData={initialData}
      isVotingOpen={isVotingOpen}
      deadline={deadline}
    />
  )
}
