/**
 * useUserFavorites Hook 使用示例
 *
 * 这个示例展示了如何使用 useUserFavorites Hook 来获取用户的收藏列表
 */

import { useEffect, useState } from 'react'
import { FlatList, View, Text } from 'react-native'
import { useUserFavorites } from '@/hooks'

// 占位组件类型声明（实际项目中应从组件库导入）
declare const LoadingSpinner: React.FC
declare const LoadingMoreSpinner: React.FC
declare const ErrorMessage: React.FC<{ message: string }>
declare const FavoriteItem: React.FC<{ favorite: unknown }>

// 示例1：基本用法
function MyFavoritesList() {
  const {
    favorites,
    loading,
    error,
    execute,
    refetch,
    loadMore,
    hasMore,
  } = useUserFavorites()

  useEffect(() => {
    // 初始加载
    execute()
  }, [])

  if (loading && !favorites.length) {
    return <LoadingSpinner />
  }

  if (error) {
    return <ErrorMessage message={error.message} />
  }

  return (
    <FlatList
      data={favorites}
      renderItem={({ item }) => (
        <FavoriteItem favorite={item} />
      )}
      onEndReached={() => {
        if (hasMore && !loading) {
          loadMore()
        }
      }}
      onEndReachedThreshold={0.5}
      ListFooterComponent={() => loading ? <LoadingMoreSpinner /> : null}
    />
  )
}

// 示例2：带自定义参数
function MyFavoritesWithParams() {
  const { favorites, loading } = useUserFavorites({
    limit: 50, // 每页50条
  })

  // ...
}

// 示例3：带搜索功能
function SearchableFavorites() {
  const [searchQuery, setSearchQuery] = useState('')
  const { favorites, execute, loading } = useUserFavorites()

  const handleSearch = (query: string) => {
    setSearchQuery(query)
    execute({ search: query })
  }

  // ...
}

// 示例4：下拉刷新
function RefreshableFavorites() {
  const { favorites, loading, refetch } = useUserFavorites()

  const handleRefresh = () => {
    refetch()
  }

  return (
    <FlatList
      data={favorites}
      refreshing={loading}
      onRefresh={handleRefresh}
      renderItem={({ item }) => <FavoriteItem favorite={item} />}
    />
  )
}

// 示例5：使用返回的完整数据
function FavoritesWithStats() {
  const { data, favorites } = useUserFavorites()

  return (
    <View>
      <Text>Total Favorites: {data?.total || 0}</Text>
      <Text>Current Page: {data?.page || 1}</Text>
      <Text>Per Page: {data?.limit || 20}</Text>
      {/* 列表... */}
    </View>
  )
}

export type { UserFavoriteItem } from '@/hooks'
