From a50ad6e6c80f58382857bceca4095098059ef488 Mon Sep 17 00:00:00 2001 From: Philip Molares Date: Sat, 16 May 2020 23:21:05 +0200 Subject: [PATCH] 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 --- public/backend-config.json | 7 +-- public/locales/de.json | 3 +- public/locales/en.json | 3 +- src/api/user.ts | 19 +++++++ .../landing/pages/login/auth/via-open id.tsx | 54 +++++++++++++++++++ src/components/landing/pages/login/login.tsx | 5 ++ src/redux/backend-config/reducers.ts | 7 +-- src/redux/backend-config/types.ts | 3 +- 8 files changed, 92 insertions(+), 9 deletions(-) create mode 100644 src/components/landing/pages/login/auth/via-open id.tsx diff --git a/public/backend-config.json b/public/backend-config.json index 3f025a875..dcb01bf57 100644 --- a/public/backend-config.json +++ b/public/backend-config.json @@ -10,12 +10,13 @@ "google": true, "saml": true, "oauth2": true, - "email": true + "email": true, + "openid": true }, "customAuthNames": { "ldap": "FooBar", - "saml": "aufSAMLn.de", - "oauth2": "Olaf2" + "oauth2": "Olaf2", + "saml": "aufSAMLn.de" }, "specialLinks": { "privacy": "test", diff --git a/public/locales/de.json b/public/locales/de.json index de2618195..58f2e4094 100644 --- a/public/locales/de.json +++ b/public/locales/de.json @@ -123,5 +123,6 @@ "errorLdapLogin": "Benutzername oder Passwort nicht korrekt", "email": "E-Mail", "password": "Passwort", - "username": "Benutzername" + "username": "Benutzername", + "errorOpenIdLogin": "OpenID nicht korrekt" } diff --git a/public/locales/en.json b/public/locales/en.json index e6ce4ac35..60df87efd 100644 --- a/public/locales/en.json +++ b/public/locales/en.json @@ -123,5 +123,6 @@ "errorLdapLogin": "Invalid username or password", "email": "Email", "password": "Password", - "username": "Username" + "username": "Username", + "errorOpenIdLogin": "Invalid OpenID provided" } diff --git a/src/api/user.ts b/src/api/user.ts index 85b4f4de0..48c6a9c1c 100644 --- a/src/api/user.ts +++ b/src/api/user.ts @@ -43,3 +43,22 @@ export const postLdapLogin = async (username: string, password: string) => { .then(expectResponseCode()) .then(response => response.json()); } + +export const postOpenIdLogin = async (openId: string) => { + return fetch(getBackendUrl() + "/auth/openid", { + method: 'POST', + mode: 'cors', + cache: 'no-cache', + credentials: 'same-origin', + headers: { + 'Content-Type': 'application/json' + }, + redirect: 'follow', + referrerPolicy: 'no-referrer', + body: JSON.stringify({ + openId: openId + }) + }) + .then(expectResponseCode()) + .then(response => response.json()); +} diff --git a/src/components/landing/pages/login/auth/via-open id.tsx b/src/components/landing/pages/login/auth/via-open id.tsx new file mode 100644 index 000000000..f50af2ce5 --- /dev/null +++ b/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 ( + +
+ +
+
+ + setOpenId(event.currentTarget.value)} + /> + + + + + + + +
+ + ); +}; + +export { ViaOpenId } diff --git a/src/components/landing/pages/login/login.tsx b/src/components/landing/pages/login/login.tsx index cb353c9fd..aaa6ca1f2 100644 --- a/src/components/landing/pages/login/login.tsx +++ b/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 ? : null const ldapForm = authProviders.ldap ? : null + const openIdForm = authProviders.openid ? : null const emailLdapSeparator = authProviders.email && authProviders.ldap ?
: null + const ldapOpenIdSeparator = authProviders.ldap && authProviders.openid ?
: null const oneClickCustomName: (type: OneClickType) => string | undefined = (type) => { switch (type) { @@ -36,6 +39,8 @@ const Login: React.FC = () => { {emailForm} {emailLdapSeparator} {ldapForm} + {ldapOpenIdSeparator} + {openIdForm}
: null diff --git a/src/redux/backend-config/reducers.ts b/src/redux/backend-config/reducers.ts index c5d7223c2..bab806eaa 100644 --- a/src/redux/backend-config/reducers.ts +++ b/src/redux/backend-config/reducers.ts @@ -13,12 +13,13 @@ export const initialState: BackendConfigState = { google: false, saml: false, oauth2: false, - email: false + email: false, + openid: false }, customAuthNames: { ldap: "", - saml: "", - oauth2: "" + oauth2: "", + saml: "" }, specialLinks: { privacy: "", diff --git a/src/redux/backend-config/types.ts b/src/redux/backend-config/types.ts index 742004f35..0ada4d3a0 100644 --- a/src/redux/backend-config/types.ts +++ b/src/redux/backend-config/types.ts @@ -20,12 +20,13 @@ export interface AuthProvidersState { saml: boolean, oauth2: boolean, email: boolean, + openid: boolean, } export interface CustomAuthNames { ldap: string; - saml: string; oauth2: string; + saml: string; } export interface SpecialLinks {