how to make a vertical slide of text in React

I am trying to make a vertical text slide. Having not found help in reactjs, I try to do it myself and I'm pretty happy with the result but a slight bug appears at the end of each word slide.

I imagine that there are several ways to create this animation but it is the only one that comes to me with my knowledge in JS.

Here my code:

import React, { useEffect, useRef, useState } from 'react'

const Version1 = () => {

  const [ words, setWords ] = useState(['Victor', 'Alex', 'Lucie'])

  const wrapperRef = useRef()

  const handleAnim = () => {

    setTimeout(() => {
      const copyWords = [ ...words ];
      const firstElem = copyWords.splice(1)
      wrapperRef.current.style.transition = 'none';
      wrapperRef.current.style.top = '0px'
      setWords([ ...firstElem.concat(copyWords) ])
    },1000);

    wrapperRef.current.style.transition = '0.5s';
    wrapperRef.current.style.top = '-70px'
  }
  useEffect(() => {
    setTimeout(() => {
      handleAnim()
    }, 2000);
  })

  return (
    <>
      <div className="test-container">
        <div className='test-title'>Hello</div>
        <div className='text-container-word'>
          <div ref={wrapperRef} className='text-container-word-wrapper'>
            <span className='text-word'>{words[0]}</span>
            <span className='text-word'>{words[1]}</span>
          </div>
        </div>
      </div>
      <style jsx>
        {`
          .test-container {
            padding: 100px 0;
            width: 100%;
            display: flex;
          }
          .test-title {
            font-size: 48px;
            font-weight: bold;
            color: blue;
          }
          .text-container-word {
            position: relative;
            width: 200px;
            height: 70px;
            background-color: green;
            display: inline-block;
            overflow: hidden;
            margin-top: -7px;
          }
          .text-container-word-wrapper {
            height: auto;
            position: relative;
            top: 0px;
          }
          .test-container h1 {
            position: relative;
            display: inline;
            padding: 10px;
          }
          .text-word {
            height: 70px;
            font-size: 48px;
            font-weight: bold;
            display: block;
            transition: 0.5s;
            line-height: 70px;
          }
       

        `}
      </style>
    </>
  )
}

export default Version1