website: Use existing translations of language names (#1349)

Removed language.json translation file as we don't really need it anymore, just moved the couple of remaining items into tasks.json

I also reverted the change where I created lang_mismatch_lang and lang_mismatch_lang.explanation because we don't actually need two different strings and it was causing an issue where it would show a mix of english and the users language rather than just show the existing "Wrong language" text that is probably a better intermediate until the translations are updated. Let me know if there is a better way to handle updating the source english text for translations.
This commit is contained in:
Adrian Cowan
2023-02-08 19:43:50 +09:00
committed by GitHub
parent e6b574e177
commit db76b0b1fa
6 changed files with 16 additions and 38 deletions
@@ -1,5 +1,6 @@
import { Button, Flex, Tooltip } from "@chakra-ui/react";
import { useTranslation } from "next-i18next";
import { useCookies } from "react-cookie";
import { getTypeSafei18nKey } from "src/lib/i18n";
interface LabelFlagGroupProps {
@@ -17,14 +18,16 @@ export const LabelFlagGroup = ({
isEditable = true,
onChange,
}: LabelFlagGroupProps) => {
const { t } = useTranslation(["labelling", "language"]);
const expectedLanguageName = t(getTypeSafei18nKey(`language:lang_${expectedLanguage}`));
const { t } = useTranslation("labelling");
const [cookies] = useCookies(["NEXT_LOCALE"]);
const currentLanguage = cookies["NEXT_LOCALE"];
const expectedLanguageName = new Intl.DisplayNames(currentLanguage, { type: "language" }).of(expectedLanguage);
return (
<Flex wrap="wrap" gap="4">
{labelNames.map((name, idx) => (
<Tooltip
key={name}
label={`${t(getTypeSafei18nKey(`${name}_lang.explanation`), t(getTypeSafei18nKey(`${name}.explanation`)), {
label={`${t(getTypeSafei18nKey(`${name}.explanation`), `${name}.explanation`, {
language: expectedLanguageName,
})}`}
>
@@ -37,7 +40,7 @@ export const LabelFlagGroup = ({
isDisabled={!isEditable}
colorScheme={values[idx] === 1 ? "blue" : undefined}
>
{t(getTypeSafei18nKey(`${name}_lang`), t(getTypeSafei18nKey(name)), { language: expectedLanguageName })}
{t(getTypeSafei18nKey(`${name}`), name, { language: expectedLanguageName })}
</Button>
</Tooltip>
))}
@@ -4,7 +4,6 @@ import lande from "lande";
import { useTranslation } from "next-i18next";
import React from "react";
import { useCookies } from "react-cookie";
import { getTypeSafei18nKey } from "src/lib/i18n";
import { LanguageAbbreviations } from "src/lib/iso6393";
import { colors } from "src/styles/Theme/colors";
@@ -20,12 +19,12 @@ interface TrackedTextboxProps {
}
export const TrackedTextarea = (props: TrackedTextboxProps) => {
const { t } = useTranslation("language");
const { t } = useTranslation("tasks");
const wordLimitForLangDetection = 4;
const backgroundColor = useColorModeValue("gray.100", "gray.900");
const [cookies] = useCookies(["NEXT_LOCALE"]);
const wordCount = (props.text.match(/\w+/g) || []).length;
const currentLanguage = cookies["NEXT_LOCALE"];
const wordCount = (props.text.match(/\w+/g) || []).length;
const detectLang = (text: string) => {
try {
@@ -81,8 +80,8 @@ export const TrackedTextarea = (props: TrackedTextboxProps) => {
>
<Tooltip
label={t(wrongLanguage ? "writing_wrong_langauge_a_b" : "submitted_as", {
submit_lang: t(getTypeSafei18nKey(`lang_${currentLanguage}`), currentLanguage),
detected_lang: t(getTypeSafei18nKey(`lang_${detectedLang}`), detectedLang),
submit_lang: new Intl.DisplayNames(currentLanguage, { type: "language" }).of(currentLanguage),
detected_lang: new Intl.DisplayNames(currentLanguage, { type: "language" }).of(detectedLang),
})}
>
{detectedLang}