l10n of login info messages
This commit is contained in:
parent
1ec6af4833
commit
b7ff2bbd85
6
TODO
6
TODO
|
@ -16,9 +16,15 @@
|
||||||
|
|
||||||
|
|
||||||
## Global UI
|
## Global UI
|
||||||
|
* Filter does not work on github.io
|
||||||
* What happens when JS is off?
|
* What happens when JS is off?
|
||||||
=> https://www.allantatter.com/react-js-and-progressive-enhancement/
|
=> https://www.allantatter.com/react-js-and-progressive-enhancement/
|
||||||
|
|
||||||
|
|
||||||
## Miscellaneous
|
## Miscellaneous
|
||||||
* Webpack chunks?
|
* Webpack chunks?
|
||||||
|
|
||||||
|
|
||||||
|
* Stocker pagination dans le store
|
||||||
|
* error / info: null
|
||||||
|
* refondre reducers
|
||||||
|
|
|
@ -58,9 +58,16 @@ class LoginFormCSSIntl extends Component {
|
||||||
|
|
||||||
render () {
|
render () {
|
||||||
const {formatMessage} = this.props.intl;
|
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 (
|
return (
|
||||||
<div>
|
<div>
|
||||||
{ /* TODO: info/error translation */ }
|
|
||||||
{
|
{
|
||||||
this.props.error ?
|
this.props.error ?
|
||||||
<div className="row">
|
<div className="row">
|
||||||
|
@ -76,7 +83,7 @@ class LoginFormCSSIntl extends Component {
|
||||||
this.props.info ?
|
this.props.info ?
|
||||||
<div className="row">
|
<div className="row">
|
||||||
<div className="alert alert-info" id="loginFormInfo">
|
<div className="alert alert-info" id="loginFormInfo">
|
||||||
<p>{ this.props.info }</p>
|
<p>{ infoMessage }</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
: null
|
: null
|
||||||
|
@ -129,7 +136,7 @@ LoginFormCSSIntl.propTypes = {
|
||||||
onSubmit: PropTypes.func.isRequired,
|
onSubmit: PropTypes.func.isRequired,
|
||||||
isAuthenticating: PropTypes.bool,
|
isAuthenticating: PropTypes.bool,
|
||||||
error: PropTypes.string,
|
error: PropTypes.string,
|
||||||
info: PropTypes.string,
|
info: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
|
||||||
intl: intlShape.isRequired,
|
intl: intlShape.isRequired,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -163,7 +170,7 @@ Login.propTypes = {
|
||||||
onSubmit: PropTypes.func.isRequired,
|
onSubmit: PropTypes.func.isRequired,
|
||||||
isAuthenticating: PropTypes.bool,
|
isAuthenticating: PropTypes.bool,
|
||||||
error: PropTypes.string,
|
error: PropTypes.string,
|
||||||
info: PropTypes.string
|
info: PropTypes.oneOfType([PropTypes.string, PropTypes.object])
|
||||||
};
|
};
|
||||||
|
|
||||||
export default CSSModules(Login, css);
|
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.common.song": "{itemCount, plural, one {Song} other {Songs}}", // Song
|
||||||
"app.filter.filter": "Filter…", // Filtering input placeholder
|
"app.filter.filter": "Filter…", // Filtering input placeholder
|
||||||
"app.filter.whatAreWeListeningToToday": "What are we listening to today?", // Description for the filter bar
|
"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.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.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.password": "Password", // Password input placeholder
|
||||||
"app.login.rememberMe": "Remember me", // Remember me checkbox label
|
"app.login.rememberMe": "Remember me", // Remember me checkbox label
|
||||||
"app.login.signIn": "Sign in", // Sign in
|
"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.login.username": "Username", // Username input placeholder
|
||||||
"app.pagination.current": "current", // Current (page)
|
"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
|
"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.common.song": "{itemCount, plural, one {Piste} other {Pistes}}", // Song
|
||||||
"app.filter.filter": "Filtrer…", // Filtering input placeholder
|
"app.filter.filter": "Filtrer…", // Filtering input placeholder
|
||||||
"app.filter.whatAreWeListeningToToday": "Que voulez-vous écouter aujourd'hui\u00a0?", // Description for the filter bar
|
"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.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.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.password": "Mot de passe", // Password input placeholder
|
||||||
"app.login.rememberMe": "Se souvenir", // Remember me checkbox label
|
"app.login.rememberMe": "Se souvenir", // Remember me checkbox label
|
||||||
"app.login.signIn": "Connexion", // Sign in
|
"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.login.username": "Utilisateur", // Username input placeholder
|
||||||
"app.pagination.current": "actuelle", // Current (page)
|
"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
|
"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",
|
id: "app.login.greeting",
|
||||||
description: "Greeting to welcome the user to the app",
|
description: "Greeting to welcome the user to the app",
|
||||||
defaultMessage: "Welcome back on Ampache, let's go!"
|
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) => {
|
[LOGIN_USER_REQUEST]: (state) => {
|
||||||
return Object.assign({}, state, {
|
return Object.assign({}, state, {
|
||||||
isAuthenticating: true,
|
isAuthenticating: true,
|
||||||
info: "Connecting…",
|
info: {
|
||||||
|
id: "app.login.connecting",
|
||||||
|
values: {}
|
||||||
|
},
|
||||||
error: "",
|
error: "",
|
||||||
timerID: null
|
timerID: null
|
||||||
});
|
});
|
||||||
|
@ -40,7 +43,10 @@ export default createReducer(initialState, {
|
||||||
username: payload.username,
|
username: payload.username,
|
||||||
endpoint: payload.endpoint,
|
endpoint: payload.endpoint,
|
||||||
rememberMe: payload.rememberMe,
|
rememberMe: payload.rememberMe,
|
||||||
info: "Successfully logged in as " + payload.username + "!",
|
info: {
|
||||||
|
id: "app.login.success",
|
||||||
|
values: { username: payload.username}
|
||||||
|
},
|
||||||
error: "",
|
error: "",
|
||||||
timerID: payload.timerID
|
timerID: payload.timerID
|
||||||
});
|
});
|
||||||
|
@ -66,7 +72,10 @@ export default createReducer(initialState, {
|
||||||
username: "",
|
username: "",
|
||||||
endpoint: "",
|
endpoint: "",
|
||||||
rememberMe: false,
|
rememberMe: false,
|
||||||
info: "See you soon!",
|
info: {
|
||||||
|
id: "app.login.byebye",
|
||||||
|
values: {}
|
||||||
|
},
|
||||||
error: "",
|
error: "",
|
||||||
timerID: 0
|
timerID: 0
|
||||||
});
|
});
|
||||||
|
|
|
@ -22,7 +22,7 @@ export const rootElement = document.getElementById("root");
|
||||||
// i18n
|
// i18n
|
||||||
export const onWindowIntl = () => {
|
export const onWindowIntl = () => {
|
||||||
addLocaleData([...en, ...fr]);
|
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"];
|
var strings = rawMessages[locale] ? rawMessages[locale] : rawMessages["en-US"];
|
||||||
strings = Object.assign(rawMessages["en-US"], strings);
|
strings = Object.assign(rawMessages["en-US"], strings);
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue