Fix GameClock to show Maia strength level (e.g., 'Maia 1100')

Co-authored-by: ashtonanderson <32369295+ashtonanderson@users.noreply.github.com>

Author: Copilot

src/components/Board/GameClock.tsx

@@ -13,7 +13,7 @@ export const GameClock: React.FC<Props> = (
   props: React.PropsWithChildren<Props>,
 ) => {
   const { user } = useContext(AuthContext)
-  const { player, toPlay, whiteClock, blackClock, lastMoveTime } = useContext(
+  const { player, toPlay, whiteClock, blackClock, lastMoveTime, maiaVersion } = useContext(
     PlayControllerContext,
   )
 
@@ -29,6 +29,11 @@ export const GameClock: React.FC<Props> = (
     0,
   )
 
+  // Convert maiaVersion (e.g., "maia_kdd_1100") to display name (e.g., "Maia 1100")
+  const getMaiaDisplayName = (version: string) => {
+    return version.replace('maia_kdd_', 'Maia ')
+  }
+
   useEffect(() => {
     setReferenceTime(Date.now())
 
@@ -52,7 +57,7 @@ export const GameClock: React.FC<Props> = (
     >
       <div className="px-4 py-2">
         {props.player == 'black' ? '●' : '○'}{' '}
-        {player == props.player ? user?.displayName : 'Maia'}
+        {player == props.player ? user?.displayName : getMaiaDisplayName(maiaVersion)}
       </div>
       <div className="inline-flex self-start px-4 py-2 md:text-3xl">
         {minutes}:{('00' + seconds).slice(-2)}