@@ -107,9 +113,9 @@ class SignIn extends Component {
{
{
/>
- Sign In
+
@@ -144,4 +150,4 @@ class SignIn extends Component
{
}
-export default withAuthenticationContext(withSnackbar(withStyles(styles)(SignIn)));
+export default injectIntl(withAuthenticationContext(withSnackbar(withStyles(styles)(SignIn))));
diff --git a/interface/src/i18n/I18n.tsx b/interface/src/i18n/I18n.tsx
new file mode 100644
index 00000000..cd8efc78
--- /dev/null
+++ b/interface/src/i18n/I18n.tsx
@@ -0,0 +1,45 @@
+import React, { Component } from 'react';
+import { createIntl, createIntlCache, RawIntlProvider } from 'react-intl';
+import { messages } from './messages';
+
+const defaultLocale = "es";
+
+const cache = createIntlCache()
+
+export const intl = createIntl({
+ locale: defaultLocale,
+ defaultLocale: defaultLocale,
+ messages: messages[defaultLocale]
+}, cache)
+
+interface LanguageWrapperState {
+ locale: string;
+};
+
+class I18n extends Component<{}, LanguageWrapperState> {
+
+ state: LanguageWrapperState = { locale: defaultLocale };
+
+ // load locale from local storage here
+ componentDidMount = () => {
+
+ }
+
+ selectLanguage = (locale: string) => {
+ intl.locale = locale;
+ intl.messages = messages[locale];
+ this.setState({ locale })
+ }
+
+ render() {
+ const { locale } = this.state;
+ return (
+
+ {this.props.children}
+
+ );
+ }
+
+}
+
+export default I18n;
diff --git a/interface/src/i18n/messages.ts b/interface/src/i18n/messages.ts
new file mode 100644
index 00000000..3ff81c06
--- /dev/null
+++ b/interface/src/i18n/messages.ts
@@ -0,0 +1,8 @@
+import { merge } from 'lodash';
+import { signInMessages } from '../messages';
+import { projectMessages } from '../project/messages';
+
+export const messages: Record> = merge(
+ signInMessages,
+ projectMessages
+);
diff --git a/interface/src/messages.ts b/interface/src/messages.ts
new file mode 100644
index 00000000..64e81aa0
--- /dev/null
+++ b/interface/src/messages.ts
@@ -0,0 +1,11 @@
+export const signInMessages: Record> = {
+ es: {
+ "signIn.invalidCredentials": "Credenciales no válidas",
+ "signIn.invalidStatusCode": "Codigo invalido: {code}",
+ "signIn.password": "Contraseña",
+ "signIn.passwordRequired": "Se requiere contraseña",
+ "signIn.signIn": "Registrarse",
+ "signIn.username": "Nombre de usuario",
+ "signIn.usernameRequired": "Se requiere nombre de usuario"
+ }
+};
diff --git a/interface/src/project/DemoProject.tsx b/interface/src/project/DemoProject.tsx
index 74f25e53..2568f87b 100644
--- a/interface/src/project/DemoProject.tsx
+++ b/interface/src/project/DemoProject.tsx
@@ -11,21 +11,37 @@ import DemoInformation from './DemoInformation';
import LightStateRestController from './LightStateRestController';
import LightStateWebSocketController from './LightStateWebSocketController';
import LightMqttSettingsController from './LightMqttSettingsController';
+import { WrappedComponentProps, injectIntl } from 'react-intl';
-class DemoProject extends Component {
+type DemoProjectProps = RouteComponentProps & WrappedComponentProps;
+
+class DemoProject extends Component {
handleTabChange = (event: React.ChangeEvent<{}>, path: string) => {
this.props.history.push(path);
};
render() {
+ const { intl } = this.props;
return (
-
-
-
-
+
+
+
+
@@ -40,4 +56,4 @@ class DemoProject extends Component {
}
-export default DemoProject;
+export default injectIntl(DemoProject);
diff --git a/interface/src/project/messages.ts b/interface/src/project/messages.ts
new file mode 100644
index 00000000..943aaf93
--- /dev/null
+++ b/interface/src/project/messages.ts
@@ -0,0 +1,8 @@
+export const projectMessages: Record> = {
+ es: {
+ "project.information": "Información",
+ "project.restController": "Controlador REST",
+ "project.webSocketController":"Controlador WebSocket",
+ "project.mqttController":"Controlador MQTT"
+ }
+};