diff --git a/src/screens/Writing/CreatingLyrics.js b/src/screens/Writing/CreatingLyrics.js index d5fbdc4..95237d6 100644 --- a/src/screens/Writing/CreatingLyrics.js +++ b/src/screens/Writing/CreatingLyrics.js @@ -18,6 +18,9 @@ import { segmentRequiresLyrics, } from "../../utils/songStructure"; +const FAKE_PROGRESS_MAX = 96; +const PROGRESS_INTERVAL_MS = 250; + const CreatingLyrics = ({ active, config, selections }) => { const [progress, setProgress] = useState(0); const [called, setCalled] = useState(false); @@ -42,20 +45,29 @@ const CreatingLyrics = ({ active, config, selections }) => { }, [active]); useEffect(() => { - if (active) { - const interval = setInterval(() => { - setProgress((prevProgress) => { - if (prevProgress >= 100) { - clearInterval(interval); - return 100; - } - return prevProgress + 1; - }); - }, 100); + if (!active) return undefined; - return () => clearInterval(interval); - } - }, [active]); + const interval = setInterval(() => { + setProgress((prevProgress) => { + if (result || error) return prevProgress; + if (prevProgress >= FAKE_PROGRESS_MAX) { + return FAKE_PROGRESS_MAX; + } + + const increment = + prevProgress < 60 + ? 1 + : prevProgress < 80 + ? 0.6 + : 0.3; + + const next = prevProgress + increment; + return next >= FAKE_PROGRESS_MAX ? FAKE_PROGRESS_MAX : next; + }); + }, PROGRESS_INTERVAL_MS); + + return () => clearInterval(interval); + }, [active, result, error]); useEffect(() => { const run = async () => {