import React from 'react'
import { render, waitFor } from '@testing-library/react-native'
import WorksListScreen from './worksList'

jest.mock('expo-router', () => ({
  useRouter: () => ({
    push: jest.fn(),
  }),
}))

jest.mock('react-i18next', () => ({
  useTranslation: () => ({
    t: (key: string) => {
      const translations: Record<string, string> = {
        'worksList.title': 'My Works',
        'worksList.all': '全部',
        'worksList.pets': '萌宠',
        'worksList.portrait': '写真',
        'worksList.together': '合拍',
      }
      return translations[key] || key
    },
  }),
}))

jest.mock('@/hooks/useWorksList', () => ({
  useWorksList: () => ({
    works: [
      { id: 1, date: new Date(2025, 10, 28), duration: '00:05', category: '萌宠' },
      { id: 2, date: new Date(2025, 10, 28), duration: '00:05', category: '写真' },
    ],
    loading: false,
    error: null,
    refreshing: false,
    hasMore: true,
    loadMore: jest.fn(),
    refresh: jest.fn(),
  }),
}))

describe('WorksListScreen', () => {
  it('should render loading state initially', () => {
    const mockUseWorksList = require('@/hooks/useWorksList').useWorksList
    mockUseWorksList.mockReturnValueOnce({
      works: [],
      loading: true,
      error: null,
      refreshing: false,
      hasMore: false,
      loadMore: jest.fn(),
      refresh: jest.fn(),
    })

    const { getByTestId } = render(<WorksListScreen />)
    expect(getByTestId('loading-state')).toBeTruthy()
  })

  it('should render error state when error occurs', () => {
    const mockUseWorksList = require('@/hooks/useWorksList').useWorksList
    mockUseWorksList.mockReturnValueOnce({
      works: [],
      loading: false,
      error: 'Failed to load',
      refreshing: false,
      hasMore: false,
      loadMore: jest.fn(),
      refresh: jest.fn(),
    })

    const { getByTestId } = render(<WorksListScreen />)
    expect(getByTestId('error-state')).toBeTruthy()
  })

  it('should render works gallery when data is loaded', async () => {
    const { getByText } = render(<WorksListScreen />)

    await waitFor(() => {
      expect(getByText('My Works')).toBeTruthy()
    })
  })
})