DynamicWord.jsx

import { useState, useEffect } from 'react';
import DecryptedText from './DecryptedText';

const words = ['ChatGPT', 'Google Ai Overviews', 'Microsoft Copilot', 'Perplexity'];

export default function DynamicWord() {
  const [currentWordIndex, setCurrentWordIndex] = useState(0);

  useEffect(() => {
    const interval = setInterval(() => {
      setCurrentWordIndex((prev) => (prev + 1) % words.length);
    }, 3000);
    return () => clearInterval(interval);
  }, []);

  return (
    <DecryptedText
      text={words[currentWordIndex]}
      animateOn="view"
      sequential={true}
      revealDirection="start"
      speed={50}
      maxIterations={10}
      className="text_changer_text"
      encryptedClassName="text_changer_text--encrypted"
    />
  );
}