From b4a037388a26a5c93143c373d493537e8fd11842 Mon Sep 17 00:00:00 2001
From: Mark Hoekveen <mark@hoekveen.net>
Date: Thu, 21 Aug 2025 20:43:00 +0200
Subject: [PATCH] adds next track short animation

---
 frontend/src/app/lobby/page.tsx | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/frontend/src/app/lobby/page.tsx b/frontend/src/app/lobby/page.tsx
index fa3aa1a..e9b4a6b 100644
--- a/frontend/src/app/lobby/page.tsx
+++ b/frontend/src/app/lobby/page.tsx
@@ -9,6 +9,7 @@ import { useSession } from "muzak/contexts/SessionContext";
 import { getUser, api, Track } from "muzak/data/fetcher";
 import getSessionId from "muzak/data/session";
 import { useSpotifyIframe } from "muzak/contexts/SpotifyIframe";
+import { useAnimation } from "muzak/contexts/AnimationContext";
 
 const nunito = Nunito({
   weight: "900",
@@ -35,6 +36,7 @@ export default function Lobby() {
   const [playingPercentage, setPlayingPercentage] = useState(0);
   const [secondsLeft, setSecondsLeft] = useState(30);
   const [state, setState] = useState("lobby"); // lobby, playing, waiting, loading
+  const { isAnimate, setIsAnimate } = useAnimation();
 
   // Main message handler and dispatcher
   function onMessage(e) {
@@ -44,6 +46,8 @@ export default function Lobby() {
       if (key === "joined") {
         addUser(data[key]);
       } else if (key == "track") {
+        setIsAnimate(false);
+        setTimeout(() => setIsAnimate(true), 1000);
         getTrack();
       } else if (key == "voted") {
         voteUser(data[key]);