import React, { ReactElement } from 'react'
import { render, RenderOptions } from '@testing-library/react'
import { AuthContext } from '@/components/auth/auth-provider'
import { mockUser } from '../fixtures/mock-data'

// Create mock context values for different auth states
export const createMockAuthContext = (isAuthenticated = true, user = mockUser) => ({
  user: isAuthenticated ? user : null,
  token: isAuthenticated ? 'mock-token-123' : null,
  isAuthenticated,
  isLoading: false,
  login: jest.fn().mockResolvedValue(undefined),
  register: jest.fn().mockResolvedValue(undefined),
  logout: jest.fn(),
})

// Mock AuthProvider component for tests
export const MockAuthProvider = ({ children, isAuthenticated = true, user = mockUser }: { children: React.ReactNode; isAuthenticated?: boolean; user?: any }) => {
  const mockAuthContextValue = createMockAuthContext(isAuthenticated, user)

  return (
    <AuthContext.Provider value={mockAuthContextValue}>
      {children}
    </AuthContext.Provider>
  )
}

// Custom render function that includes providers
export const renderWithProviders = (
  ui: ReactElement,
  { isAuthenticated = true, user = mockUser, ...options }: { isAuthenticated?: boolean; user?: any } & Omit<RenderOptions, 'wrapper'> = {}
) => {
  const Wrapper = ({ children }: { children: React.ReactNode }) => {
    return <MockAuthProvider isAuthenticated={isAuthenticated} user={user}>{children}</MockAuthProvider>
  }

  return render(ui, { wrapper: Wrapper, ...options })
}

// Helper to create mock form data
export const createMockFormData = (overrides?: Partial<any>) => {
  return {
    email: 'test@example.com',
    password: 'Test@1234',
    name: 'Test User',
    ...overrides,
  }
}

// Helper to create mock portfolio data
export const createMockPortfolio = (overrides?: Partial<any>) => {
  return {
    id: '1',
    userId: '1',
    name: 'Test Portfolio',
    domain: 'test.com',
    status: 'Uploaded',
    createdAt: new Date().toISOString(),
    updatedAt: new Date().toISOString(),
    ...overrides,
  }
}

// Helper to wait for async operations
export const waitForAsync = () =>
  new Promise((resolve) => setTimeout(resolve, 0))

// Helper to create mock file for upload tests
export const createMockFile = (name = 'portfolio.zip', size = 1024) => {
  const blob = new Blob(['a'.repeat(size)], { type: 'application/zip' })
  return new File([blob], name, { type: 'application/zip' })
}

// Helper to test form validation
export const getFormError = (element: HTMLElement, fieldName: string) => {
  return element.querySelector(`[data-testid="${fieldName}-error"]`)?.textContent
}

// Helper to simulate user typing in form field
export const typeInFormField = async (
  element: HTMLInputElement,
  value: string,
  { delay = 0 } = {}
) => {
  element.value = value
  element.dispatchEvent(new Event('change', { bubbles: true }))
  if (delay) {
    await new Promise((resolve) => setTimeout(resolve, delay))
  }
}

// Re-export everything from React Testing Library
export * from '@testing-library/react'
export { default as userEvent } from '@testing-library/user-event'
