import React, { forwardRef } from 'react'
import {
  Text as RNText,
  TouchableOpacity,
  TextProps as RNTextProps,
  TouchableOpacityProps,
  StyleProp,
  TextStyle,
} from 'react-native'
import Animated from 'react-native-reanimated'

interface TextProps extends RNTextProps {
  onClick?: () => void
  touchProps?: TouchableOpacityProps
  animated?: boolean
  style?: StyleProp<TextStyle>
  className?: string
}

const Text = forwardRef<RNText, TextProps>((props, ref) => {
  const { onClick, touchProps = {}, animated, style, className = '', children, ...reset } = props

  const textProps = {
    className,
    ref: ref,
    ...reset,
  }

  const handlePress = () => {
    onClick && onClick()
  }

  if (animated) {
    return <Animated.Text {...textProps}>{children}</Animated.Text>
  }
  if (onClick) {
    return (
      <TouchableOpacity activeOpacity={1} onPress={handlePress} {...touchProps}>
        <RNText {...textProps}>{children}</RNText>
      </TouchableOpacity>
    )
  }

  return <RNText {...textProps}>{children}</RNText>
})

Text.displayName = 'Text'
export default Text
