diff --git a/src/app/players/[id]/games.tsx b/src/app/players/[id]/games.tsx deleted file mode 100644 index a1f65f9..0000000 --- a/src/app/players/[id]/games.tsx +++ /dev/null @@ -1,97 +0,0 @@ -'use client' - -import { - Table, - TableBody, - TableCaption, - TableCell, - TableHead, - TableHeader, - TableRow, -} from '@/components/ui/table' -import { cn } from '@/lib/utils' -import { api } from '@/trpc/react' -import { useFormatter } from 'next-intl' -import { useParams } from 'next/navigation' - -export function PlayerGames() { - const { id } = useParams() - if (!id || typeof id !== 'string') { - return null - } - const [games] = api.history.user_games.useSuspenseQuery({ user_id: id }) - - const format = useFormatter() - - return ( - - User's latest games - - - Game type - Opponent - Opponent MMR - MMR - Result - Date - Time - - - - {games.map((game) => { - return ( - - {game.gameType} - {game.opponentName} - - {Math.trunc(game.opponentMmr)} - - - {Math.trunc(game.playerMmr)} - - - - - - - {format.dateTime(game.gameTime, { - hour: '2-digit', - minute: '2-digit', - })} - - - ) - })} - -
- ) -} - -const numberFormatter = new Intl.NumberFormat('en-US', { - signDisplay: 'exceptZero', -}) - -function GameResultCell({ - result, - mmrChange, -}: { result: string; mmrChange: number }) { - return ( - - {numberFormatter.format(Math.trunc(mmrChange))} - - ) -} diff --git a/src/app/players/[id]/user.tsx b/src/app/players/[id]/user.tsx index 48648dd..c7e99c0 100644 --- a/src/app/players/[id]/user.tsx +++ b/src/app/players/[id]/user.tsx @@ -1,5 +1,11 @@ 'use client' +import { + Tooltip, + TooltipContent, + TooltipProvider, + TooltipTrigger, +} from '@/components/ui/tooltip' import type React from 'react' import { useState } from 'react' @@ -26,6 +32,7 @@ import { ChevronUp, Filter, IceCreamCone, + InfoIcon, MinusCircle, ShieldHalf, Star, @@ -104,8 +111,13 @@ export function UserInfo() { } } + const aliases = [...new Set(games.map((g) => g.playerName))] + console.log(aliases) + const lastGame = games.at(0) + + const currentName = lastGame?.playerName ?? discord_user.username const profileData = { - username: discord_user.username, + username: currentName, avatar: discord_user.avatar_url, games: games_played, wins, @@ -114,7 +126,6 @@ export function UserInfo() { winRate: games_played > 0 ? Math.round((wins / games_played) * 100) : 0, } - const lastGame = games.at(0) const firstGame = games.at(-1) // Get last games for each leaderboard @@ -144,9 +155,29 @@ export function UserInfo() {
-

- {profileData.username} -

+
+

+ {profileData.username} +

+ + + + + + +
+

Also known as:

+
    + {aliases.map((alias) => ( +
  • {alias}
  • + ))} +
+
+
+
+
+
+

{firstGame ? ( <>First game: {dateFormatter.format(firstGame.gameTime)} diff --git a/src/components/ui/tooltip.tsx b/src/components/ui/tooltip.tsx index 4ee26b3..cdea86b 100644 --- a/src/components/ui/tooltip.tsx +++ b/src/components/ui/tooltip.tsx @@ -1,9 +1,9 @@ -"use client" +'use client' -import * as React from "react" -import * as TooltipPrimitive from "@radix-ui/react-tooltip" +import * as TooltipPrimitive from '@radix-ui/react-tooltip' +import type * as React from 'react' -import { cn } from "@/lib/utils" +import { cn } from '@/lib/utils' function TooltipProvider({ delayDuration = 0, @@ -11,7 +11,7 @@ function TooltipProvider({ }: React.ComponentProps) { return ( @@ -23,7 +23,7 @@ function Tooltip({ }: React.ComponentProps) { return ( - + ) } @@ -31,7 +31,7 @@ function Tooltip({ function TooltipTrigger({ ...props }: React.ComponentProps) { - return + return } function TooltipContent({ @@ -43,16 +43,16 @@ function TooltipContent({ return ( {children} - + )