l10n of login info messages
This commit is contained in:
parent
1ec6af4833
commit
b7ff2bbd85
6
TODO
6
TODO
|
@ -16,9 +16,15 @@
|
|||
|
||||
|
||||
## Global UI
|
||||
* Filter does not work on github.io
|
||||
* What happens when JS is off?
|
||||
=> https://www.allantatter.com/react-js-and-progressive-enhancement/
|
||||
|
||||
|
||||
## Miscellaneous
|
||||
* Webpack chunks?
|
||||
|
||||
|
||||
* Stocker pagination dans le store
|
||||
* error / info: null
|
||||
* refondre reducers
|
||||
|
|
|
@ -58,9 +58,16 @@ class LoginFormCSSIntl extends Component {
|
|||
|
||||
render () {
|
||||
const {formatMessage} = this.props.intl;
|
||||
var infoMessage = "";
|
||||
if (typeof this.props.info === "object") {
|
||||
infoMessage = (
|
||||
<FormattedMessage {...loginMessages[this.props.info.id]} values={ this.props.info.values} />
|
||||
);
|
||||
} else {
|
||||
infoMessage = this.props.info;
|
||||
}
|
||||
return (
|
||||
<div>
|
||||
{ /* TODO: info/error translation */ }
|
||||
{
|
||||
this.props.error ?
|
||||
<div className="row">
|
||||
|
@ -76,7 +83,7 @@ class LoginFormCSSIntl extends Component {
|
|||
this.props.info ?
|
||||
<div className="row">
|
||||
<div className="alert alert-info" id="loginFormInfo">
|
||||
<p>{ this.props.info }</p>
|
||||
<p>{ infoMessage }</p>
|
||||
</div>
|
||||
</div>
|
||||
: null
|
||||
|
@ -129,7 +136,7 @@ LoginFormCSSIntl.propTypes = {
|
|||
onSubmit: PropTypes.func.isRequired,
|
||||
isAuthenticating: PropTypes.bool,
|
||||
error: PropTypes.string,
|
||||
info: PropTypes.string,
|
||||
info: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
|
||||
intl: intlShape.isRequired,
|
||||
};
|
||||
|
||||
|
@ -163,7 +170,7 @@ Login.propTypes = {
|
|||
onSubmit: PropTypes.func.isRequired,
|
||||
isAuthenticating: PropTypes.bool,
|
||||
error: PropTypes.string,
|
||||
info: PropTypes.string
|
||||
info: PropTypes.oneOfType([PropTypes.string, PropTypes.object])
|
||||
};
|
||||
|
||||
export default CSSModules(Login, css);
|
||||
|
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -7,11 +7,14 @@ module.exports = {
|
|||
"app.common.song": "{itemCount, plural, one {Song} other {Songs}}", // Song
|
||||
"app.filter.filter": "Filter…", // Filtering input placeholder
|
||||
"app.filter.whatAreWeListeningToToday": "What are we listening to today?", // Description for the filter bar
|
||||
"app.login.byebye": "See you soon!", // Info message on successful logout
|
||||
"app.login.connecting": "Connecting…", // Info message while trying to connect
|
||||
"app.login.endpointInputAriaLabel": "URL of your Ampache instance (e.g. http://ampache.example.com)", // ARIA label for the endpoint input
|
||||
"app.login.greeting": "Welcome back on Ampache, let's go!", // Greeting to welcome the user to the app
|
||||
"app.login.password": "Password", // Password input placeholder
|
||||
"app.login.rememberMe": "Remember me", // Remember me checkbox label
|
||||
"app.login.signIn": "Sign in", // Sign in
|
||||
"app.login.success": "Successfully logged in as { username }!", // Info message on successful login.
|
||||
"app.login.username": "Username", // Username input placeholder
|
||||
"app.pagination.current": "current", // Current (page)
|
||||
"app.pagination.goToPage": "<span class=\"sr-only\">Go to page </span>{pageNumber}", // Link content to go to page N. span is here for screen-readers
|
||||
|
|
|
@ -7,11 +7,14 @@ module.exports = {
|
|||
"app.common.song": "{itemCount, plural, one {Piste} other {Pistes}}", // Song
|
||||
"app.filter.filter": "Filtrer…", // Filtering input placeholder
|
||||
"app.filter.whatAreWeListeningToToday": "Que voulez-vous écouter aujourd'hui\u00a0?", // Description for the filter bar
|
||||
"app.login.byebye": "À bientôt\u00a0!", // Info message on successful logout
|
||||
"app.login.connecting": "Connexion…", // Info message while trying to connect
|
||||
"app.login.endpointInputAriaLabel": "URL de votre Ampache (e.g. http://ampache.example.com)", // ARIA label for the endpoint input
|
||||
"app.login.greeting": "Bon retour sur Ampache, c'est parti\u00a0!", // Greeting to welcome the user to the app
|
||||
"app.login.password": "Mot de passe", // Password input placeholder
|
||||
"app.login.rememberMe": "Se souvenir", // Remember me checkbox label
|
||||
"app.login.signIn": "Connexion", // Sign in
|
||||
"app.login.success": "Connecté en tant que { username }\u00a0!", // Info message on successful login.
|
||||
"app.login.username": "Utilisateur", // Username input placeholder
|
||||
"app.pagination.current": "actuelle", // Current (page)
|
||||
"app.pagination.goToPage": "<span class=\"sr-only\">Aller à la page </span>{pageNumber}", // Link content to go to page N. span is here for screen-readers
|
||||
|
|
|
@ -28,6 +28,23 @@ const messages = [
|
|||
id: "app.login.greeting",
|
||||
description: "Greeting to welcome the user to the app",
|
||||
defaultMessage: "Welcome back on Ampache, let's go!"
|
||||
},
|
||||
|
||||
// From the auth reducer
|
||||
{
|
||||
id: "app.login.connecting",
|
||||
defaultMessage: "Connecting…",
|
||||
description: "Info message while trying to connect"
|
||||
},
|
||||
{
|
||||
id: "app.login.success",
|
||||
defaultMessage: "Successfully logged in as { username }!",
|
||||
description: "Info message on successful login."
|
||||
},
|
||||
{
|
||||
id: "app.login.byebye",
|
||||
defaultMessage: "See you soon!",
|
||||
description: "Info message on successful logout"
|
||||
}
|
||||
];
|
||||
|
||||
|
|
|
@ -27,7 +27,10 @@ export default createReducer(initialState, {
|
|||
[LOGIN_USER_REQUEST]: (state) => {
|
||||
return Object.assign({}, state, {
|
||||
isAuthenticating: true,
|
||||
info: "Connecting…",
|
||||
info: {
|
||||
id: "app.login.connecting",
|
||||
values: {}
|
||||
},
|
||||
error: "",
|
||||
timerID: null
|
||||
});
|
||||
|
@ -40,7 +43,10 @@ export default createReducer(initialState, {
|
|||
username: payload.username,
|
||||
endpoint: payload.endpoint,
|
||||
rememberMe: payload.rememberMe,
|
||||
info: "Successfully logged in as " + payload.username + "!",
|
||||
info: {
|
||||
id: "app.login.success",
|
||||
values: { username: payload.username}
|
||||
},
|
||||
error: "",
|
||||
timerID: payload.timerID
|
||||
});
|
||||
|
@ -66,7 +72,10 @@ export default createReducer(initialState, {
|
|||
username: "",
|
||||
endpoint: "",
|
||||
rememberMe: false,
|
||||
info: "See you soon!",
|
||||
info: {
|
||||
id: "app.login.byebye",
|
||||
values: {}
|
||||
},
|
||||
error: "",
|
||||
timerID: 0
|
||||
});
|
||||
|
|
|
@ -22,7 +22,7 @@ export const rootElement = document.getElementById("root");
|
|||
// i18n
|
||||
export const onWindowIntl = () => {
|
||||
addLocaleData([...en, ...fr]);
|
||||
const locale = getBrowserLocale();
|
||||
const locale = getBrowserLocale(); // TODO: Get navigator.languages as array and match
|
||||
var strings = rawMessages[locale] ? rawMessages[locale] : rawMessages["en-US"];
|
||||
strings = Object.assign(rawMessages["en-US"], strings);
|
||||
|
||||
|
|
Loading…
Reference in New Issue