import React from 'react'
import { View, ActivityIndicator, ViewProps } from 'react-native'
import Text from './ui/Text'

interface LoadingStateProps extends ViewProps {
  message?: string
  color?: string
}

export default function LoadingState({ message, color = '#F5F5F5', testID, ...props }: LoadingStateProps) {
  return (
    <View testID={testID} className="flex-1 items-center justify-center" {...props}>
      <ActivityIndicator size="large" color={color} />
      {message && <Text className="mt-4">{message}</Text>}
    </View>
  )
}