import { Text } from 'react-native'
import { useState, useEffect } from "react"

const Loader = ({ style = {}, text = 'Loading...' }) => {
  const [nr, setNr] = useState(0)

  useEffect(() => {
    const timer = setTimeout(() => {
      nr < text.length
        ? setNr(nr+1)
        : clearTimeout(timer)
    }, 50);

    return () => clearTimeout(timer);
  });

  return <Text style={{ color: 'grey', ...style }}>{text.substring(0, nr)}</Text>
}

export default Loader
