The red "!" left the top chrome (it read as chrome and was easy to mis-tap) and now sits in a row under the exercise: the AI disclaimer stays centred, the report control is right-aligned with the card edge and is a 44px target. Applies to study, Smart Review and exam sessions; the results slides keep just the disclaimer. phase-2 suite now asserts the placement (below the card, right-aligned, not in the header, >=44px) — 60 checks. README: decision 52 updated. SW -> freezmo-v43.
45 lines
1.3 KiB
TypeScript
45 lines
1.3 KiB
TypeScript
"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 that sits under the card (bottom-right of the
|
|
* exercise): records the question, sends the operator a copy and skips past
|
|
* it. Undo lives in the toast. 44px, because it is a thumb target.
|
|
*/
|
|
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-11 shrink-0 place-items-center rounded-xl border-2 border-rose-400/80 text-base 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>
|
|
);
|
|
}
|