[DEV] Fix webpack for development workflow (#1163)

web/src/App.tsx

@@ -17,10 +17,10 @@ import NotificationsContext from './hooks/NotificationsContext';
 import { Notification } from './models/Notifications';
 import NotificationBar from './components/NotificationBar';
 import SignOut from './views/LoginPortal/SignOut/SignOut';
-import { useRememberMe, useResetPassword } from './hooks/Configuration';
+import { getRememberMe, getResetPassword } from './utils/Configuration';
 import '@fortawesome/fontawesome-svg-core/styles.css'
 import { config as faConfig } from '@fortawesome/fontawesome-svg-core';
-import { useBasePath } from './hooks/BasePath';
+import { getBasePath } from './utils/BasePath';
 
 faConfig.autoAddCss = false;
 
@@ -29,7 +29,7 @@ const App: React.FC = () => {
 
     return (
         <NotificationsContext.Provider value={{ notification, setNotification }} >
-            <Router basename={useBasePath()}>
+            <Router basename={getBasePath()}>
                 <NotificationBar onClose={() => setNotification(null)} />
                 <Switch>
                     <Route path={ResetPasswordStep1Route} exact>
@@ -49,8 +49,8 @@ const App: React.FC = () => {
                     </Route>
                     <Route path={FirstFactorRoute}>
                         <LoginPortal
-                            rememberMe={useRememberMe()}
-                            resetPassword={useResetPassword()} />
+                            rememberMe={getRememberMe()}
+                            resetPassword={getResetPassword()} />
                     </Route>
                     <Route path="/">
                         <Redirect to={FirstFactorRoute} />

web/src/hooks/AssetPath.ts

@@ -1,7 +0,0 @@
-import { useBasePath } from "./BasePath";
-
-__webpack_public_path__ = "/"
-
-if (useBasePath() !== "") {
-  __webpack_public_path__ = useBasePath() + "/"
-}

web/src/hooks/BasePath.ts

@@ -1,5 +0,0 @@
-import { useEmbeddedVariable } from "./Configuration";
-
-export function useBasePath() {
-    return useEmbeddedVariable("basepath");
-}

web/src/hooks/Configuration.ts

@@ -1,23 +1,6 @@
 import { useRemoteCall } from "./RemoteCall";
 import { getConfiguration } from "../services/Configuration";
 
-export function useEmbeddedVariable(variableName: string) {
-    const value = document.body.getAttribute(`data-${variableName}`);
-    if (value === null) {
-        throw new Error(`No ${variableName} embedded variable detected`);
-    }
-
-    return value;
-}
-
-export function useRememberMe() {
-    return useEmbeddedVariable("rememberme") === "true";
-}
-
-export function useResetPassword() {
-    return useEmbeddedVariable("disable-resetpassword") === "true";
-}
-
 export function useConfiguration() {
     return useRemoteCall(getConfiguration, []);
 }

web/src/index.tsx

@@ -1,4 +1,4 @@
-import './hooks/AssetPath';
+import './utils/AssetPath';
 import React from 'react';
 import ReactDOM from 'react-dom';
 import './index.css';

web/src/services/Api.ts

@@ -1,7 +1,7 @@
 import { AxiosResponse } from "axios";
-import { useBasePath } from "../hooks/BasePath";
+import { getBasePath } from "../utils/BasePath";
 
-const basePath = useBasePath();
+const basePath = getBasePath();
 
 export const FirstFactorPath = basePath + "/api/firstfactor";
 export const InitiateTOTPRegistrationPath = basePath + "/api/secondfactor/totp/identity/start";

web/src/utils/AssetPath.ts

@@ -0,0 +1,7 @@
+import { getBasePath } from "./BasePath";
+
+__webpack_public_path__ = "/"
+
+if (getBasePath() !== "") {
+  __webpack_public_path__ = getBasePath() + "/"
+}

web/src/utils/BasePath.ts

@@ -0,0 +1,5 @@
+import { getEmbeddedVariable } from "./Configuration";
+
+export function getBasePath() {
+    return getEmbeddedVariable("basepath");
+}

web/src/utils/Configuration.ts

@@ -0,0 +1,16 @@
+export function getEmbeddedVariable(variableName: string) {
+  const value = document.body.getAttribute(`data-${variableName}`);
+  if (value === null) {
+    throw new Error(`No ${variableName} embedded variable detected`);
+  }
+
+  return value;
+}
+
+export function getRememberMe() {
+  return getEmbeddedVariable("rememberme") === "true";
+}
+
+export function getResetPassword() {
+  return getEmbeddedVariable("disable-resetpassword") === "true";
+}