style upgrades

src/features/bracket/components/match-card.tsx

@@ -134,6 +134,7 @@ export const MatchCard: React.FC<MatchCardProps> = ({
       queryClient.invalidateQueries({
         queryKey: tournamentKeys.details(match.tournament.id),
       });
+      editSheet.close();
     },
   });
 
@@ -149,9 +150,8 @@ export const MatchCard: React.FC<MatchCardProps> = ({
           matchId: match.id,
         },
       });
-      editSheet.close();
     },
-    [match.id, editSheet]
+    [end, match.id]
   );
 
   const speak = useCallback((text: string): Promise<void> => {
@@ -311,6 +311,7 @@ export const MatchCard: React.FC<MatchCardProps> = ({
                 variant="subtle"
                 color="gray"
                 onClick={handleSpeakerClick}
+                aria-label="Announce matchup"
               >
                 <SpeakerHighIcon size={12} />
               </ActionIcon>
@@ -323,10 +324,12 @@ export const MatchCard: React.FC<MatchCardProps> = ({
             <ActionIcon
               color="green"
               onClick={handleStart}
+              loading={start.isPending}
               size="sm"
               h="100%"
               radius="sm"
               ml={-4}
+              aria-label="Start match"
               style={{
                 borderTopLeftRadius: 0,
                 borderBottomLeftRadius: 0,
@@ -343,10 +346,12 @@ export const MatchCard: React.FC<MatchCardProps> = ({
             <ActionIcon
               color="blue"
               onClick={editSheet.open}
+              loading={end.isPending}
               size="sm"
               h="100%"
               radius="sm"
               ml={-4}
+              aria-label="Edit match score"
               style={{
                 borderTopLeftRadius: 0,
                 borderBottomLeftRadius: 0,
@@ -363,6 +368,7 @@ export const MatchCard: React.FC<MatchCardProps> = ({
           match={match}
           onSubmit={handleFormSubmit}
           onCancel={editSheet.close}
+          loading={end.isPending}
         />
       </Sheet>
     </Flex>