remove params

src/client/js/components/LoginForm.jsx

@@ -8,13 +8,33 @@ class LoginForm extends React.Component {
   constructor(props) {
     super(props);
 
+    this.isRegistrationEnabled = false;
+    this.isLocalStrategySetup = false;
+    this.isLdapStrategySetup = false;
+    this.objOfIsExternalAuthEnableds = {};
+
     this.renderLocalOrLdapLoginForm = this.renderLocalOrLdapLoginForm.bind(this);
     this.renderExternalAuthLoginForm = this.renderExternalAuthLoginForm.bind(this);
     this.renderExternalAuthInput = this.renderExternalAuthInput.bind(this);
   }
 
+  componentWillMount() {
+    this.isRegistrationEnabled = true;
+    this.isLocalStrategySetup = true;
+    this.isLdapStrategySetup = true;
+    this.objOfIsExternalAuthEnableds = {
+      google: true,
+      github: true,
+      facebook: true,
+      twitter: true,
+      oidc: true,
+      saml: true,
+      basic: true,
+    };
+  }
+
   renderLocalOrLdapLoginForm() {
-    const { t, isLdapStrategySetup } = this.props;
+    const { t } = this.props;
 
     return (
       <form className="col-12" role="form" action="/login" method="post">
@@ -24,7 +44,7 @@ class LoginForm extends React.Component {
             <span className="input-group-text"><i className="icon-user"></i></span>
           </div>
           <input type="text" className="form-control" placeholder="Username or E-mail" name="loginForm[username]" />
-          {isLdapStrategySetup && (
+          {this.isLdapStrategySetup && (
             <div className="input-group-append">
               <small className="input-group-text text-success">
                 <i className="icon-fw icon-check"></i> LDAP
@@ -71,8 +91,7 @@ class LoginForm extends React.Component {
   }
 
   renderExternalAuthLoginForm() {
-    const { isLocalStrategySetup, isLdapStrategySetup, objOfIsExternalAuthEnableds } = this.props;
-    const isExternalAuthCollapsible = isLocalStrategySetup || isLdapStrategySetup;
+    const isExternalAuthCollapsible = this.isLocalStrategySetup || this.isLdapStrategySetup;
     const collapsibleClass = isExternalAuthCollapsible ? 'collapse collapse-external-auth collapse-anchor' : '';
 
     return (
@@ -81,11 +100,11 @@ class LoginForm extends React.Component {
         <div id="external-auth" className={`external-auth ${collapsibleClass}`}>
           <div className="spacer"></div>
           <div className="d-flex flex-row justify-content-between flex-wrap">
-            {Object.keys(objOfIsExternalAuthEnableds).map((auth) => {
-              if (!objOfIsExternalAuthEnableds[auth]) {
+            {Object.keys(this.objOfIsExternalAuthEnableds).map((auth) => {
+              if (!this.objOfIsExternalAuthEnableds[auth]) {
                 return;
               }
-              return this.renderExternalAuthInput([auth]);
+              return this.renderExternalAuthInput(auth);
             })}
           </div>
           <div className="spacer"></div>
@@ -108,17 +127,11 @@ class LoginForm extends React.Component {
   }
 
   render() {
-    const {
-      t,
-      isRegistrationEnabled,
-      isLocalStrategySetup,
-      isLdapStrategySetup,
-      objOfIsExternalAuthEnableds,
-    } = this.props;
-
-    const isLocalOrLdapStrategiesEnabled = isLocalStrategySetup || isLdapStrategySetup;
-    const registerFormClass = isRegistrationEnabled ? 'to-flip' : '';
-    const isSomeExternalAuthEnabled = Object.values(objOfIsExternalAuthEnableds).some(elem => elem);
+    const { t } = this.props;
+
+    const isLocalOrLdapStrategiesEnabled = this.isLocalStrategySetup || this.isLdapStrategySetup;
+    const registerFormClass = this.isRegistrationEnabled ? 'to-flip' : '';
+    const isSomeExternalAuthEnabled = Object.values(this.objOfIsExternalAuthEnableds).some(elem => elem);
 
     return (
       <div className={`login-dialog mx-auto flipper ${registerFormClass}`} id="login-dialog">
@@ -131,7 +144,7 @@ class LoginForm extends React.Component {
             {/* [TODO][GW-1863] render register form here */}
           </div>
         </div>
-        {isRegistrationEnabled && (
+        {this.isRegistrationEnabled && (
           <div className="row">
             <div className="col-12 text-right py-2">
               <a href="#register" id="register" className="link-switch">
@@ -149,10 +162,6 @@ class LoginForm extends React.Component {
 LoginForm.propTypes = {
   // i18next
   t: PropTypes.func.isRequired,
-  isRegistrationEnabled: PropTypes.bool,
-  isLocalStrategySetup: PropTypes.bool,
-  isLdapStrategySetup: PropTypes.bool,
-  objOfIsExternalAuthEnableds: PropTypes.object,
 };
 
 export default withTranslation()(LoginForm);

src/client/js/nologin.jsx

@@ -27,27 +27,9 @@ if (installerFormElem) {
 // render loginForm
 const loginFormElem = document.getElementById('login-form');
 if (loginFormElem) {
-  const isRegistrationEnabled = loginFormElem.dataset.isRegistrationEnabled === 'true';
-  const isLdapStrategySetup = loginFormElem.dataset.isLdapStrategySetup === 'true';
-  const isLocalStrategySetup = loginFormElem.dataset.isLocalStrategySetup === 'true';
-  const objOfIsExternalAuthEnableds = {
-    google: loginFormElem.dataset.isGoogleAuthEnabled,
-    github: loginFormElem.dataset.isGithubAuthEnabled,
-    facebook: loginFormElem.dataset.isFacebookAuthEnabled,
-    twitter: loginFormElem.dataset.isTwitterAuthEnabled,
-    oidc: loginFormElem.dataset.isOidcAuthEnabled,
-    saml: loginFormElem.dataset.isSamlAuthEnabled,
-    basic: loginFormElem.dataset.isBasicAuthEnabled,
-  };
-
   ReactDOM.render(
     <I18nextProvider i18n={i18n}>
-      <LoginForm
-        isRegistrationEnabled={isRegistrationEnabled}
-        isLdapStrategySetup={isLdapStrategySetup}
-        isLocalStrategySetup={isLocalStrategySetup}
-        objOfIsExternalAuthEnableds={objOfIsExternalAuthEnableds}
-      />
+      <LoginForm />
     </I18nextProvider>,
     loginFormElem,
   );

src/server/views/login.html

@@ -104,22 +104,8 @@
           </div>
         </div>
       </div>
-        <!-- [TODO][GW-1913] react component gets params without swig  -->
-        {% set isLocalStrategySetup = passportService.isLocalStrategySetup %}
-        {% set isLdapStrategySetup = passportService.isLdapStrategySetup %}
-
-      <div id="login-form"
-        data-is-local-strategy-setup="{{ isLocalStrategySetup }}"
-        data-is-ldap-strategy-setup="{{ isLdapStrategySetup }}"
-        data-is-registration-enabled="{{ req.query.register or req.body.registerForm or isRegistering }}"
-        data-is-google-auth-enabled="{{ getConfig('crowi', 'security:passport-google:isEnabled') }}"
-        data-is-github-auth-enabled="{{ getConfig('crowi', 'security:passport-github:isEnabled') }}"
-        data-is-facebool-auth-enabled="{{ getConfig('crowi', 'security:passport-facebook:isEnabled') }}"
-        data-is-twitter-auth-enabled="{{ getConfig('crowi', 'security:passport-twitter:isEnabled') }}"
-        data-is-oidc-auth-enabled="{{ getConfig('crowi', 'security:passport-oidc:isEnabled') }}"
-        data-is-saml-auth-enabled="{{ getConfig('crowi', 'security:passport-saml:isEnabled') }}"
-        data-is-basic-auth-enabled="{{ getConfig('crowi', 'security:passport-basic:isEnabled') }}"
-      ></div>
+
+      <div id="login-form"></div>
 
       <div>
         <div>