Scrum4Me/__tests__/components/solo/batch-enqueue-blocker-dialog.test.tsx

// @vitest-environment jsdom
import '@testing-library/jest-dom'
import { describe, it, expect, vi, beforeEach } from 'vitest'
import { render, screen, fireEvent } from '@testing-library/react'

vi.mock('@/components/ui/dialog', () => ({
  Dialog: ({ open, children }: { open: boolean; onOpenChange?: (v: boolean) => void; children: React.ReactNode }) =>
    open ? <div data-testid="dialog">{children}</div> : null,
  DialogContent: ({ children }: { children: React.ReactNode }) => <div>{children}</div>,
  DialogHeader: ({ children }: { children: React.ReactNode }) => <div>{children}</div>,
  DialogTitle: ({ children }: { children: React.ReactNode }) => <h2>{children}</h2>,
}))
vi.mock('@/components/ui/button', () => ({
  Button: ({
    children,
    onClick,
    disabled,
    variant,
  }: {
    children?: React.ReactNode
    onClick?: () => void
    disabled?: boolean
    variant?: string
  }) => (
    <button onClick={onClick} disabled={disabled} data-variant={variant}>
      {children}
    </button>
  ),
}))
vi.mock('@/components/ui/tooltip', () => ({
  TooltipProvider: ({ children }: { children: React.ReactNode }) => <>{children}</>,
  Tooltip: ({ children }: { children: React.ReactNode }) => <>{children}</>,
  TooltipTrigger: ({ render: r, children }: { render?: React.ReactElement; children?: React.ReactNode }) =>
    r ? <>{r}</> : <>{children}</>,
  TooltipContent: ({ children }: { children: React.ReactNode }) => (
    <span data-testid="tooltip-content">{children}</span>
  ),
}))

import { BatchEnqueueBlockerDialog } from '@/components/solo/batch-enqueue-blocker-dialog'

const DEFAULT_PROPS = {
  open: true,
  onOpenChange: vi.fn(),
  prefixCount: 3,
  blockerReason: 'task-review' as const,
  blockerLabel: 'Story X — Task Y (in review)',
  onConfirm: vi.fn(),
  onCancel: vi.fn(),
}

beforeEach(() => {
  vi.clearAllMocks()
})

describe('BatchEnqueueBlockerDialog', () => {
  it('renders title and blocker info for task-review', () => {
    render(<BatchEnqueueBlockerDialog {...DEFAULT_PROPS} />)

    expect(screen.getByRole('heading')).toHaveTextContent('Blokkade gedetecteerd')
    expect(screen.getByText(/Een taak staat op 'review'/)).toBeInTheDocument()
    expect(screen.getByText(/Story X — Task Y/)).toBeInTheDocument()
  })

  it('renders correct blocker label for pbi-blocked', () => {
    render(
      <BatchEnqueueBlockerDialog
        {...DEFAULT_PROPS}
        blockerReason="pbi-blocked"
        blockerLabel="PBI Z — geblokkeerd"
      />
    )

    expect(screen.getByText(/De PBI is geblokkeerd/)).toBeInTheDocument()
    expect(screen.getByText(/PBI Z/)).toBeInTheDocument()
  })

  it('calls onConfirm when primary button is clicked', () => {
    render(<BatchEnqueueBlockerDialog {...DEFAULT_PROPS} />)

    fireEvent.click(screen.getByText(/Stuur 3 taken tot aan blokkade/))

    expect(DEFAULT_PROPS.onConfirm).toHaveBeenCalledTimes(1)
  })

  it('calls onCancel when cancel button is clicked', () => {
    render(<BatchEnqueueBlockerDialog {...DEFAULT_PROPS} />)

    fireEvent.click(screen.getByText('Annuleer'))

    expect(DEFAULT_PROPS.onCancel).toHaveBeenCalledTimes(1)
  })

  it('disables confirm button and shows tooltip when prefixCount is 0', () => {
    render(<BatchEnqueueBlockerDialog {...DEFAULT_PROPS} prefixCount={0} />)

    const confirmBtn = screen.getByText(/Stuur 0/).closest('button')
    expect(confirmBtn).toBeDisabled()
    expect(screen.getByTestId('tooltip-content')).toHaveTextContent('Geen taken vóór blokkade')
  })

  it('does not render when open is false', () => {
    render(<BatchEnqueueBlockerDialog {...DEFAULT_PROPS} open={false} />)

    expect(screen.queryByTestId('dialog')).not.toBeInTheDocument()
  })

  it('uses singular taak when prefixCount is 1', () => {
    render(<BatchEnqueueBlockerDialog {...DEFAULT_PROPS} prefixCount={1} />)

    expect(screen.getByText(/Stuur 1 taak tot aan blokkade/)).toBeInTheDocument()
    expect(screen.getByText(/1 taak vóór de blokkade/)).toBeInTheDocument()
  })
})