From b8311ad1ecb4ab3f18f3dc93f62bbb4a807cb9c6 Mon Sep 17 00:00:00 2001
From: Liam <liam@fascinated.cc>
Date: Thu, 12 Sep 2024 23:31:56 +0100
Subject: [PATCH] make animation faster

---
 src/components/player/player-scores.tsx | 58 +++++++++----------------
 1 file changed, 20 insertions(+), 38 deletions(-)

diff --git a/src/components/player/player-scores.tsx b/src/components/player/player-scores.tsx
index a5a0851..35e198c 100644
--- a/src/components/player/player-scores.tsx
+++ b/src/components/player/player-scores.tsx
@@ -28,6 +28,24 @@ const scoreSort = [
   },
 ];
 
+const scoreAnimation: Variants = {
+  hiddenRight: {
+    opacity: 0,
+    x: 50,
+  },
+  hiddenLeft: {
+    opacity: 0,
+    x: -50,
+  },
+  visible: {
+    opacity: 1,
+    x: 0,
+    transition: {
+      staggerChildren: 0.03,
+    },
+  },
+};
+
 type Props = {
   initialScoreData?: ScoreSaberPlayerScoresPage;
   player: ScoreSaberPlayer;
@@ -35,42 +53,6 @@ type Props = {
   page: number;
 };
 
-const containerVariants: Variants = {
-  hiddenRight: {
-    opacity: 0,
-    x: 50,
-  },
-  hiddenLeft: {
-    opacity: 0,
-    x: -50,
-  },
-  visible: {
-    opacity: 1,
-    x: 0,
-    transition: {
-      staggerChildren: 0.05,
-    },
-  },
-};
-
-const childVariants: Variants = {
-  hiddenRight: {
-    opacity: 0,
-    x: 50,
-  },
-  hiddenLeft: {
-    opacity: 0,
-    x: -50,
-  },
-  visible: {
-    opacity: 1,
-    x: 0,
-    transition: {
-      ease: "anticipate",
-    },
-  },
-};
-
 export default function PlayerScores({ initialScoreData, player, sort, page }: Props) {
   const { width } = useWindowDimensions();
   const controls = useAnimation();
@@ -145,11 +127,11 @@ export default function PlayerScores({ initialScoreData, player, sort, page }: P
       <motion.div
         initial="hidden"
         animate={controls}
-        variants={containerVariants}
+        variants={scoreAnimation}
         className="grid min-w-full grid-cols-1 divide-y divide-border"
       >
         {currentScores.playerScores.map((playerScore, index) => (
-          <motion.div key={index} variants={childVariants}>
+          <motion.div key={index} variants={scoreAnimation}>
             <Score playerScore={playerScore} />
           </motion.div>
         ))}