import {QueryClient, QueryClientProvider} from '@tanstack/react-query'
import {render, screen} from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import {beforeEach, expect, test, vi} from 'vitest'
import {parse} from 'yaml'
import {CodeBuildPanel, DEFAULT_BUILDSPEC} from './CodeBuildPanel'
import type {CloudResource} from '@/types/resource'

const api = vi.hoisted(() => ({getCodeBuild: vi.fn(), listCodeBuilds: vi.fn(), startCodeBuild: vi.fn()}))
vi.mock('@/api/cloudProxyClient', () => api)

const project: CloudResource = {id: 'orders', name: 'orders', cloud: 'aws', service: 'codebuild', type: 'codebuild-project', region: 'us-east-1', createdAt: null, metadata: {sourceType: 'NO_SOURCE', ecrRepository: 'orders'}}

beforeEach(() => {
    vi.clearAllMocks()
    api.listCodeBuilds.mockResolvedValue([])
})

test('shows the corrected CodeDeployToECS artifact guidance and default buildspec', async () => {
    const client = new QueryClient({defaultOptions: {queries: {retry: false}}})
    const user = userEvent.setup()
    render(<QueryClientProvider client={client}><CodeBuildPanel resource={project} runtimeReachable/></QueryClientProvider>)

    expect(screen.getByText('{"ImageURI":"..."}')).toBeInTheDocument()
    expect(screen.getByText('taskdef.json')).toBeInTheDocument()
    expect(screen.getByText('appspec.yaml')).toBeInTheDocument()
    await user.click(screen.getByRole('button', {name: 'Start build'}))
    expect(screen.getByRole('textbox', {name: 'Buildspec override'})).toHaveValue(DEFAULT_BUILDSPEC)
    expect(parse(DEFAULT_BUILDSPEC).artifacts.files).toEqual(['imageDetail.json', 'taskdef.json', 'appspec.yaml'])
})

test('shows the configuration animation while a started build is in progress', async () => {
    const client = new QueryClient({defaultOptions: {queries: {retry: false}}})
    const user = userEvent.setup()
    api.startCodeBuild.mockResolvedValue({id: 'build-1', buildNumber: 1, buildStatus: 'IN_PROGRESS', currentPhase: 'BUILD', phases: []})
    api.getCodeBuild.mockResolvedValue({id: 'build-1', buildNumber: 1, buildStatus: 'IN_PROGRESS', currentPhase: 'BUILD', phases: []})
    render(<QueryClientProvider client={client}><CodeBuildPanel resource={project} runtimeReachable/></QueryClientProvider>)

    await user.click(screen.getByRole('button', {name: 'Start build'}))
    await user.click(screen.getAllByRole('button', {name: 'Start build'})[1])

    expect(await screen.findByRole('status')).toHaveTextContent('Build in progress')
    expect(screen.getByRole('img', {name: 'Animated binary configuration icon'})).toBeInTheDocument()
})