import { describe, it, expect } from 'vitest'
import { mount } from '@vue/test-utils'
import AttendeeList from '../AttendeeList.vue'

describe('AttendeeList', () => {
  it('renders attendee names as list items', () => {
    const wrapper = mount(AttendeeList, {
      props: { attendees: ['Alice', 'Bob', 'Charlie'] },
    })

    const items = wrapper.findAll('.attendee-list__item')
    expect(items).toHaveLength(3)
    expect(items[0]!.text()).toBe('Alice')
    expect(items[1]!.text()).toBe('Bob')
    expect(items[2]!.text()).toBe('Charlie')
  })

  it('shows empty state message when no attendees', () => {
    const wrapper = mount(AttendeeList, {
      props: { attendees: [] },
    })

    expect(wrapper.find('.attendee-list__empty').text()).toBe('No attendees yet.')
    expect(wrapper.find('.attendee-list__items').exists()).toBe(false)
  })

  it('shows plural count heading for multiple attendees', () => {
    const wrapper = mount(AttendeeList, {
      props: { attendees: ['Alice', 'Bob', 'Charlie', 'Diana', 'Eve'] },
    })

    expect(wrapper.find('.attendee-list__heading').text()).toBe('5 Attendees')
  })

  it('shows singular count heading for one attendee', () => {
    const wrapper = mount(AttendeeList, {
      props: { attendees: ['Alice'] },
    })

    expect(wrapper.find('.attendee-list__heading').text()).toBe('1 Attendee')
  })

  it('shows zero count heading for no attendees', () => {
    const wrapper = mount(AttendeeList, {
      props: { attendees: [] },
    })

    expect(wrapper.find('.attendee-list__heading').text()).toBe('0 Attendees')
  })
})