Files
scrabble-game/ui/src/lib/lobbysort.ts
T
Ilia Denisov 264097bbf6
CI / changes (pull_request) Successful in 2s
CI / unit (pull_request) Has been skipped
CI / integration (pull_request) Has been skipped
CI / ui (pull_request) Successful in 54s
CI / gate (pull_request) Successful in 0s
CI / deploy (pull_request) Successful in 1m7s
fix(ui): green both lobby scores on a tie, mute a 0:0 board
The lobby tinted only the viewer's own number, and a tie counted as
"leading" — so an even score showed only the viewer's number green,
reading as if the viewer were ahead. A fresh 0:0 board did the same,
accenting the start of a game where nobody has scored.

scoreStanding is now per-seat: the viewer's seat stays green when
leading or tied and red when trailing; an opponent's seat greens only
when it ties the viewer for the lead, so an equal non-zero score paints
both numbers green. When the top score is 0 (nobody has moved) every
number is left muted, like a finished game.
2026-06-20 21:28:31 +02:00

102 lines
4.9 KiB
TypeScript

// Pure grouping + ordering of the lobby's game list. The lobby shows three
// sections — games awaiting the caller's move, games awaiting the opponent, and finished
// games — each ordered by last activity: your-turn oldest-first (the longest-neglected on
// top), the other two newest-first.
import type { GameView, Seat } from './model';
/** isMyTurn reports whether an active game's seat-to-move belongs to the caller. */
export function isMyTurn(game: GameView, myId: string): boolean {
const me = game.seats.find((s) => s.accountId === myId);
// 'open' (an auto-match game still awaiting an opponent) is in progress like 'active'.
return (game.status === 'active' || game.status === 'open') && !!me && game.toMove === me.seat;
}
/**
* scoreStanding colours a single seat's score on an in-progress game, viewed by myId. The
* viewer's own seat is 'win' (green) when it leads or ties for the lead and 'lose' (red) when it
* trails; any other seat is 'win' only when it ties the viewer for the lead, so an equal score
* paints both numbers green — otherwise an opponent's number keeps the muted default. It returns
* null (every number muted) for a game that is not active (open or finished — finished games show
* the result emoji instead), for a fresh 0:0 board where nobody has scored yet, and when myId is
* not seated against an opponent.
*/
export function scoreStanding(game: GameView, myId: string, seat: Seat): 'win' | 'lose' | null {
if (game.status !== 'active') return null;
const me = game.seats.find((s) => s.accountId === myId);
if (!me) return null;
const others = game.seats.filter((s) => s.accountId && s.accountId !== myId).map((s) => s.score);
if (!others.length) return null;
const top = Math.max(me.score, ...others);
if (top === 0) return null; // nobody has scored yet: leave the 0:0 board muted, like a finished game
const meLeads = me.score === top;
if (seat.accountId === myId) return meLeads ? 'win' : 'lose';
// Another seat greens only when it ties the leading viewer at the top — the equal-score case.
return meLeads && seat.score === top ? 'win' : null;
}
/**
* orderedSeats returns a game's seats in seat-number order (matching the over-the-board
* scoreboard), without mutating the source array.
*/
export function orderedSeats(game: GameView): GameView['seats'] {
return [...game.seats].sort((a, b) => a.seat - b.seat);
}
/** LobbyPhase is a game's lobby bucket — which of the three card sections it currently sits in. */
export type LobbyPhase = 'mine' | 'theirs' | 'finished';
/**
* gamePhase reports a game's lobby bucket for myId: 'finished' for any non-active/open status,
* else 'mine' when it is the caller's turn, else 'theirs'. It mirrors groupGames' partition and
* drives the per-card blink, which fires when a card transitions into 'mine' or 'finished'.
*/
export function gamePhase(game: GameView, myId: string): LobbyPhase {
if (game.status !== 'active' && game.status !== 'open') return 'finished';
return isMyTurn(game, myId) ? 'mine' : 'theirs';
}
/**
* shouldBlink reports whether a card's bucket change should fire the attention blink: only a
* transition into 'mine' (it became your turn) or 'finished' (the game ended) does — an
* opponent's-turn change is in-place. A first observation (prev === undefined) never blinks, so a
* cold render and games arriving from another screen stay quiet.
*/
export function shouldBlink(prev: LobbyPhase | undefined, next: LobbyPhase): boolean {
return prev !== undefined && prev !== next && (next === 'mine' || next === 'finished');
}
/** LobbyGroups holds the three ordered lobby sections. */
export interface LobbyGroups {
yourTurn: GameView[];
theirTurn: GameView[];
finished: GameView[];
}
/**
* groupGames partitions games for myId into the three lobby sections and orders each. In the two
* active sections a game with an unread notification (unread[g.id], any chat entry or nudge) sorts
* first, then by last activity: your-turn ascending (the longest-waiting first), opponent-turn
* descending (the most recent first). Finished games ignore unread and stay descending by activity.
*/
export function groupGames(
games: GameView[],
myId: string,
unread: Record<string, boolean>,
): LobbyGroups {
const yourTurn: GameView[] = [];
const theirTurn: GameView[] = [];
const finished: GameView[] = [];
for (const g of games) {
if (g.status !== 'active' && g.status !== 'open') finished.push(g);
else if (isMyTurn(g, myId)) yourTurn.push(g);
else theirTurn.push(g);
}
// Unread is the primary key in the active sections (rank 1 before rank 0), last activity the tie-break.
const rank = (g: GameView) => (unread[g.id] ? 1 : 0);
yourTurn.sort((a, b) => rank(b) - rank(a) || a.lastActivityUnix - b.lastActivityUnix);
theirTurn.sort((a, b) => rank(b) - rank(a) || b.lastActivityUnix - a.lastActivityUnix);
finished.sort((a, b) => b.lastActivityUnix - a.lastActivityUnix);
return { yourTurn, theirTurn, finished };
}