feat-i18n-api-messages

[mind-ar]

This PR implements i18n for api messages and Closes #2834
This first commit implements a concept of work, it needs validation from maintainers to be able to continue

[authelia]

Thanks for choosing to contribute @mind-ar. We lint all PR's with golangci-lint and eslint, I may add a review to your PR with some suggestions.

You are free to apply the changes if you're comfortable, alternatively you are welcome to ask a team member for advice.

Artifacts

These changes once approved by a team member will be published for testing on Buildkite, DockerHub and GitHub Container Registry.

Docker Container

• docker pull authelia/authelia:PR3156
• docker pull ghcr.io/authelia/authelia:PR3156

[james-d-elliott]

Just upon initial inspection, the backend namespace is unused. You need to load it when calling the useTranslation hook where appropriate (i.e. when the messages from the backend are used). The syntax is like useTranslation(["backend"]) or useTranslation(["portal", "backend"]) depending on if you're using one or both.

[mind-ar]

Hi @james-d-elliott sorry for not clarifying.
This PR is mostly for adding missing translations.

regarding your question: the namespaces are loaded in web/src/i18n/index.ts.
To use the 'backend' namespace for specific translation, you must use translate("some text", {ns: "backend"})
Unfortunately there is no case currently in use to test this, as we are masking the backend response with a different text, for example:

        try {
            const res = await postFirstFactor(username, password, rememberMe, redirectionURL, requestMethod);
            props.onAuthenticationSuccess(res ? res.redirect : undefined);
        } catch (err) {
            console.error(err);
            createErrorNotification(translate("Incorrect username or password"));
            props.onAuthenticationFailure();
            setPassword("");
            passwordRef.current.focus();
        }

To use the backend namespace we would to use somethink like this

        try {
            const res = await postFirstFactor(username, password, rememberMe, redirectionURL, requestMethod);
            props.onAuthenticationSuccess(res ? res.redirect : undefined);
        } catch (err) {
            console.error(err);
            createErrorNotification(translate(err.message, {ns: "backend"}));
            props.onAuthenticationFailure();
            setPassword("");
            passwordRef.current.focus();
        }

So, this PR only gives the "readyness" for backend translations, because that requires that we display the backend's message to the user (maybe not desired)

Let me know what you think

[mind-ar]

Hello, I think this PR could be discarded as it does not provide any visible improvement