dvorakmortonxd/freezmo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Report question: skip a broken card and tell the server

Browse source 
A generated matching card arrived on a phone with three identical
definitions (the generation guards now drop those), but there was no way
to get past a bad card from inside a session. The feed chrome (deck
study, review, mistakes and exam) now has the red "!" control: one tap
records the question, skips to the next card and shows an Undo toast.

- lib/question-reports.ts: the local list (freezmo.reports.v1, zod on
  read, capped 200) is the skip state — reported cards leave every
  session type, count as "not attempted" in the results instead of
  wrong, and Undo takes a report back. A deck where everything is
  reported stays studiable so it can be regenerated.
- POST /api/reports appends one JSON line per report to
  REPORTS_DIR/reports.jsonl (shared/freezmo/reports in production, the
  dev data dir in dev). Deliberately write-only: the question text is
  readable on the server (that is the point — prompt tuning) but never
  over HTTP, since the app has no auth. Best effort: offline reports stay
  local.
- The button: a red outlined rounded square with "!", the chrome's
  control size, in both feed headers (hidden on the results slide).
- config: REPORTS_DIR + RATE_LIMIT_REPORTS (20); the deploy creates the
  shared reports dir; the dev unit and AGENTS.md note the new server
  data location.
- Suites: phase-1 (append + validation + no GET), phase-2 (button, toast,
  server POST, local copy, skip counter, hidden next session, Undo, exam
  pool). SW -> freezmo-v38.
This commit is contained in:
Martin Dvořák 2026-10-12 07:12:55 +00:00
commit 9cea13496a
16 changed files with 496 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

44
components/ReportQuestionButton.tsx Normal file
View file

@ -0,0 +1,44 @@
"use client";
import { haptic } from "@/lib/haptics";
import { useI18n } from "@/lib/i18n";
import { reportQuestion, unreportQuestion } from "@/lib/question-reports";
import type { Activity, Deck } from "@/lib/schemas";
import { showToast } from "@/lib/toast";
/**
* The red "!" report control in the feed chrome: records the question, sends
* the operator a copy and skips past it. Undo lives in the toast.
*/
export function ReportQuestionButton({
deck,
activity,
onSkip,
}: {
deck: Deck;
activity: Activity;
onSkip: () => void;
}) {
const { t } = useI18n();
return (
<button
type="button"
onClick={() => {
haptic("tap");
reportQuestion({ deck, activity });
showToast({
message: t("feed.reported"),
actionLabel: t("toast.undo"),
onAction: () => unreportQuestion(deck.id, activity.id),
});
onSkip();
}}
aria-label={t("feed.report")}
title={t("feed.report")}
className="grid size-9 shrink-0 place-items-center rounded-xl border-2 border-rose-400/80 text-[15px] font-black leading-none text-rose-600 transition hover:bg-rose-50 dark:border-rose-400/50 dark:text-rose-300 dark:hover:bg-rose-400/10"
>
<span aria-hidden>!</span>
</button>
);
}

7
components/ReviewClient.tsx
View file

@ -4,6 +4,7 @@ import { useEffect, useMemo, useState, useSyncExternalStore } from "react";
import { useRouter } from "next/navigation";
import { SessionFeed, type SessionItem } from "@/components/SessionFeed";
import { isReported } from "@/lib/question-reports";
import { RouteLoading } from "@/components/RouteLoading";
import { Button } from "@/components/ui";
import { haptic } from "@/lib/haptics";
@ -38,7 +39,11 @@ export function ReviewClient({ mistakes, deckId }: { mistakes: boolean; deckId?:
}, []);
const items = useMemo(
() => (mistakes ? mistakeItems(answers, deckId) : dueItems(srs)),
// Reported questions are out of rotation (see lib/question-reports).
() =>
(mistakes ? mistakeItems(answers, deckId) : dueItems(srs)).filter(
(item) => !isReported(item.deck.id, item.activity.id),
),
[mistakes, deckId, answers, srs],
);

19
components/SessionFeed.tsx
View file

