From 42bd2542f34d60f623ecd88bd547144ac580f1bf Mon Sep 17 00:00:00 2001
From: yohlo <yohlerkyle@gmail.com>
Date: Mon, 6 Oct 2025 12:34:58 -0500
Subject: [PATCH] quick fix noop context

---
 .../_authed/admin/tournaments/run.$id.tsx     |  5 +-
 .../_authed/tournaments/$id.bracket.tsx       |  1 -
 src/lib/spotify/hooks.ts                      | 48 +++++++++++++++++--
 3 files changed, 48 insertions(+), 6 deletions(-)

diff --git a/src/app/routes/_authed/admin/tournaments/run.$id.tsx b/src/app/routes/_authed/admin/tournaments/run.$id.tsx
index a1a97ae..25034a1 100644
--- a/src/app/routes/_authed/admin/tournaments/run.$id.tsx
+++ b/src/app/routes/_authed/admin/tournaments/run.$id.tsx
@@ -11,6 +11,7 @@ import { BracketData } from "@/features/bracket/types";
 import { Match } from "@/features/matches/types";
 import BracketView from "@/features/bracket/components/bracket-view";
 import { SpotifyControlsBar } from "@/features/spotify/components";
+import { useAuth } from "@/contexts/auth-context";
 
 export const Route = createFileRoute("/_authed/admin/tournaments/run/$id")({
   beforeLoad: async ({ context, params }) => {
@@ -39,6 +40,8 @@ export const Route = createFileRoute("/_authed/admin/tournaments/run/$id")({
 function RouteComponent() {
   const { id } = Route.useParams();
   const { data: tournament } = useTournament(id);
+  const { roles } = useAuth();
+  const isAdmin = roles?.includes('Admin') || false;
 
   const bracket: BracketData = useMemo(() => {
     if (!tournament.matches || tournament.matches.length === 0) {
@@ -76,7 +79,7 @@ function RouteComponent() {
 
   return (
     <Container size="md" px={0}>
-      <SpotifyControlsBar />
+      { isAdmin && <SpotifyControlsBar />}
       {tournament.matches?.length ? (
         <BracketView bracket={bracket} showControls />
       ) : (
diff --git a/src/app/routes/_authed/tournaments/$id.bracket.tsx b/src/app/routes/_authed/tournaments/$id.bracket.tsx
index 24a810d..094c39d 100644
--- a/src/app/routes/_authed/tournaments/$id.bracket.tsx
+++ b/src/app/routes/_authed/tournaments/$id.bracket.tsx
@@ -10,7 +10,6 @@ import { useMemo } from "react";
 import { BracketData } from "@/features/bracket/types";
 import { Match } from "@/features/matches/types";
 import BracketView from "@/features/bracket/components/bracket-view";
-import { SpotifyControlsBar } from "@/features/spotify/components";
 
 export const Route = createFileRoute("/_authed/tournaments/$id/bracket")({
   beforeLoad: async ({ context, params }) => {
diff --git a/src/lib/spotify/hooks.ts b/src/lib/spotify/hooks.ts
index d526e9f..7570d5d 100644
--- a/src/lib/spotify/hooks.ts
+++ b/src/lib/spotify/hooks.ts
@@ -13,11 +13,39 @@ export const useSpotify = (): SpotifyContextType => {
 };
 
 export const useSpotifyAuth = () => {
-  const { isAuthenticated, login, logout } = useSpotify();
+  const context = useSpotify();
+
+  if (!context) {
+    return {
+      isAuthenticated: false,
+      login: async () => {},
+      logout: async () => {},
+    };
+  }
+
+  const { isAuthenticated, login, logout } = context;
   return { isAuthenticated, login, logout };
 };
 
 export const useSpotifyPlayback = () => {
+  const context = useSpotify();
+
+  if (!context) {
+    return {
+      playbackState: null,
+      currentTrack: null,
+      play: async () => {},
+      playTrack: async () => {},
+      pause: async () => {},
+      skipNext: async () => {},
+      skipPrevious: async () => {},
+      setVolume: async () => {},
+      refreshPlaybackState: async () => {},
+      isLoading: false,
+      isPlaying: false,
+    };
+  }
+
   const {
     playbackState,
     currentTrack,
@@ -29,7 +57,7 @@ export const useSpotifyPlayback = () => {
     setVolume,
     refreshPlaybackState,
     isLoading,
-  } = useSpotify();
+  } = context;
 
   return {
     playbackState,
@@ -47,14 +75,26 @@ export const useSpotifyPlayback = () => {
 };
 
 export const useSpotifyDevices = () => {
+  const context = useSpotify();
+
+  if (!context) {
+    return {
+      devices: [],
+      activeDevice: null,
+      getDevices: async () => {},
+      setActiveDevice: async () => {},
+      isLoading: false,
+    };
+  }
+
   const {
     devices,
     activeDevice,
     getDevices,
     setActiveDevice,
     isLoading,
-  } = useSpotify();
-  
+  } = context;
+
   return {
     devices,
     activeDevice,