From dee989ad8a42f129bbcdee30676ecf70dd3e8b4b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marcin=20Ja=C5=82ocha?= Date: Thu, 26 Dec 2024 17:44:00 +0100 Subject: [PATCH] Enhance who is online page --- src/pages/community/who-is-online/index.tsx | 51 ++++++++++++--------- src/server/routers/player.ts | 2 +- 2 files changed, 31 insertions(+), 22 deletions(-) diff --git a/src/pages/community/who-is-online/index.tsx b/src/pages/community/who-is-online/index.tsx index c861067..2a2df34 100644 --- a/src/pages/community/who-is-online/index.tsx +++ b/src/pages/community/who-is-online/index.tsx @@ -1,38 +1,47 @@ -import StrippedTable from "@component/StrippedTable"; import Head from "@layout/Head"; import Label from "@component/Label"; import { trpc } from "@util/trpc"; -import { VStack } from "@chakra-ui/react"; +import { Table, TableContainer, Thead, Tr, Th, Tbody, Td } from "@chakra-ui/react"; import { getVocationNameById } from "@shared/enums/Vocation"; import { Content } from "@component/Content"; export default function WhoIsOnline() { const players = trpc.player.online.useQuery(); const status = trpc.status.status.useQuery(); + const onlinePlayers = players.data; return ( <> - Server Info - - - - Overall Maximum: {status.data?.maxOnlineCount ?? 0} players. There are currently {players.data?.length ?? 0} players online on - {status.data?.name ?? "..."} - - {players.data && ( - [ - { href: `/character/${player.name}`, text: player.name }, - { text: player.level }, - { text: getVocationNameById(player.vocation) }, - ])} - /> - )} - + Who Is Online + + + Overall Maximum: {status.data?.maxOnlineCount ?? 0} players. There are currently {onlinePlayers?.length ?? 0} players online on{" "} + {status.data?.name ? status.data.name : "unknown"} + + {onlinePlayers && ( + + + + + Name + Level + Vocation + + + + {onlinePlayers?.map((player) => ( + + {player.name} + {player.level} + {getVocationNameById(player.vocation)} + + ))} + + + + )} > diff --git a/src/server/routers/player.ts b/src/server/routers/player.ts index e538a74..72b3c0e 100644 --- a/src/server/routers/player.ts +++ b/src/server/routers/player.ts @@ -44,7 +44,7 @@ export const playerRouter = router({ }), online: procedure.query(async () => { const players = await prisma.players_online.findMany({ - select: { players: true }, + include: { players: { select: { name: true, vocation: true, level: true } } }, }); return players.map((player) => player.players);