import { useFrame } from '@react-three/fiber';
import { useRef } from 'react';

import { useViewerStore } from '../store/viewerStore';

export function FpsSampler() {
  const framesRef = useRef(0);
  const lastSampleRef = useRef(0);
  const setFps = useViewerStore((state) => state.setFps);

  useFrame(({ clock }) => {
    framesRef.current += 1;
    const now = clock.getElapsedTime();

    if (now - lastSampleRef.current >= 0.5) {
      const elapsed = now - lastSampleRef.current || 0.5;
      setFps(framesRef.current / elapsed);
      framesRef.current = 0;
      lastSampleRef.current = now;
    }
  });

  return null;
}