import { describe, it, expect } from 'vitest'
import { mount } from '@vue/test-utils'
import TaskConfirmDialog from '../TaskConfirmDialog.vue'
import type { Task } from '@/common/models'

const ModalDialogStub = {
  template: '<div><slot /></div>',
  props: ['title', 'subtitle', 'imageUrl'],
}

describe('TaskConfirmDialog', () => {
  it('renders "Confirm Task" title for chores', () => {
    const task: Task = {
      id: 'task-1',
      name: 'Clean Room',
      type: 'chore',
      points: 5,
      image_id: '',
    }
    const wrapper = mount(TaskConfirmDialog, {
      props: { task, childName: 'Test Child' },
      global: { stubs: { ModalDialog: ModalDialogStub } },
    })

    expect(wrapper.findComponent(ModalDialogStub).props('title')).toBe('Confirm Task')
  })

  it('renders "Confirm Act" title for kindness acts', () => {
    const task: Task = {
      id: 'task-2',
      name: 'Share Toys',
      type: 'kindness',
      points: 3,
      image_id: '',
    }
    const wrapper = mount(TaskConfirmDialog, {
      props: { task, childName: 'Test Child' },
      global: { stubs: { ModalDialog: ModalDialogStub } },
    })

    expect(wrapper.findComponent(ModalDialogStub).props('title')).toBe('Confirm Act')
  })

  it('renders "Confirm Penalty" title for penalties', () => {
    const task: Task = {
      id: 'task-3',
      name: 'No Screen Time',
      type: 'penalty',
      points: 5,
      image_id: '',
    }
    const wrapper = mount(TaskConfirmDialog, {
      props: { task, childName: 'Test Child' },
      global: { stubs: { ModalDialog: ModalDialogStub } },
    })

    expect(wrapper.findComponent(ModalDialogStub).props('title')).toBe('Confirm Penalty')
  })
})