High Comments - Answer Overflow

High

•Created by High on 2/1/2025 in #🙋questions

Query with multiple entities

I may be doing something wrong, but if i don't do it on the client, it will still give me the ts error.

const GameCard = ({ game }: { game: Game }) => {
  const { data: user } = useAuth()
  const isJoinable = game.isActive && !game.isCompleted

  return (
    <Card className="overflow-hidden">
      <CardHeader className="pb-2">
        <div className="flex justify-between items-center">
          <CardTitle className="text-lg">Game {game.joinCode}</CardTitle>
          <Badge
            className={isJoinable ? "bg-orange-500" : "bg-green-500"}
            variant={isJoinable ? "default" : "destructive"}
          >
            {isJoinable ? "Waiting" : "Playing"}
          </Badge>
        </div>
        <CardDescription className="flex items-center mt-1">
          <Clock className="mr-2 h-4 w-4" />
          Created {formatTimeAgo(game.createdAt)}
        </CardDescription>
      </CardHeader>
      <CardContent className="pb-2">
        <div className="flex items-center">
          <Users className="mr-2 h-4 w-4" />

          <span>
            {game.players.length || 0}{" "}
            {game.players.length > 1 ? "players" : "player"} (
            {game.players.map((player) => player.name).join(", ")})
          </span>
        </div>
      </CardContent>
      <CardFooter>
        <JoinGame
          joinCode={game.joinCode}
          disabled={!isJoinable}
          user={user ? true : false}
        />
      </CardFooter>
    </Card>
  )
}

const GameCard = ({ game }: { game: Game }) => {
  const { data: user } = useAuth()
  const isJoinable = game.isActive && !game.isCompleted

  return (
    <Card className="overflow-hidden">
      <CardHeader className="pb-2">
        <div className="flex justify-between items-center">
          <CardTitle className="text-lg">Game {game.joinCode}</CardTitle>
          <Badge
            className={isJoinable ? "bg-orange-500" : "bg-green-500"}
            variant={isJoinable ? "default" : "destructive"}
          >
            {isJoinable ? "Waiting" : "Playing"}
          </Badge>
        </div>
        <CardDescription className="flex items-center mt-1">
          <Clock className="mr-2 h-4 w-4" />
          Created {formatTimeAgo(game.createdAt)}
        </CardDescription>
      </CardHeader>
      <CardContent className="pb-2">
        <div className="flex items-center">
          <Users className="mr-2 h-4 w-4" />

          <span>
            {game.players.length || 0}{" "}
            {game.players.length > 1 ? "players" : "player"} (
            {game.players.map((player) => player.name).join(", ")})
          </span>
        </div>
      </CardContent>
      <CardFooter>
        <JoinGame
          joinCode={game.joinCode}
          disabled={!isJoinable}
          user={user ? true : false}
        />
      </CardFooter>
    </Card>
  )
}

export const getActiveGames: GetActiveGames<
  void,
  (Game & { players: User[] })[]
> = async (_args, context) => {
  return context.entities.Game.findMany({
    where: { isActive: true },
    include: { players: true },
  })
}

export const getActiveGames: GetActiveGames<
  void,
  (Game & { players: User[] })[]
> = async (_args, context) => {
  return context.entities.Game.findMany({
    where: { isActive: true },
    include: { players: true },
  })
}

13 replies

WWasp

•Created by High on 2/1/2025 in #🙋questions

Query with multiple entities

@kapa.ai Yes that works. But i also has to type it again in the frontend before it works

const GameCard = ({ game }: { game: (Game & { players: User[] })}) =>

const GameCard = ({ game }: { game: (Game & { players: User[] })}) =>

13 replies

Gaming

Programming