diff --git a/apps/remix/app/routes/_recipient+/sign.$token+/complete.tsx b/apps/remix/app/routes/_recipient+/sign.$token+/complete.tsx
index b5fd51709..d39b64c9d 100644
--- a/apps/remix/app/routes/_recipient+/sign.$token+/complete.tsx
+++ b/apps/remix/app/routes/_recipient+/sign.$token+/complete.tsx
@@ -119,7 +119,7 @@ export default function CompletedSigningPage({ loaderData }: Route.ComponentProp
return (
diff --git a/packages/ui/components/signing-card.tsx b/packages/ui/components/signing-card.tsx
index be891d289..d6465e5e4 100644
--- a/packages/ui/components/signing-card.tsx
+++ b/packages/ui/components/signing-card.tsx
@@ -24,7 +24,7 @@ export const SigningCard = ({
signingCelebrationImage,
}: SigningCardProps) => {
return (
-
+
{signingCelebrationImage && (
@@ -48,7 +48,7 @@ export const SigningCard3D = ({
const [trackMouse, setTrackMouse] = useState(false);
- const timeoutRef = useRef
();
+ const timeoutRef = useRef();
const cardX = useMotionValue(0);
const cardY = useMotionValue(0);
@@ -103,7 +103,7 @@ export const SigningCard3D = ({
clearTimeout(timeoutRef.current);
// Revert the card back to the center position after the mouse stops moving.
- timeoutRef.current = setTimeout(() => {
+ timeoutRef.current = window.setTimeout(() => {
void animate(cardX, 0, { duration: 2, ease: 'backInOut' });
void animate(cardY, 0, { duration: 2, ease: 'backInOut' });
@@ -120,12 +120,15 @@ export const SigningCard3D = ({
return () => {
window.removeEventListener('mousemove', onMouseMove);
+ if (timeoutRef.current) {
+ window.clearTimeout(timeoutRef.current);
+ }
};
}, [onMouseMove]);
return (