diff --git a/src/l10n-shortcuts.ts b/src/l10n-shortcuts.ts new file mode 100644 index 0000000000..e28d9ba5e0 --- /dev/null +++ b/src/l10n-shortcuts.ts @@ -0,0 +1,32 @@ +import { getLang } from "./localeStorageManager"; + +type Shortcuts = { + yes: string; + no: string; + skip: string; +}; + +type ShortcutLocalization = { + en: Shortcuts; + [locale: string]: Partial; +}; + +const SHORTCUT_LOCALISATION = { + en: { + yes: "y", + no: "n", + skip: "k", + }, + fr: { + yes: "o", + no: "n", + skip: "k", + }, +}; + +export const getShortcuts = (lang?: string): ShortcutLocalization => { + return { + ...SHORTCUT_LOCALISATION.en, + ...SHORTCUT_LOCALISATION[lang ?? getLang()], + }; +}; diff --git a/src/pages/questions/QuestionDisplay.jsx b/src/pages/questions/QuestionDisplay.jsx index 794bbdfe60..94198032ff 100644 --- a/src/pages/questions/QuestionDisplay.jsx +++ b/src/pages/questions/QuestionDisplay.jsx @@ -24,6 +24,7 @@ import { } from "../../const"; import { reformatValueTag } from "../../utils"; import robotoff from "../../robotoff"; +import { getShortcuts } from "../../l10n-shortcuts"; import { getQuestionSearchParams } from "../../components/QuestionFilter/useFilterSearch"; import CroppedLogo from "../../components/CroppedLogo"; import ZoomableImage from "../../components/ZoomableImage"; @@ -91,6 +92,7 @@ const QuestionDisplay = ({ const [nbOfPotentialQuestion, setNbOfPotentialQuestions] = React.useState(null); + const shortcuts = getShortcuts(); const theme = useTheme(); const isDesktop = useMediaQuery(theme.breakpoints.up("md")); @@ -127,20 +129,20 @@ const QuestionDisplay = ({ function handleShortCut(event) { const preventShortCut = event.target.tagName.toUpperCase() === "INPUT"; if (question?.insight_id && !preventShortCut) { - switch (event.keyCode) { - case 75: // K + switch (event.key) { + case shortcuts.skip: answerQuestion({ value: SKIPPED_INSIGHT, insightId: question.insight_id, }); break; - case 79: // O + case shortcuts.yes: answerQuestion({ value: CORRECT_INSIGHT, insightId: question.insight_id, }); break; - case 78: // N + case shortcuts.no: answerQuestion({ value: WRONG_INSIGHT, insightId: question.insight_id, @@ -292,7 +294,7 @@ const QuestionDisplay = ({ sx={{ display: "flex", flexDirection: "column", flexGrow: 1 }} > - {t("questions.no")} (n) + {t("questions.no")} ({shortcuts.no}) );