callback url

resource/locales/en-US/translation.json

@@ -465,14 +465,14 @@
     "anyone": "Anyone",
 
 		"Authentication mechanism settings": "Authentication Mechanism Settings",
-    "alert_siteUrl_is_not_set": "'Site URL' is NOT set. Set it from the %s",
+    "alert_siteUrl_is_not_set": "'Site URL' is NOT set. Set it from the {{link}}",
     "xss_prevent_setting":"Prevent XSS(Cross Site Scripting)",
     "xss_prevent_setting_link":"Go to Markdown settings",
     "callback_URL": "Callback URL",
     "providerName": "Provider Name",
     "issuerHost": "Issuer Host",
     "scope": "Scope",
-    "desc_of_callback_URL": "Use it in the setting of the %s provider",
+    "desc_of_callback_URL": "Use it in the setting of the SAML Identity provider",
     "clientID": "Client ID",
     "client_secret": "Client Secret",
     "guest_mode": {
@@ -536,7 +536,7 @@
       "username_detail": "Specification of mappings for <code>username</code> when creating new users",
       "mapping_detail": "Specification of mappings for %s when creating new users",
       "cert_detail": "PEM-encoded X.509 signing certificate to validate the response from IdP",
-      "Use env var if empty": "If the value in the database is empty, the value of the environment variable <code>%s</code> is used.",
+      "Use env var if empty": "If the value in the database is empty, the value of the environment variable <code>{{env}}</code> is used.",
       "note for the only env option": "The setting item that enables or disables the SAML authentication and the highlighted setting items use only the value of environment variables.<br>To change this setting, please change to false or delete the value of the environment variable <code>%s</code> ."
     },
     "Basic": {

resource/locales/ja/translation.json

@@ -463,11 +463,11 @@
     "anyone": "誰でも可能",
 
     "Authentication mechanism settings":"認証機構設定",
-    "alert_siteUrl_is_not_set": "'サイトURL' が設定されていません。%s から設定してください。",
+    "alert_siteUrl_is_not_set": "'サイトURL' が設定されていません。{{link}} から設定してください。",
     "xss_prevent_setting":"XSS(Cross Site Scripting)対策設定",
     "xss_prevent_setting_link":"マークダウン設定ページに移動",
     "callback_URL": "コールバックURL",
-    "desc_of_callback_URL": "%s プロバイダ側の設定で利用してください。",
+    "desc_of_callback_URL": "SAML Identity プロバイダ側の設定で利用してください。",
     "clientID": "クライアントID",
     "client_secret": "クライアントシークレット",
     "guest_mode": {
@@ -531,7 +531,7 @@
       "username_detail": "新規ユーザーのアカウント名(<code>username</code>)に関連付ける属性",
       "mapping_detail": "新規ユーザーの%sに関連付ける属性",
       "cert_detail": "IdP からのレスポンスの validation を行うためのPEMエンコードされた X.509 証明書",
-      "Use env var if empty": "データベース側の値が空の場合、環境変数 <code>%s</code> の値を利用します",
+      "Use env var if empty": "データベース側の値が空の場合、環境変数 <code>{{env}}</code> の値を利用します",
       "note for the only env option": "現在SAML認証のON/OFFの設定値及びハイライトされている設定値は環境変数の値のみを使用するようになっています<br>この設定を変更する場合は環境変数 <code>%s</code> の値をfalseに変更もしくは削除してください"
     },
     "Basic": {

src/client/js/components/Admin/Security/SamlSecuritySetting.jsx

@@ -1,3 +1,4 @@
+/* eslint-disable react/no-danger */
 import React from 'react';
 import PropTypes from 'prop-types';
 import { withTranslation } from 'react-i18next';
@@ -12,15 +13,14 @@ import AdminSamlSecurityContainer from '../../../services/AdminSamlSecurityConta
 class SamlSecurityManagement extends React.Component {
 
   render() {
-    const { t, adminGeneralSecurityContainer } = this.props;
+    const { t, adminGeneralSecurityContainer, adminSamlSecurityContainer } = this.props;
     return (
       <React.Fragment>
 
         {adminGeneralSecurityContainer.state.useOnlyEnvVarsForSomeOptions && (
         <p
           className="alert alert-info"
-          // eslint-disable-next-line react/no-danger
-          dangerouslySetInnerHTML={{ __html: t('security_setting.SAML.note for the only env option', 'SAML_USES_ONLY_ENV_VARS_FOR_SOME_OPTIONS') }}
+          dangerouslySetInnerHTML={{ __html: t('security_setting.SAML.note for the only env option', { env: 'SAML_USES_ONLY_ENV_VARS_FOR_SOME_OPTIONS' }) }}
         />
         )}
 
@@ -41,6 +41,28 @@ class SamlSecurityManagement extends React.Component {
           </div>
         </div>
 
+        <div className="form-group">
+          <label className="col-xs-3 text-right">{ t('security_setting.callback_URL') }</label>
+          <div className="col-xs-6">
+            <input
+              className="form-control"
+              type="text"
+              value={adminSamlSecurityContainer.state.callbackUrl}
+              readOnly
+            />
+            <p className="help-block small">{ t('security_setting.desc_of_callback_URL') }</p>
+            {!adminSamlSecurityContainer.state.appSiteUrl && (
+            <div className="alert alert-danger">
+              <i
+                className="icon-exclamation"
+                // eslint-disable-next-line max-len
+                dangerouslySetInnerHTML={{ __html: t('security_setting.alert_siteUrl_is_not_set', { link: `<a href="/admin/app">${t('App settings')}<i class="icon-login"></i></a>` }) }}
+              />
+            </div>
+            )}
+          </div>
+        </div>
+
 
       </React.Fragment>
     );

src/client/js/services/AdminSamlSecurityContainer.js

@@ -18,7 +18,8 @@ export default class AdminSamlSecurityContainer extends Container {
 
     this.state = {
       // TODO GW-583 set value
-      hoge: 'test',
+      appSiteUrl: false,
+      callbackUrl: 'hoge.com',
     };
 
     this.init();