"use client"

import Link from "next/link"
import { Loader2 } from "lucide-react"

import { Button } from "@/components/ui/button"
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"

export function DeepdexUploadQueueReviewBulkActions({
  isSubmitting,
  queueHasUnmapped,
  selectedCount,
  selectedHasUnmapped,
  onCreateAll,
  onCreateSelected,
}: {
  isSubmitting: boolean
  queueHasUnmapped: boolean
  selectedCount: number
  selectedHasUnmapped: boolean
  onCreateAll: () => void
  onCreateSelected: () => void
}) {
  return (
    <Card>
      <CardHeader>
        <CardTitle className="text-base">Actions</CardTitle>
      </CardHeader>
      <CardContent className="flex flex-wrap gap-2">
        <Button variant="outline" asChild>
          <Link href="/dashboard/deepdex/upload-queue">Back to upload</Link>
        </Button>
        <Button
          onClick={onCreateAll}
          disabled={isSubmitting || queueHasUnmapped}
          title={queueHasUnmapped ? "Map all OCR underlyings to real ISINs before creating" : undefined}
        >
          {isSubmitting ? <Loader2 className="size-4 animate-spin" /> : null}
          Create all
        </Button>
        <Button
          variant="outline"
          onClick={onCreateSelected}
          disabled={isSubmitting || selectedCount === 0 || selectedHasUnmapped}
          title={selectedHasUnmapped ? "Map all OCR underlyings to real ISINs before creating" : undefined}
        >
          Create selected ({selectedCount})
        </Button>
        <Button variant="outline" asChild>
          <Link href="/dashboard/deepdex/upload-queue">Cancel</Link>
        </Button>
      </CardContent>
    </Card>
  )
}