Frontend config and Loader component (#12)

* Add FrontendConfig and Loader

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>

* Merge more setup into the application loader

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>

* Rename config files

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>

* Remove blank line

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>

* Fix url

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>

* Make strings more specific

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>

* Restructure store use

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>

* split methods and actions

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>

* extract code

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>

* remove actions.ts

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>

* add reason and rename component

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>

* remove unused call

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>

* Use redux store in api

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>

* activate email in backend config

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>

* add new line

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>

* reduce code

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>

* Make error more specific

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>

* Use expectedResponseCode

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>

* Update src/redux/backend-config/types.ts

Co-authored-by: Philip Molares <git@molar.es>

* Update src/components/application-loader/application-loader.tsx

Co-authored-by: Philip Molares <git@molar.es>

* Update src/components/application-loader/application-loader.tsx

Co-authored-by: Philip Molares <git@molar.es>

* Update src/components/application-loader/application-loader.tsx

Co-authored-by: Philip Molares <git@molar.es>

* Use fragment

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>

Co-authored-by: Philip Molares <git@molar.es>

src/components/landing/layout/footer/powered-by-links.tsx

@@ -18,7 +18,7 @@ const PoweredByLinks: React.FC = () => {
         }
     ]
 
-    const config = useSelector((state: ApplicationState) => state.applicationConfig);
+    const config = useSelector((state: ApplicationState) => state.backendConfig);
 
     const specialLinks = Object.entries(config.specialLinks)
             .filter(([_, value]) => value !== "")

src/components/landing/layout/index.tsx

@@ -9,20 +9,19 @@ import "./style/index.scss";
 import {Login} from "../pages/login/login";
 
 export const Landing: React.FC = () => {
-    return (
-        <Container>
-            <HeaderBar/>
-            <Switch>
-                <Route path="/history">
-                    <History/>
-                </Route>
-                <Route path="/intro">
-                    <Intro/>
-                </Route>
-                <Route path="/login">
-                    <Login/>
-                </Route>
-            </Switch>
-            <Footer/>
-        </Container>);
+    return (<Container>
+        <HeaderBar/>
+        <Switch>
+            <Route path="/history">
+                <History/>
+            </Route>
+            <Route path="/intro">
+                <Intro/>
+            </Route>
+            <Route path="/login">
+                <Login/>
+            </Route>
+        </Switch>
+        <Footer/>
+    </Container>)
 }

src/components/landing/layout/navigation/header-bar/header-bar.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+import React, {Fragment} from 'react'
 import {Navbar} from 'react-bootstrap';
 import {useSelector} from "react-redux";
 import {ApplicationState} from "../../../../../redux";
@@ -27,19 +27,19 @@ const HeaderBar: React.FC = () => {
             </div>
             <div className="d-inline-flex">
                 {user.status === LoginStatus.forbidden ?
-                    <>
+                    <Fragment>
                         <span className={"mr-1"}>
                             <NewGuestNoteButton/>
                         </span>
                         <SignInButton/>
-                    </>
+                    </Fragment>
                     :
-                    <>
+                    <Fragment>
                         <span className={"mr-1"}>
                             <NewUserNoteButton/>
                         </span>
                         <UserDropdown/>
-                    </>
+                    </Fragment>
                 }
             </div>
         </Navbar>

src/components/landing/layout/navigation/user-dropdown/user-dropdown.tsx

@@ -1,16 +1,15 @@
 import {Dropdown} from "react-bootstrap";
 import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
 import React from "react";
-import {useDispatch, useSelector} from "react-redux";
+import {useSelector} from "react-redux";
 import {ApplicationState} from "../../../../../redux";
 import {LinkContainer} from "react-router-bootstrap";
-import {clearUser} from "../../../../../redux/user/actions";
+import {clearUser} from "../../../../../redux/user/methods";
 import "./user-dropdown.scss";
 import {Trans} from "react-i18next";
 
 export const UserDropdown: React.FC = () => {
     const user = useSelector((state: ApplicationState) => state.user);
-    const dispatch = useDispatch()
 
     return (
         <Dropdown alignRight>
@@ -43,7 +42,7 @@ export const UserDropdown: React.FC = () => {
                 </Dropdown.Item>
                 <Dropdown.Item
                     onClick={() => {
-                        dispatch(clearUser());
+                        clearUser();
                     }}>
                     <FontAwesomeIcon icon="sign-out-alt"/>&nbsp;
                     <Trans i18nKey="signOut"/>

src/components/landing/pages/login/auth/via-email.tsx

@@ -1,13 +1,11 @@
 import {Trans, useTranslation} from "react-i18next";
-import {Button, Form, Alert} from "react-bootstrap";
+import {Alert, Button, Form} from "react-bootstrap";
 import React, {Fragment, useState} from "react";
 import {postEmailLogin} from "../../../../../api/user";
-import {useDispatch} from "react-redux";
-import {getAndSetUser} from "../../../../initialize/initialize-user-state-from-api";
+import {getAndSetUser} from "../../../../../utils/apiUtils";
 
 const ViaEMail: React.FC = () => {
     const {t} = useTranslation();
-    const dispatch = useDispatch();
     const [email, setEmail] = useState("");
     const [password, setPassword] = useState("");
     const [error, setError] = useState(false);
@@ -15,10 +13,11 @@ const ViaEMail: React.FC = () => {
         postEmailLogin(email, password)
             .then(loginJson => {
                 console.log(loginJson)
-                getAndSetUser(dispatch);
-        }).catch(_reason => {
+                getAndSetUser();
+            }).catch(_reason => {
                 setError(true);
-        })
+            }
+        )
         event.preventDefault();
     }
 
@@ -55,8 +54,7 @@ const ViaEMail: React.FC = () => {
                 <Button
                     type="submit"
                     size="sm"
-                    variant="primary"
-                >
+                    variant="primary">
                     <Trans i18nKey="signIn"/>
                 </Button>
             </Form>
@@ -64,4 +62,4 @@ const ViaEMail: React.FC = () => {
     );
 }
 
-export { ViaEMail }
+export {ViaEMail}

src/components/landing/pages/login/login.tsx

@@ -9,7 +9,7 @@ import {ApplicationState} from "../../../../redux";
 
 const Login: React.FC = () => {
     useTranslation();
-    const authProviders = useSelector((state: ApplicationState) => state.applicationConfig.authProviders);
+    const authProviders = useSelector((state: ApplicationState) => state.backendConfig.authProviders);
 
     const emailForm = authProviders.email ? <ViaEMail/> : null
     const ldapForm = authProviders.ldap ? <ViaLdap/> : null