[fix] Fixed failing build and renamed Login to LoginComponent #604

Fixes #604

client/components/login/captive-portal-handler.js

@@ -1,16 +1,27 @@
-function _getParam(name) {
-    if (name = (new RegExp("[?&]" + encodeURIComponent(name) + "=([^&]*)")).exec(location.search))
-      return decodeURIComponent(name[1]);
-  } 
-  export default function handleCaptivePortalLogin(captivePortalLoginForm, setCaptivePortalError) {
-    const res = _getParam("res");
-    const reply = _getParam("reply"); 
-    if (res === "failed" && reply) {
-      setCaptivePortalError({
-        type: "authError",
-        message: reply,
-      });
-    } else {
-      setCaptivePortalError(null);
-    }
+const getUrlParam = (paramName) => {
+  const searchRegex = new RegExp(
+    `[?&]${encodeURIComponent(paramName)}=([^&]*)`,
+  );
+  const match = searchRegex.exec(window.location.search);
+  if (match) {
+    return decodeURIComponent(match[1]);
   }
+  return null;
+};
+
+export default function handleCaptivePortalLogin(
+  captivePortalLoginForm,
+  setCaptivePortalError,
+) {
+  const res = getUrlParam("res");
+  const reply = getUrlParam("reply");
+
+  if (res === "failed" && reply) {
+    setCaptivePortalError({
+      type: "authError",
+      message: reply,
+    });
+  } else {
+    setCaptivePortalError(null);
+  }
+}

client/components/login/index.js

@@ -1,9 +1,10 @@
-import React, { useState, useEffect } from 'react';  
+import React, {useState, useEffect} from "react";
+import PropTypes from "prop-types";
 import {connect} from "react-redux";
 
 import {authenticate, setUserData, setTitle} from "../../actions/dispatchers";
 import Component from "./login";
-import handleCaptivePortalLogin from './captive-portal-handler';
+import handleCaptivePortalLogin from "./captive-portal-handler";
 
 export const mapStateToProps = (state) => {
   const conf = state.organization.configuration;
@@ -29,16 +30,19 @@ export const mapDispatchToProps = (dispatch) => ({
   setTitle: setTitle(dispatch),
 });
 
-export const Login = (props) => {
+export const Login = ({captivePortalLoginForm, ...props}) => {
   const [captivePortalError, setCaptivePortalError] = useState(null);
+
   useEffect(() => {
-    handleCaptivePortalLogin(props.captivePortalLoginForm, setCaptivePortalError);
-  }, [props.captivePortalLoginForm]);
-  return (
-    <Component
-      {...props}
-      captivePortalError={captivePortalError}
-    />
-  );
+    handleCaptivePortalLogin(captivePortalLoginForm, setCaptivePortalError);
+  }, [captivePortalLoginForm]);
+
+  return <Component {...props} captivePortalError={captivePortalError} />;
 };
-export default connect(mapStateToProps, mapDispatchToProps)(Login);
+
+Login.propTypes = {
+  captivePortalLoginForm: PropTypes.shape({}).isRequired,
+};
+
+const ConnectedLogin = connect(mapStateToProps, mapDispatchToProps)(Login);
+export default ConnectedLogin;

client/components/organization-wrapper/organization-wrapper.js

@@ -16,7 +16,7 @@ import LoadingContext from "../../utils/loading-context";
 import Loader from "../../utils/loader";
 import needsVerify from "../../utils/needs-verify";
 import loadTranslation from "../../utils/load-translation";
-import Login from "../login";
+import LoginComponent from "../login";
 import {
   Registration,
   Status,
@@ -219,7 +219,7 @@ export default class OrganizationWrapper extends React.Component {
                       isAuthenticated && is_active ? (
                         <Navigate to={`/${orgSlug}/status`} />
                       ) : (
-                        <Login navigate={navigate} />
+                        <LoginComponent navigate={navigate} />
                       )
                     }
                   />

client/components/organization-wrapper/organization-wrapper.test.js

@@ -12,7 +12,7 @@ import Footer from "../footer";
 import Header from "../header";
 import Loader from "../../utils/loader";
 import needsVerify from "../../utils/needs-verify";
-import Login from "../login";
+import LoginComponent from "../login";
 import {
   Registration,
   Status,
@@ -404,7 +404,7 @@ describe("Test Organization Wrapper for unauthenticated users", () => {
       ),
     );
     element = pathMap["login/*"];
-    expect(JSON.stringify(element)).toEqual(JSON.stringify(<Login />));
+    expect(JSON.stringify(element)).toEqual(JSON.stringify(<LoginComponent />));
     element = pathMap.status;
     // userAutoLogin is true
     expect(element).toEqual(<Navigate to="/default/logout" />);