Ilia Denisov
d733ce3119
Wire the deferred Stage 7 surfaces end-to-end (UI -> gateway transcode -> backend REST -> existing domain services): friends (incl. one-time friend codes), per-user blocks, friend-game invitations, profile editing + email binding, the statistics screen, and the in-game history + GCG export. Friends gain two add paths (interview decision, a deliberate plan change): one-time 6-digit codes (friend_codes table, 12h TTL, single-use, rate-limited redeem); and play-gated requests (shared game required) where an explicit decline is permanent, an ignored request lapses after 30 days, and a code bypasses a decline. Migration 00006 widens friendships_status_chk and adds friend_codes. Lobby notification badge is poll + push: a new generic `notify` event drives it live; the client polls on open/focus. Language stays a single Settings control that writes through to the durable account's preferred_language. GCG export is finished-only (game.ErrGameActive) and shares/downloads the .gcg file. Tests: backend unit + inttest (friend gate/decline/code, ListInvitations, GetStats, GCG gate), gateway transcode round-trips + notify constructor, UI vitest (codecs, win-rate, share choice) + Playwright social specs. Docs: PLAN (Stage 8 done + refinements + TODO-5), ARCHITECTURE, FUNCTIONAL(+ru), UI_DESIGN, TESTING, module READMEs.
83 lines
2.0 KiB
Svelte
83 lines
2.0 KiB
Svelte
<script lang="ts">
|
|
import { onMount } from 'svelte';
|
|
import Screen from '../components/Screen.svelte';
|
|
import { app, handleError } from '../lib/app.svelte';
|
|
import { gateway } from '../lib/gateway';
|
|
import { t, type MessageKey } from '../lib/i18n/index.svelte';
|
|
import { gamesPlayed, winRate } from '../lib/stats';
|
|
import type { Stats } from '../lib/model';
|
|
|
|
let stats = $state<Stats | null>(null);
|
|
|
|
onMount(async () => {
|
|
if (app.profile?.isGuest) return;
|
|
try {
|
|
stats = await gateway.statsGet();
|
|
} catch (e) {
|
|
handleError(e);
|
|
}
|
|
});
|
|
|
|
const cards = $derived<{ key: MessageKey; value: string | number }[]>(
|
|
stats
|
|
? [
|
|
{ key: 'stats.wins', value: stats.wins },
|
|
{ key: 'stats.losses', value: stats.losses },
|
|
{ key: 'stats.draws', value: stats.draws },
|
|
{ key: 'stats.played', value: gamesPlayed(stats) },
|
|
{ key: 'stats.winRate', value: `${winRate(stats)}%` },
|
|
{ key: 'stats.maxGame', value: stats.maxGamePoints },
|
|
{ key: 'stats.maxWord', value: stats.maxWordPoints },
|
|
]
|
|
: [],
|
|
);
|
|
</script>
|
|
|
|
<Screen title={t('stats.title')} back="/">
|
|
<div class="page">
|
|
{#if app.profile?.isGuest}
|
|
<p class="muted">{t('stats.guestHint')}</p>
|
|
{:else if stats}
|
|
<div class="grid">
|
|
{#each cards as c (c.key)}
|
|
<div class="card">
|
|
<span class="num">{c.value}</span>
|
|
<span class="lbl">{t(c.key)}</span>
|
|
</div>
|
|
{/each}
|
|
</div>
|
|
{/if}
|
|
</div>
|
|
</Screen>
|
|
|
|
<style>
|
|
.page {
|
|
padding: var(--pad);
|
|
}
|
|
.muted {
|
|
color: var(--text-muted);
|
|
}
|
|
.grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, 1fr);
|
|
gap: 12px;
|
|
}
|
|
.card {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 4px;
|
|
padding: 18px 16px;
|
|
border: 1px solid var(--border);
|
|
background: var(--surface);
|
|
border-radius: var(--radius);
|
|
}
|
|
.num {
|
|
font-size: 1.7rem;
|
|
font-weight: 700;
|
|
}
|
|
.lbl {
|
|
color: var(--text-muted);
|
|
font-size: 0.85rem;
|
|
}
|
|
</style>
|