import { expect, test } from '@playwright/test'
import {
  createAuthenticatedApiContext,
  createTroubleshootingTree,
  createProceduralTree,
  disposeApiContext,
  uniqueName,
} from './helpers/api'

test.describe('tree editor smoke tests', () => {
  test('can open and edit a troubleshooting flow in the editor', async ({ page }) => {
    const api = await createAuthenticatedApiContext()
    const tree = await createTroubleshootingTree(api, {
      name: uniqueName('PW Edit Troubleshooting'),
      question: 'Is the device powered on?',
    })

    try {
      await page.goto(`/trees/${tree.id}/edit`)

      // Editor should load with the tree name
      await expect(page.getByDisplayValue(tree.name)).toBeVisible({ timeout: 10000 })

      // Should see the root question node
      await expect(page.getByText('Is the device powered on?')).toBeVisible()

      // Edit the tree name
      const nameInput = page.getByDisplayValue(tree.name)
      await nameInput.clear()
      await nameInput.fill('Updated Flow Name')

      // Save
      const saveButton = page.getByRole('button', { name: /Save/ })
      await saveButton.click()

      // Should show success indicator
      await expect(page.getByText(/Saved|saved|success/i)).toBeVisible({ timeout: 5000 })
    } finally {
      await disposeApiContext(api)
    }
  })

  test('can open and edit a procedural flow in the editor', async ({ page }) => {
    const api = await createAuthenticatedApiContext()
    const tree = await createProceduralTree(api, {
      name: uniqueName('PW Edit Procedural'),
    })

    try {
      await page.goto(`/flows/${tree.id}/edit`)

      // Editor should load
      await expect(page.getByText('Verify the server is reachable')).toBeVisible({ timeout: 10000 })
      await expect(page.getByText('Check the service status')).toBeVisible()
      await expect(page.getByText('Restart the service if needed')).toBeVisible()

      // Should be able to add a new step
      const addStepButton = page.getByRole('button', { name: /Add Step/i })
      if (await addStepButton.isVisible()) {
        await addStepButton.click()
        // A new step should appear
        await expect(page.getByPlaceholder(/step title|untitled/i)).toBeVisible({ timeout: 3000 })
      }
    } finally {
      await disposeApiContext(api)
    }
  })
})