Files
rf4-spotter/apps/web/src/components/ActivityEvidenceSummary.astro
T

27 lines
1.8 KiB
Plaintext

---
import DataPassport from "./DataPassport.astro";
import type { Activity } from "../lib/api";
const { items, totalPoints, periodLabel } = Astro.props as { items: Activity[]; totalPoints: number; periodLabel: string };
const sources = [...new Set(items.flatMap(item => item.sources))];
const conflicts = [...new Set(items.flatMap(item => item.source_conflicts))];
const observations = items.reduce((sum, item) => sum + item.catches, 0);
const confidence = items.length ? Math.round(items.reduce((sum, item) => sum + item.confidence_score, 0) / items.length) : null;
const observedAt = items.map(item => item.last_confirmed_at).filter(Boolean).sort().at(-1) ?? null;
const status = observations < 3 ? "insufficient" : "verified";
---
<section class="activity-evidence content-grid" aria-labelledby="activity-evidence-title">
<div>
<span class="overline">Доверие к выборке</span>
<h2 id="activity-evidence-title">Паспорт активности</h2>
<p>{totalPoints} {totalPoints === 1 ? "точка" : totalPoints < 5 ? "точки" : "точек"} за {periodLabel}. Сводка построена по подтверждённым карточкам этого списка.</p>
</div>
<DataPassport sources={sources} observedAt={observedAt} periodLabel={periodLabel} confidence={confidence} sampleSize={observations} sourceConflicts={conflicts} status={status} />
</section>
<style>
.activity-evidence { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 1.1fr); gap: 24px; align-items: start; margin-block: 26px; }
.activity-evidence h2 { margin: 6px 0 8px; }
.activity-evidence p { max-width: 470px; margin: 0; color: var(--text-muted); line-height: 1.6; }
@media (max-width: 720px) { .activity-evidence { grid-template-columns: 1fr; } }
</style>