From cd9915cd6ecf32b62487eb3ffbc44176dda46a15 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Sun, 8 Mar 2026 22:21:16 +0000
Subject: [PATCH] Update src/components/cardStack/hooks/useDepth3DAnimation.ts

---
 .../cardStack/hooks/useDepth3DAnimation.ts    | 40 ++++---------------
 1 file changed, 8 insertions(+), 32 deletions(-)

diff --git a/src/components/cardStack/hooks/useDepth3DAnimation.ts b/src/components/cardStack/hooks/useDepth3DAnimation.ts
index bade6f6..ba90622 100644
--- a/src/components/cardStack/hooks/useDepth3DAnimation.ts
+++ b/src/components/cardStack/hooks/useDepth3DAnimation.ts
@@ -1,38 +1,14 @@
-import { useEffect, useState } from "react";
+import { useEffect, useRef } from "react";
 
-interface Depth3DTransform {
-  transform: string;
-  opacity: number;
-  zIndex: number;
-}
-
-const useDepth3DAnimation = (
-  totalItems: number,
-  activeIndex: number
-): Depth3DTransform[] => {
-  const [transforms, setTransforms] = useState<Depth3DTransform[]>([]);
+function useDepth3DAnimation() {
+  const containerRef = useRef<HTMLDivElement>(null);
 
   useEffect(() => {
-    const newTransforms: Depth3DTransform[] = Array.from(
-      { length: totalItems },
-      (_, i) => {
-        const distance = (i - activeIndex + totalItems) % totalItems;
-        const scale = Math.max(0.85, 1 - distance * 0.05);
-        const yOffset = distance * 20;
-        const opacity = distance === 0 ? 1 : Math.max(0.3, 1 - distance * 0.2);
+    // Initialize 3D animation
+  }, []);
 
-        return {
-          transform: `translateY(${yOffset}px) scale(${scale})`,
-          opacity,
-          zIndex: totalItems - distance,
-        };
-      }
-    );
-
-    setTransforms(newTransforms);
-  }, [activeIndex, totalItems]);
-
-  return transforms;
-};
+  return containerRef;
+}
 
+export { useDepth3DAnimation };
 export default useDepth3DAnimation;