dttmr-fe/src/components/__tests__/InvitesPanel.spec.ts

import { describe, it, expect, beforeEach, vi } from 'vitest'
import { mount } from '@vue/test-utils'
import InvitesPanel from '../InvitesPanel.vue'
import * as invitesApi from '@/api/invites'
import type { Invite } from '@/types/invite'

describe('InvitesPanel', () => {
  beforeEach(() => {
    vi.restoreAllMocks()
    Object.defineProperty(navigator, 'onLine', { value: true, configurable: true })
    Object.defineProperty(navigator, 'clipboard', {
      value: { writeText: vi.fn<(text: string) => Promise<void>>().mockResolvedValue(undefined) },
      configurable: true,
    })
    // jsdom has no Web Share API; tests that want it define it explicitly.
    Reflect.deleteProperty(navigator, 'share')
  })

  it('renders collapsed by default without loading invites', () => {
    const getSpy = vi.spyOn(invitesApi, 'getInvitesApi')

    const wrapper = mount(InvitesPanel)

    expect(wrapper.text()).toContain('Invites')
    expect(wrapper.find('#invites-panel').exists()).toBe(false)
    expect(getSpy).not.toHaveBeenCalled()
  })

  it('loads and displays invites on expand', async () => {
    const mockInvites: Invite[] = [
      { id: 'invite-1', code: 'ABC123', expires_at: '2099-01-01T00:00:00.000Z' },
      {
        id: 'invite-2',
        code: 'USEDCODE',
        expires_at: '2099-01-01T00:00:00.000Z',
        consumed_at: '2026-01-01T00:00:00.000Z',
      },
    ]
    vi.spyOn(invitesApi, 'getInvitesApi').mockResolvedValueOnce(mockInvites)

    const wrapper = mount(InvitesPanel)
    await wrapper.find('.invites-toggle').trigger('click')
    await flushPromises()

    expect(wrapper.text()).toContain('ABC123')
    expect(wrapper.text()).toContain('USEDCODE')
    expect(wrapper.text()).toContain('Active')
    expect(wrapper.text()).toContain('Used')
  })

  it('shows an offline message instead of fetching when expanded offline', async () => {
    Object.defineProperty(navigator, 'onLine', { value: false, configurable: true })
    const getSpy = vi.spyOn(invitesApi, 'getInvitesApi')

    const wrapper = mount(InvitesPanel)
    await wrapper.find('.invites-toggle').trigger('click')

    expect(getSpy).not.toHaveBeenCalled()
    expect(wrapper.find('.banner-error').text()).toContain('must be online')
  })

  it('shows empty state when there are no invites', async () => {
    vi.spyOn(invitesApi, 'getInvitesApi').mockResolvedValueOnce([])

    const wrapper = mount(InvitesPanel)
    await wrapper.find('.invites-toggle').trigger('click')
    await flushPromises()

    expect(wrapper.text()).toContain('No invites yet')
  })

  it('generates a new invite and prepends it to the list', async () => {
    vi.spyOn(invitesApi, 'getInvitesApi').mockResolvedValueOnce([])
    const newInvite: Invite = { id: 'invite-new', code: 'NEWCODE1' }
    vi.spyOn(invitesApi, 'createInviteApi').mockResolvedValueOnce(newInvite)

    const wrapper = mount(InvitesPanel)
    await wrapper.find('.invites-toggle').trigger('click')
    await flushPromises()

    await wrapper.find('.generate-btn').trigger('click')
    await flushPromises()

    expect(wrapper.text()).toContain('NEWCODE1')
  })

  it('shares the newly created invite automatically', async () => {
    vi.spyOn(invitesApi, 'getInvitesApi').mockResolvedValueOnce([])
    const newInvite: Invite = { id: 'invite-new', code: 'NEWCODE1' }
    vi.spyOn(invitesApi, 'createInviteApi').mockResolvedValueOnce(newInvite)

    const wrapper = mount(InvitesPanel)
    await wrapper.find('.invites-toggle').trigger('click')
    await flushPromises()

    await wrapper.find('.generate-btn').trigger('click')
    await flushPromises()

    expect(navigator.clipboard.writeText).toHaveBeenCalledWith(
      expect.stringContaining('?invite=NEWCODE1'),
    )
  })

  it('shares an existing invite link via the clipboard when Web Share is unavailable', async () => {
    const mockInvite: Invite = { id: 'invite-1', code: 'ABC123' }
    vi.spyOn(invitesApi, 'getInvitesApi').mockResolvedValueOnce([mockInvite])

    const wrapper = mount(InvitesPanel)
    await wrapper.find('.invites-toggle').trigger('click')
    await flushPromises()

    await wrapper.find('.ticket-btn').trigger('click')
    await flushPromises()

    expect(navigator.clipboard.writeText).toHaveBeenCalledWith(
      expect.stringContaining('?invite=ABC123'),
    )
    expect(wrapper.text()).toContain('Copied!')
  })

  it('uses the Web Share API instead of the clipboard when available', async () => {
    const shareMock = vi.fn<(data: ShareData) => Promise<void>>().mockResolvedValue(undefined)
    Object.defineProperty(navigator, 'share', { value: shareMock, configurable: true })

    const mockInvite: Invite = { id: 'invite-1', code: 'ABC123' }
    vi.spyOn(invitesApi, 'getInvitesApi').mockResolvedValueOnce([mockInvite])

    const wrapper = mount(InvitesPanel)
    await wrapper.find('.invites-toggle').trigger('click')
    await flushPromises()

    await wrapper.find('.ticket-btn').trigger('click')
    await flushPromises()

    expect(shareMock).toHaveBeenCalledWith(
      expect.objectContaining({ url: expect.stringContaining('?invite=ABC123') }),
    )
    expect(navigator.clipboard.writeText).not.toHaveBeenCalled()
  })

  it('deletes an invite after confirming', async () => {
    const mockInvite: Invite = { id: 'invite-1', code: 'ABC123' }
    vi.spyOn(invitesApi, 'getInvitesApi').mockResolvedValueOnce([mockInvite])
    const deleteSpy = vi.spyOn(invitesApi, 'deleteInviteApi').mockResolvedValueOnce()

    const wrapper = mount(InvitesPanel)
    await wrapper.find('.invites-toggle').trigger('click')
    await flushPromises()

    await wrapper.find('.ticket-btn-danger').trigger('click')
    expect(wrapper.text()).toContain('Delete this invite?')

    const confirmButtons = wrapper.findAll('.ticket-btn-danger')
    await confirmButtons[confirmButtons.length - 1]?.trigger('click')
    await flushPromises()

    expect(deleteSpy).toHaveBeenCalledWith('invite-1')
    expect(wrapper.text()).toContain('No invites yet')
  })

  it('disables delete for already-used invites', async () => {
    const usedInvite: Invite = {
      id: 'invite-1',
      code: 'USEDCODE',
      consumed_at: '2026-01-01T00:00:00.000Z',
    }
    vi.spyOn(invitesApi, 'getInvitesApi').mockResolvedValueOnce([usedInvite])

    const wrapper = mount(InvitesPanel)
    await wrapper.find('.invites-toggle').trigger('click')
    await flushPromises()

    const deleteBtn = wrapper.find('.ticket-btn-danger')
    expect((deleteBtn.element as HTMLButtonElement).disabled).toBe(true)
  })

  it('shows an error banner when loading invites fails', async () => {
    vi.spyOn(invitesApi, 'getInvitesApi').mockRejectedValueOnce(new Error('Network error'))

    const wrapper = mount(InvitesPanel)
    await wrapper.find('.invites-toggle').trigger('click')
    await flushPromises()

    expect(wrapper.find('.banner-error').text()).toContain('Network error')
  })
})

function flushPromises() {
  return new Promise((resolve) => setTimeout(resolve))
}