nominate animation

2025-08-03 13:56:41 +02:00
parent 80eb434cde
commit 5ee177e4cf
3 changed files with 41 additions and 29 deletions
@@ -1,6 +1,6 @@
 "use client";
 import "./style.css";
-import { useState } from "react";
+import { useState, createContext, useContext } from "react";
 import { AuthProvider } from "react-oidc-context";
 import { oidcConfig, userManager } from "muzak/config/auth";
 import { Source_Sans_3, Nunito } from "next/font/google";
@@ -8,10 +8,22 @@ import AuthStatus from "muzak/components/AuthStatus";
 import NavigationBar from "muzak/components/NavigationBar";
 import Quota from "muzak/components/Quota";

-const sourceSans = Source_Sans_3({
-  weight: ["400"],
-  subsets: ["latin"],
-});
+interface AnimationContextType {
+  isAnimate: boolean;
+  setIsAnimate: React.Dispatch<React.SetStateAction<boolean>>;
+}
+
+const AnimationContext = createContext<AnimationContextType | undefined>(
+  undefined,
+);
+
+export const useAnimation = () => {
+  const context = useContext(AnimationContext);
+  if (context === undefined) {
+    throw new Error("useAnimation must be used within an AnimationProvider");
+  }
+  return context;
+};

 const nunito = Nunito({
  subsets: ["latin"],
@@ -52,16 +64,14 @@ export default function RootLayout({
    <html lang="en" className={nunito.className}>
      <body className={`bg-game-show ${isAnimate ? "animate" : ""} h-screen`}>
        <AuthProvider {...oidcConfig}>
-          <LayoutContent
-            children={children}
-            quota={quota}
-            setQuota={setQuota}
-          />
+          <AnimationContext.Provider value={{ isAnimate, setIsAnimate }}>
+            <LayoutContent
+              children={children}
+              quota={quota}
+              setQuota={setQuota}
+            />
+          </AnimationContext.Provider>
        </AuthProvider>
-        <button
-          className={`absolute top-1 left-1 ${isAnimate ? "pause" : "play"}`}
-          onClick={toggleAnimation}
-        ></button>
      </body>
    </html>
  );