import { fireEvent, render, screen } from '@testing-library/react'
import { describe, expect, it } from 'vitest'
import { REMOTE_JOBS_FIXTURE } from './fixtures/offload'
import { RemoteJobsTable } from './RemoteJobsTable'

describe('RemoteJobsTable', () => {
  it('renders job rows with stage and rc', () => {
    render(<RemoteJobsTable jobs={REMOTE_JOBS_FIXTURE} hostLabel="debian1" />)
    expect(screen.getByTestId('remote-jobs-table')).toBeInTheDocument()
    expect(screen.getByText('rb-8f2a1c')).toBeInTheDocument()
    expect(screen.getByText('building')).toBeInTheDocument()
    expect(screen.getByText('127')).toBeInTheDocument()
  })

  it('reorders rows when a sortable header is clicked', () => {
    render(<RemoteJobsTable jobs={REMOTE_JOBS_FIXTURE} />)

    fireEvent.click(screen.getByRole('button', { name: /^Job/ }))
    const rows = screen.getAllByRole('row').slice(1)
    expect(rows[0]).toHaveTextContent('rb-4e77b0')
    expect(rows[1]).toHaveTextContent('rb-8f2a1c')
  })
})