@ -4,6 +4,7 @@ import { useCallback, useEffect, useRef, useState } from "react";
import { ActivityRenderer } from "@/components/activities";
import { XIcon } from "@/components/icons";
import { ReportQuestionButton } from "@/components/ReportQuestionButton";
import { ProgressBar } from "@/components/ui";
import type { Activity, Deck } from "@/lib/schemas";
import { useI18n } from "@/lib/i18n";
@ -48,6 +49,8 @@ export function SessionFeed({
useWakeLock(true);
const [index, setIndex] = useState(0);
const [results, setResults] = useState<Record<string, SessionResult>>({});
/** Ids reported during this run: skipped, so they are not "missed". */
const [skipped, setSkipped] = useState<string[]>([]);
const [runId] = useState(0);
const [remaining, setRemaining] = useState(timerSeconds ?? 0);
const scrollRef = useRef<HTMLDivElement>(null);
@ -135,7 +138,9 @@ export function SessionFeed({
const finished = index >= total;
const correct = items.filter((item) => results[item.activity.id]?.correct).length;
const score = total > 0 ? Math.round((correct / total) * 100) : 0;
/** What the results slide counts: reported cards were never attempted. */
const attemptedTotal = Math.max(0, total - skipped.length);
const score = attemptedTotal > 0 ? Math.round((correct / attemptedTotal) * 100) : 0;
return (
<div className="frost-bg fixed inset-0 flex flex-col fade-in-mobile">
@ -168,6 +173,16 @@ export function SessionFeed({
{formatClock(remaining)}
</span>
) : null}
{!finished && items[index] ? (
<ReportQuestionButton
deck={items[index].deck}
activity={items[index].activity}
onSkip={() => {
setSkipped((current) => [...current, items[index].activity.id]);
goTo(index + 1);
}}
/>
) : null}
</div>
<div className="flex items-center justify-between gap-2 text-[11px] font-semibold text-[var(--text-muted)]">
<span className="min-w-0 truncate">{title}</span>
@ -211,7 +226,7 @@ export function SessionFeed({
>
<div className="mx-auto flex min-h-full w-full max-w-xl flex-col gap-4 px-4 pb-24 pt-24 [justify-content:safe_center]">
{finished
? renderResults({ results, items, correct, total, score })
? renderResults({ results, items, correct, total: attemptedTotal, score })
: (
<div className="card space-y-2 p-5 text-center">
<p className="text-sm font-semibold text-[var(--text-muted)]">{t("review.results")}</p>

35
components/StudyFeed.tsx
View file

@ -11,11 +11,13 @@ import { materialiseActivities } from "@/lib/deck-ops";
import { haptic } from "@/lib/haptics";
import { recordAnswer } from "@/lib/history";
import { useI18n } from "@/lib/i18n";
import { withoutReported } from "@/lib/question-reports";
import type { Activity, Deck } from "@/lib/schemas";
import { recordAttempt, upsertDeck } from "@/lib/storage";
import { useWakeLock } from "@/lib/use-wake-lock";
import { cn } from "@/lib/utils";
import { BoltIcon, FlameIcon, XIcon } from "@/components/icons";
import { ReportQuestionButton } from "@/components/ReportQuestionButton";
import { Button, ProgressBar } from "@/components/ui";
import { ResultsScreen } from "./ResultsScreen";
@ -27,7 +29,11 @@ export function StudyFeed({ deck }: { deck: Deck }) {
/* Keep the screen awake for the whole study session (feature-detected). */
useWakeLock(true);
const [currentDeck, setCurrentDeck] = useState(deck);
const [queue, setQueue] = useState<Activity[]>(deck.activities);
// Reported questions never enter a session; a fully reported deck stays
// studiable (withoutReported falls back to the full list).
const [queue, setQueue] = useState<Activity[]>(() => withoutReported(deck.id, deck.activities));
/** Ids reported during this run: skipped, so they are not "missed". */
const [skipped, setSkipped] = useState<string[]>([]);
const [index, setIndex] = useState(0);
const [results, setResults] = useState<Record<string, AttemptResult>>({});
const [xp, setXp] = useState(0);
@ -107,7 +113,8 @@ export function StudyFeed({ deck }: { deck: Deck }) {
recordedRef.current = true;
const answered = Object.values(results);
const correct = answered.filter((entry) => entry.correct).length;
const score = total > 0 ? (correct / total) * 100 : 0;
const attempted = Math.max(0, total - skipped.length);
const score = attempted > 0 ? (correct / attempted) * 100 : 0;
// Only a run with at least one answer counts. Without this, the scroll
// anchoring shift when a regenerated deck swaps in could fire a bogus
// 0% attempt before the feed had snapped back to the first slide.
@ -117,7 +124,7 @@ export function StudyFeed({ deck }: { deck: Deck }) {
void celebrate("big");
}
}
}, [finished, results, total, currentDeck.id, retryMode]);
}, [finished, results, total, skipped.length, currentDeck.id, retryMode]);
const handleAnswered = useCallback(
(activity: Activity, correct: boolean, meta?: { userAnswer?: string }) => {
@ -150,10 +157,13 @@ export function StudyFeed({ deck }: { deck: Deck }) {
);
const missed = useMemo(
() => queue.filter((activity) => !results[activity.id]?.correct),
[queue, results],
() => queue.filter((activity) => !skipped.includes(activity.id) && !results[activity.id]?.correct),
[queue, results, skipped],
);
/** What the results screen counts: reported cards were never attempted. */
const attemptedTotal = Math.max(0, total - skipped.length);
const correctCount = useMemo(
() => queue.filter((activity) => results[activity.id]?.correct).length,
[queue, results],
@ -163,6 +173,7 @@ export function StudyFeed({ deck }: { deck: Deck }) {
(activities: Activity[], retry: boolean) => {
setQueue(activities);
setResults({});
setSkipped([]);
setStreak(0);
setRetryMode(retry);
recordedRef.current = retry; // don't overwrite the best score with a retry run
@ -267,6 +278,16 @@ export function StudyFeed({ deck }: { deck: Deck }) {
<BoltIcon className="size-3.5" />
{xp}
</span>
{!finished && queue[index] ? (
<ReportQuestionButton
deck={currentDeck}
activity={queue[index]}
onSkip={() => {
setSkipped((current) => [...current, queue[index].id]);
goTo(index + 1);
}}
/>
) : null}
</div>
</div>
<div className="flex items-center justify-between gap-2 text-[11px] font-semibold text-[var(--text-muted)]">
@ -318,13 +339,13 @@ export function StudyFeed({ deck }: { deck: Deck }) {
deck={currentDeck}
xp={xp}
bestStreak={bestStreak}
total={total}
total={attemptedTotal}
correct={correctCount}
missed={missed}
results={results}
retryMode={retryMode}
onRetryMissed={() => restart(missed, true)}
onRestart={() => restart(currentDeck.activities, false)}
onRestart={() => restart(withoutReported(currentDeck.id, currentDeck.activities), false)}
onRegenerate={regenerate}
regenerating={regenerating}
regenerateError={regenerateError}

5
components/exam/ExamScreen.tsx
View file

@ -4,6 +4,7 @@ import { useMemo, useState, useSyncExternalStore } from "react";
import { useRouter } from "next/navigation";
import { SessionFeed, type SessionItem } from "@/components/SessionFeed";
import { isReported } from "@/lib/question-reports";
import { Button } from "@/components/ui";
import { haptic } from "@/lib/haptics";
import { recordAnswer } from "@/lib/history";
@ -33,7 +34,9 @@ export function ExamScreen() {
() =>
decks
.filter((deck) => selected.has(deck.id))
.flatMap((deck) => deck.activities.map((activity) => ({ deck, activity }))),
.flatMap((deck) => deck.activities.map((activity) => ({ deck, activity })))
// Reported questions are out of rotation (see lib/question-reports).
.filter(({ deck, activity }) => !isReported(deck.id, activity.id)),
[decks, selected],
);
const effectiveCount = Math.min(count, pool.length);