free agents

src/features/reactions/components/emoji-bar.tsx

@@ -58,15 +58,12 @@ const EmojiBar = ({
     return reaction.players.map(p => p.id).includes(user?.id || "");
   }, [user?.id]);
 
-  // Get emojis the current user has reacted to
   const userReactions = reactions?.filter(r => hasReacted(r)).map(r => r.emoji) || [];
 
   if (!reactions) return;
 
-  // Sort reactions by count (descending)
   const sortedReactions = [...reactions].sort((a, b) => b.count - a.count);
 
-  // Group reactions: show first 3, group the rest
   const visibleReactions = sortedReactions.slice(0, 3);
   const groupedReactions = sortedReactions.slice(3);
 

src/features/reactions/queries.ts

@@ -1,4 +1,4 @@
-import { useServerQuery, useServerMutation } from "@/lib/tanstack-query/hooks";
+import { useServerMutation, useServerSuspenseQuery } from "@/lib/tanstack-query/hooks";
 import { getMatchReactions, toggleMatchReaction } from "@/features/matches/server";
 import { useQueryClient } from "@tanstack/react-query";
 
@@ -14,7 +14,7 @@ export const reactionQueries = {
 };
 
 export const useMatchReactions = (matchId: string) =>
-  useServerQuery(reactionQueries.match(matchId));
+  useServerSuspenseQuery(reactionQueries.match(matchId));
 
 export const useToggleMatchReaction = (matchId: string) => {
   const queryClient = useQueryClient();
@@ -27,4 +27,4 @@ export const useToggleMatchReaction = (matchId: string) => {
       });
     },
   });
-};
+};