import { test, expect } from '@playwright/test'

test.describe('Trading Page', () => {
    test.beforeEach(async ({ page }) => {
        await page.goto('/trading')
        await page.waitForLoadState('networkidle')
    })

    test('displays trading page title', async ({ page }) => {
        await expect(page.getByRole('heading', { name: /trading/i })).toBeVisible()
    })

    test('shows order form button', async ({ page }) => {
        // Look for new order button or order form
        const orderButton = page.getByRole('button', { name: /new order|place order|create order/i })
        await expect(orderButton).toBeVisible()
    })

    test('displays positions section', async ({ page }) => {
        // Look for positions area
        await expect(page.getByText(/positions/i).first()).toBeVisible()
    })

    test('displays orders section', async ({ page }) => {
        // Look for orders area
        await expect(page.getByText(/orders/i).first()).toBeVisible()
    })

    test('paper trading toggle is visible', async ({ page }) => {
        // Look for paper trading switch
        const paperToggle = page.getByRole('switch', { name: /paper/i }).or(
            page.getByText(/paper trading/i)
        )
        await expect(paperToggle.first()).toBeVisible()
    })
})

test.describe('Trading - Order Form', () => {
    test.beforeEach(async ({ page }) => {
        await page.goto('/trading')
        await page.waitForLoadState('networkidle')
    })

    test('opens order form dialog', async ({ page }) => {
        // Click new order button
        const orderButton = page.getByRole('button', { name: /new order|place order|create order/i })
        await orderButton.click()

        // Check dialog opens
        await expect(page.getByRole('dialog')).toBeVisible()
    })

    test('order form has required fields', async ({ page }) => {
        // Open order form
        const orderButton = page.getByRole('button', { name: /new order|place order|create order/i })
        await orderButton.click()

        await expect(page.getByRole('dialog')).toBeVisible()

        // Check for symbol field
        await expect(page.getByLabel(/symbol/i)).toBeVisible()

        // Check for quantity field
        await expect(page.getByLabel(/quantity|amount/i)).toBeVisible()

        // Check for side selection (buy/sell)
        await expect(page.getByText(/buy|sell/i).first()).toBeVisible()

        // Check for order type
        await expect(page.getByLabel(/order type|type/i)).toBeVisible()
    })

    test('can close order form', async ({ page }) => {
        // Open order form
        const orderButton = page.getByRole('button', { name: /new order|place order|create order/i })
        await orderButton.click()

        await expect(page.getByRole('dialog')).toBeVisible()

        // Close dialog
        await page.getByRole('button', { name: /cancel|close/i }).click()

        await expect(page.getByRole('dialog')).not.toBeVisible()
    })
})

test.describe('Trading - Balance Display', () => {
    test('shows balance information', async ({ page }) => {
        await page.goto('/trading')
        await page.waitForLoadState('networkidle')

        // Look for balance display
        const balanceText = page.getByText(/balance|total|available/i)
        await expect(balanceText.first()).toBeVisible()
    })
})