import {
  comfyPageFixture as test,
  comfyExpect as expect
} from '@e2e/fixtures/ComfyPage'

test.describe('Queue Clear History Dialog', { tag: '@ui' }, () => {
  test.beforeEach(async ({ comfyPage }) => {
    await comfyPage.queuePanel.overlayToggle.click()
  })

  test('Dialog opens from queue panel history actions menu', async ({
    comfyPage
  }) => {
    await comfyPage.queuePanel.openClearHistoryDialog()

    const dialog = comfyPage.confirmDialog.root
    await expect(dialog).toBeVisible()
  })

  test('Dialog shows confirmation message with title, description, and assets note', async ({
    comfyPage
  }) => {
    await comfyPage.queuePanel.openClearHistoryDialog()

    const dialog = comfyPage.confirmDialog.root
    await expect(dialog).toBeVisible()

    await expect(
      dialog.getByText('Clear your job queue history?')
    ).toBeVisible()

    await expect(
      dialog.getByText(
        'All the finished or failed jobs below will be removed from this Job queue panel.'
      )
    ).toBeVisible()

    await expect(
      dialog.getByText(
        'Assets generated by these jobs won\u2019t be deleted and can always be viewed from the assets panel.'
      )
    ).toBeVisible()
  })

  test('Cancel button closes dialog without clearing history', async ({
    comfyPage
  }) => {
    await comfyPage.queuePanel.openClearHistoryDialog()

    const dialog = comfyPage.confirmDialog.root
    await expect(dialog).toBeVisible()

    let clearCalled = false
    await comfyPage.page.route('**/api/history', (route) => {
      if (route.request().method() === 'POST') {
        clearCalled = true
      }
      return route.continue()
    })

    await dialog.getByRole('button', { name: 'Cancel' }).click()
    await expect(dialog).toBeHidden()
    expect(clearCalled).toBe(false)

    await comfyPage.page.unroute('**/api/history')
  })

  test('Close (X) button closes dialog without clearing history', async ({
    comfyPage
  }) => {
    await comfyPage.queuePanel.openClearHistoryDialog()

    const dialog = comfyPage.confirmDialog.root
    await expect(dialog).toBeVisible()

    let clearCalled = false
    await comfyPage.page.route('**/api/history', (route) => {
      if (route.request().method() === 'POST') {
        clearCalled = true
      }
      return route.continue()
    })

    await dialog.getByLabel('Close').click()
    await expect(dialog).toBeHidden()
    expect(clearCalled).toBe(false)

    await comfyPage.page.unroute('**/api/history')
  })

  test('Confirm clears queue history and closes dialog', async ({
    comfyPage
  }) => {
    await comfyPage.queuePanel.openClearHistoryDialog()

    const dialog = comfyPage.confirmDialog.root
    await expect(dialog).toBeVisible()

    const clearPromise = comfyPage.page.waitForRequest(
      (req) => req.url().includes('/api/history') && req.method() === 'POST'
    )

    await dialog.getByRole('button', { name: 'Clear' }).click()

    const request = await clearPromise
    expect(request.postDataJSON()).toEqual({ clear: true })

    await expect(dialog).toBeHidden()
  })

  test('Dialog state resets after close and reopen', async ({ comfyPage }) => {
    await comfyPage.queuePanel.openClearHistoryDialog()
    const dialog = comfyPage.confirmDialog.root
    await expect(dialog).toBeVisible()
    await dialog.getByRole('button', { name: 'Cancel' }).click()
    await expect(dialog).toBeHidden()

    await comfyPage.queuePanel.openClearHistoryDialog()
    await expect(dialog).toBeVisible()

    const clearButton = dialog.getByRole('button', { name: 'Clear' })
    await expect(clearButton).toBeVisible()
    await expect(clearButton).toBeEnabled()
  })
})