Details
diff --git a/themes/src/main/resources/theme/keycloak-preview/account/index.ftl b/themes/src/main/resources/theme/keycloak-preview/account/index.ftl
index 5c6a195..4d0f093 100644
--- a/themes/src/main/resources/theme/keycloak-preview/account/index.ftl
+++ b/themes/src/main/resources/theme/keycloak-preview/account/index.ftl
@@ -122,7 +122,7 @@
if (loadListener) script.addEventListener("load", loadListener);
document.head.appendChild(script);
};
- keycloak.init({onLoad: 'login-required'}).success(function(authenticated) {
+ keycloak.init({onLoad: 'check-sso'}).success(function(authenticated) {
loadjs("/node_modules/react/umd/react.development.js", function() {
loadjs("/node_modules/react-dom/umd/react-dom.development.js", function() {
loadjs("/node_modules/systemjs/dist/system.src.js", function() {
diff --git a/themes/src/main/resources/theme/keycloak-preview/account/resources/app/App.tsx b/themes/src/main/resources/theme/keycloak-preview/account/resources/app/App.tsx
index dc08e92..a461d53 100644
--- a/themes/src/main/resources/theme/keycloak-preview/account/resources/app/App.tsx
+++ b/themes/src/main/resources/theme/keycloak-preview/account/resources/app/App.tsx
@@ -20,6 +20,7 @@ import {Route, Link} from 'react-router-dom';
import {KeycloakService} from './keycloak-service/keycloak.service';
import {Logout} from './widgets/Logout';
+import {Msg} from './widgets/Msg';
import {AccountPage} from './content/account-page/AccountPage';
import {ApplicationsPage} from './content/applications-page/ApplicationsPage';
import {PasswordPage} from './content/password-page/PasswordPage';
@@ -50,9 +51,9 @@ export class App extends React.Component<AppProps> {
return (
<span>
<nav>
- <Link to="/app/account" className="btn btn-primary btn-lg btn-sign" type="button">Account</Link>
- <Link to="/app/applications" className="btn btn-primary btn-lg btn-sign" type="button">Applications</Link>
- <Link to="/app/password" className="btn btn-primary btn-lg btn-sign" type="button">Password</Link>
+ <Link to="/app/account" className="btn btn-primary btn-lg btn-sign" type="button"><Msg msgKey="account"/></Link>
+ <Link to="/app/applications" className="btn btn-primary btn-lg btn-sign" type="button"><Msg msgKey="applications"/></Link>
+ <Link to="/app/password" className="btn btn-primary btn-lg btn-sign" type="button"><Msg msgKey="password"/></Link>
{ExtensionPages.Links}
<Logout/>
<Route path='/app/account' component={AccountPage}/>
diff --git a/themes/src/main/resources/theme/keycloak-preview/account/resources/app/content/account-page/AccountPage.tsx b/themes/src/main/resources/theme/keycloak-preview/account/resources/app/content/account-page/AccountPage.tsx
index 4bebe2e..6a75165 100644
--- a/themes/src/main/resources/theme/keycloak-preview/account/resources/app/content/account-page/AccountPage.tsx
+++ b/themes/src/main/resources/theme/keycloak-preview/account/resources/app/content/account-page/AccountPage.tsx
@@ -16,7 +16,9 @@
import * as React from 'react';
import {AxiosResponse} from 'axios';
+
import {AccountServiceClient} from '../../account-service/account.service';
+import {Msg} from '../../widgets/Msg';
interface AccountPageProps {
}
@@ -77,11 +79,10 @@ export class AccountPage extends React.Component<AccountPageProps, AccountPageSt
});
}
- private makeTextInput(label: string,
- name: string,
+ private makeTextInput(name: string,
disabled = false): React.ReactElement<any> {
return (
- <label>{label}
+ <label><Msg msgKey={name}/>:
<input disabled={disabled} type="text" name={name} value={this.state[name]} onChange={this.handleChange} />
</label>
);
@@ -90,17 +91,17 @@ export class AccountPage extends React.Component<AccountPageProps, AccountPageSt
render() {
return (
<form onSubmit={this.handleSubmit}>
- {this.makeTextInput('User Name:', 'username', true)}
+ {this.makeTextInput('username', true)}
<br/>
- {this.makeTextInput('First Name:', 'firstName')}
+ {this.makeTextInput('firstName')}
<br/>
- {this.makeTextInput('Last Name:', 'lastName')}
+ {this.makeTextInput('lastName')}
<br/>
- {this.makeTextInput('Email:', 'email')}
+ {this.makeTextInput('email')}
<br/>
<button className="btn btn-primary btn-lg btn-sign"
disabled={!this.state.changed}
- value="Submit">Submit</button>
+ value="Submit"><Msg msgKey="doSave"/></button>
</form>
);
}
diff --git a/themes/src/main/resources/theme/keycloak-preview/account/resources/app/widgets/Logout.tsx b/themes/src/main/resources/theme/keycloak-preview/account/resources/app/widgets/Logout.tsx
index 2051f83..b041dcb 100644
--- a/themes/src/main/resources/theme/keycloak-preview/account/resources/app/widgets/Logout.tsx
+++ b/themes/src/main/resources/theme/keycloak-preview/account/resources/app/widgets/Logout.tsx
@@ -16,6 +16,8 @@
import * as React from 'react';
import {Link} from 'react-router-dom';
+
+import {Msg} from './Msg';
import {KeycloakService} from '../keycloak-service/keycloak.service';
declare const baseUrl;
@@ -35,7 +37,7 @@ export class Logout extends React.Component<LogoutProps> {
render() {
return (
- <Link to="/" className="btn btn-primary btn-lg btn-sign" type="button" onClick={this.handleLogout}>Logout</Link>
+ <Link to="/" className="btn btn-primary btn-lg btn-sign" type="button" onClick={this.handleLogout}><Msg msgKey="doSignOut"/></Link>
);
}
}
diff --git a/themes/src/main/resources/theme/keycloak-preview/account/resources/app/widgets/Msg.tsx b/themes/src/main/resources/theme/keycloak-preview/account/resources/app/widgets/Msg.tsx
new file mode 100644
index 0000000..72e8870
--- /dev/null
+++ b/themes/src/main/resources/theme/keycloak-preview/account/resources/app/widgets/Msg.tsx
@@ -0,0 +1,46 @@
+/*
+ * Copyright 2018 Red Hat, Inc. and/or its affiliates.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import * as React from 'react';
+
+declare const l18n_msg: {[key:string]: string};
+
+export interface MsgProps {
+ readonly msgKey:string;
+ readonly params?:Array<string>;
+}
+
+export class Msg extends React.Component<MsgProps> {
+
+ constructor(props: MsgProps) {
+ super(props);
+ }
+
+ render() {
+ let message:string = l18n_msg[this.props.msgKey];
+ if (message === undefined) message = this.props.msgKey;
+
+ if (this.props.params !== undefined) {
+ this.props.params.forEach((value: string, index: number) => {
+ message = message.replace('{{param_'+ index + '}}', value);
+ })
+ }
+
+ return (
+ <span>{message}</span>
+ );
+ }
+}