From 0a37206d32a4c80c33a7bf2735bd5a9b38b8f346 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9CIsaac?= <isaac@isaacmason.com>
Date: Sun, 14 Apr 2024 15:30:33 +1000
Subject: [PATCH] feat: cleanup FrameStepper, don't export useRaf

---
 .../src/components/FrameStepper.tsx           | 63 +++++++++----------
 .../src/components/Physics.tsx                |  9 +--
 2 files changed, 35 insertions(+), 37 deletions(-)

diff --git a/packages/react-three-jolt/src/components/FrameStepper.tsx b/packages/react-three-jolt/src/components/FrameStepper.tsx
index 5103e15..992698d 100644
--- a/packages/react-three-jolt/src/components/FrameStepper.tsx
+++ b/packages/react-three-jolt/src/components/FrameStepper.tsx
@@ -2,11 +2,36 @@ import { useFrame } from '@react-three/fiber';
 import React, { memo, useEffect, useRef } from 'react';
 import { PhysicsProps } from './Physics';
 
-interface FrameStepperProps {
+const useRaf = (callback: (dt: number) => void) => {
+    const callbackRef = useRef(callback);
+    const animationFrameRequest = useRef(0);
+    const lastFrameTime = useRef(0);
+
+    useEffect(() => {
+        callbackRef.current = callback;
+    }, [callback]);
+
+    useEffect(() => {
+        const loop = () => {
+            const now = performance.now();
+            const delta = now - lastFrameTime.current;
+
+            animationFrameRequest.current = requestAnimationFrame(loop);
+            callbackRef.current(delta / 1000);
+            lastFrameTime.current = now;
+        };
+
+        animationFrameRequest.current = requestAnimationFrame(loop);
+
+        return () => cancelAnimationFrame(animationFrameRequest.current);
+    }, []);
+};
+
+type FrameStepperProps = {
     type?: PhysicsProps['updateLoop'];
     onStep: (dt: number) => void;
     updatePriority?: number;
-}
+};
 
 const UseFrameStepper = ({ onStep, updatePriority }: FrameStepperProps) => {
     useFrame((_, dt) => {
@@ -23,39 +48,11 @@ const RafStepper = ({ onStep }: FrameStepperProps) => {
 
     return null;
 };
-//@ts-ignore fix missing type value on props
-const FrameStepper = ({ onStep, type, updatePriority }: FrameStepperProps) => {
+
+export const FrameStepper = memo(({ onStep, type, updatePriority }: FrameStepperProps) => {
     return type === 'independent' ? (
         <RafStepper onStep={onStep} />
     ) : (
         <UseFrameStepper onStep={onStep} updatePriority={updatePriority} />
     );
-};
-
-export default memo(FrameStepper);
-
-// Moved this hook here because it's only used in this file
-export const useRaf = (callback: (dt: number) => void) => {
-    const cb = useRef(callback);
-    const raf = useRef(0);
-    const lastFrame = useRef(0);
-
-    useEffect(() => {
-        cb.current = callback;
-    }, [callback]);
-
-    useEffect(() => {
-        const loop = () => {
-            const now = performance.now();
-            const delta = now - lastFrame.current;
-
-            raf.current = requestAnimationFrame(loop);
-            cb.current(delta / 1000);
-            lastFrame.current = now;
-        };
-
-        raf.current = requestAnimationFrame(loop);
-
-        return () => cancelAnimationFrame(raf.current);
-    }, []);
-};
+});
diff --git a/packages/react-three-jolt/src/components/Physics.tsx b/packages/react-three-jolt/src/components/Physics.tsx
index ca98ab7..5819398 100644
--- a/packages/react-three-jolt/src/components/Physics.tsx
+++ b/packages/react-three-jolt/src/components/Physics.tsx
@@ -21,7 +21,7 @@ import React from 'react';
 
 import { useMount, useUnmount } from '../hooks';
 // library imports
-import FrameStepper from './FrameStepper';
+import { FrameStepper } from './FrameStepper';
 
 // physics system import
 import { PhysicsSystem } from '../systems/physics-system';
@@ -47,17 +47,18 @@ export interface SteppingState {
 }
 
 // Core component
-export interface PhysicsProps {
+export type PhysicsProps = {
     defaultBodySettings?: any;
     children: ReactNode;
     gravity?: number | THREE.Vector3;
     paused?: boolean;
     interpolate?: boolean;
     updatePriority?: any;
-    updateLoop?: string;
+    updateLoop?: 'follow' | 'independent';
     debug?: boolean;
     module?: any;
-}
+};
+
 export const Physics: FC<PhysicsProps> = (props) => {
     const {
         defaultBodySettings,