...
 
Commits (2)
......@@ -25,9 +25,8 @@ import * as React from 'react'
import { FunctionComponent } from 'react'
import { RouteComponentProps } from 'react-router'
import { Game } from '@gecogvidanto/shared'
import { Game, User } from '@gecogvidanto/shared'
import { useUsers } from '../../hooks'
import { useToolsStore } from '../../stores'
import { routes } from '../../tools/constants'
import Gravatar from '../../tools/Gravatar'
......@@ -89,6 +88,7 @@ const useStyles = makeStyles((theme: Theme) => ({
export interface GameRowProps {
history: RouteComponentProps['history']
game: Game
getUser: (id: string) => User | undefined
}
/**
......@@ -96,12 +96,11 @@ export interface GameRowProps {
*/
// tslint:disable-next-line:variable-name (JSX)
const GameRow: FunctionComponent<GameRowProps> = observer(
({ history, game }) => {
({ history, game, getUser }) => {
const classes = useStyles()
const toolsStore = useToolsStore()
const { lang } = toolsStore
const setCount: number = game.roundSets.length
const getUser = useUsers()
const user = getUser(game.masterId)
const gravatar: Gravatar | undefined = user && new Gravatar(user.email)
const playerCount: number = game.players.filter(
......
......@@ -29,7 +29,7 @@ import * as React from 'react'
import { FunctionComponent } from 'react'
import { RouteComponentProps } from 'react-router'
import { Game } from '@gecogvidanto/shared'
import { Game, User } from '@gecogvidanto/shared'
import { useToolsStore } from '../../stores'
......@@ -38,37 +38,40 @@ import GameRow from './GameRow'
export interface GamesProps {
history: RouteComponentProps['history']
games: Game[]
getUser: (id: string) => User | undefined
}
/**
* Home page.
*/
// tslint:disable-next-line:variable-name (JSX)
const Games: FunctionComponent<GamesProps> = observer(({ history, games }) => {
const toolsStore = useToolsStore()
const { lang } = toolsStore
const Games: FunctionComponent<GamesProps> = observer(
({ history, games, getUser }) => {
const toolsStore = useToolsStore()
const { lang } = toolsStore
const gameRows: JSX.Element[] = games.map(game => (
<GameRow key={game._id} history={history} game={game} />
))
if (games.length) {
return (
<Table>
<TableHead>
<TableRow>
<TableCell />
<TableCell>{lang.pageIndexDate()}</TableCell>
<TableCell>{lang.pageIndexLocation()}</TableCell>
<TableCell>{lang.pageIndexSets()}</TableCell>
<TableCell>{lang.pageIndexPlayers()}</TableCell>
</TableRow>
</TableHead>
<TableBody>{...gameRows}</TableBody>
</Table>
)
} else {
return <Typography>{lang.pageIndexNoGame()}</Typography>
const gameRows: JSX.Element[] = games.map(game => (
<GameRow key={game._id} history={history} game={game} getUser={getUser} />
))
if (games.length) {
return (
<Table>
<TableHead>
<TableRow>
<TableCell />
<TableCell>{lang.pageIndexDate()}</TableCell>
<TableCell>{lang.pageIndexLocation()}</TableCell>
<TableCell>{lang.pageIndexSets()}</TableCell>
<TableCell>{lang.pageIndexPlayers()}</TableCell>
</TableRow>
</TableHead>
<TableBody>{...gameRows}</TableBody>
</Table>
)
} else {
return <Typography>{lang.pageIndexNoGame()}</Typography>
}
}
})
)
export default Games
......@@ -34,6 +34,7 @@ import { Game } from '@gecogvidanto/shared'
import { Waiting } from '../../components'
import ServerContext from '../../context/ServerContext'
import { useUsers } from '../../hooks'
import { useToolsStore } from '../../stores'
import { api } from '../../tools/constants'
import Fetcher from '../../tools/Fetcher'
......@@ -64,6 +65,7 @@ const Home: FunctionComponent<HomeProps> = observer(
const toolsStore = useToolsStore()
const { lang } = toolsStore
const fetcher = useRef<Fetcher<'games'>>(new Fetcher())
const getUser = useUsers()
// State
const preLoadedGames = useMemo<Game[] | undefined>(() => {
......@@ -109,7 +111,7 @@ const Home: FunctionComponent<HomeProps> = observer(
{lang.pageIndex()}
</Typography>
<Waiting active={loading}>
<Games history={history} games={games} />
<Games history={history} games={games} getUser={getUser} />
</Waiting>
<Fab
color="primary"
......
......@@ -58,15 +58,10 @@ const FinishedRoundSet: FunctionComponent<FinishedRoundSetProps> = observer(
const toolsStore = useToolsStore()
const getCharacterName = useCharacterNames()
const hasNpc: boolean =
game.characters.filter(character => character.player < 0).length > 0
const characters: Character[] = game.characters
.filter(character => character.roundSet === roundSet.index)
.sort((a, b) =>
a.player < 0 === b.player < 0
? Math.abs(a.player) - Math.abs(b.player)
: b.player - a.player
)
.filter(character => includeNpc || character.player >= 0)
game.characters.filter(
character =>
character.roundSet === roundSet.index && character.player < 0
).length > 0
const chartLabels = {
mean: toolsStore.lang.pageGameChartMean(),
deviation: toolsStore.lang.pageGameChartRelDeviation(),
......@@ -112,6 +107,14 @@ const FinishedRoundSet: FunctionComponent<FinishedRoundSetProps> = observer(
}
// Render
const characters: Character[] = game.characters
.filter(character => character.roundSet === roundSet.index)
.sort((a, b) =>
a.player < 0 === b.player < 0
? Math.abs(a.player) - Math.abs(b.player)
: b.player - a.player
)
.filter(character => includeNpc || character.player >= 0)
const stats = calculateStats(
characters.map(character => character.totalScore)
)
......
......@@ -61,7 +61,7 @@ const Header: FunctionComponent<HeaderProps> = observer(({ game }) => {
const { lang } = useToolsStore()
const getUser = useUsers()
const gameMaster = getUser(game.masterId)
const name: string = gameMaster ? gameMaster.name : game.masterId
const name: string = gameMaster ? gameMaster.name : ''
const gravatar: Gravatar | undefined = gameMaster
? new Gravatar(gameMaster.email)
: undefined
......