Feature/open id sign in (#35)

* added errorOpenIdLogin i18n key
* added openid authProvider
* added postOpenIdLogin api call
* added via-open-id component

Signed-off-by: Philip Molares <philip.molares@udo.edu>

src/components/landing/pages/login/auth/via-open id.tsx

@@ -0,0 +1,54 @@
+import React, {Fragment, useState} from "react";
+import {Trans, useTranslation} from "react-i18next";
+import {Alert, Button, Form} from "react-bootstrap";
+import {postOpenIdLogin} from "../../../../../api/user";
+import {getAndSetUser} from "../../../../../utils/apiUtils";
+
+const ViaOpenId: React.FC = () => {
+    useTranslation();
+    const [openId, setOpenId] = useState("");
+    const [error, setError] = useState(false);
+    const login = (event: any) => {
+        postOpenIdLogin(openId)
+            .then(loginJson => {
+                console.log(loginJson)
+                getAndSetUser();
+            }).catch(_reason => {
+                setError(true);
+            }
+        )
+        event.preventDefault();
+    }
+
+    return (
+        <Fragment>
+            <h5 className="center">
+                <Trans i18nKey="signInVia" values={{service: "OpenID"}}/>
+            </h5>
+            <Form onSubmit={login}>
+                <Form.Group controlId="openid">
+                    <Form.Control
+                        isInvalid={error}
+                        type="text"
+                        size="sm"
+                        placeholder={"OpenID"}
+                        onChange={(event) => setOpenId(event.currentTarget.value)}
+                    />
+                </Form.Group>
+
+                <Alert className="small" show={error} variant="danger">
+                    <Trans i18nKey="errorOpenIdLogin"/>
+                </Alert>
+
+                <Button
+                    type="submit"
+                    size="sm"
+                    variant="primary">
+                    <Trans i18nKey="signIn"/>
+                </Button>
+            </Form>
+        </Fragment>
+    );
+};
+
+export { ViaOpenId }

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

@@ -6,6 +6,7 @@ import {OneClickType, ViaOneClick} from "./auth/via-one-click";
 import {ViaLdap} from "./auth/via-ldap";
 import {useSelector} from "react-redux";
 import {ApplicationState} from "../../../../redux";
+import {ViaOpenId} from "./auth/via-open id";
 
 const Login: React.FC = () => {
     useTranslation();
@@ -13,7 +14,9 @@ const Login: React.FC = () => {
     const customAuthNames = useSelector((state: ApplicationState) => state.backendConfig.customAuthNames);
     const emailForm = authProviders.email ? <ViaEMail/> : null
     const ldapForm = authProviders.ldap ? <ViaLdap/> : null
+    const openIdForm = authProviders.openid ? <ViaOpenId/> : null
     const emailLdapSeparator = authProviders.email && authProviders.ldap ? <hr className="w-100 bg-white"/> : null
+    const ldapOpenIdSeparator = authProviders.ldap && authProviders.openid ? <hr className="w-100 bg-white"/> : null
 
     const oneClickCustomName: (type: OneClickType) => string | undefined = (type) => {
         switch (type) {
@@ -36,6 +39,8 @@ const Login: React.FC = () => {
                                 {emailForm}
                                 {emailLdapSeparator}
                                 {ldapForm}
+                                {ldapOpenIdSeparator}
+                                {openIdForm}
                                 <hr className="w-100 d-lg-none d-block bg-white"/>
                             </Col>
                             : null