"use client";
import React, { useState, useEffect } from "react";
interface CounterProps {
from: number;
to: number;
duration?: number;
decimals?: number;
suffix?: string;
}
function Counter({ from, to, duration = 2000, decimals = 0, suffix = "" }: CounterProps) {
const [value, setValue] = useState(from);
useEffect(() => {
let startTimestamp: number | null = null;
const step = (timestamp: number) => {
if (!startTimestamp) startTimestamp = timestamp;
const progress = Math.min((timestamp - startTimestamp) / duration, 1);
const currentValue = progress * (to - from) + from;
setValue(currentValue);
if (progress < 1) {
window.requestAnimationFrame(step);
}
};
window.requestAnimationFrame(step);
}, [from, to, duration]);
return (
<>
{value.toFixed(decimals)}
{suffix}
);
}
export default function MileTruthHero() {
const [mounted, setMounted] = useState(false);
useEffect(() => {
requestAnimationFrame(() => setMounted(true));
}, []);
return (
<>