github/hedgedoc
1
0
Fork 0
mirror of https://github.com/hedgedoc/hedgedoc.git synced 2024-11-28 16:50:59 -05:00
Code Issues Projects Releases Packages Wiki Activity

Fix/email open id separator (#39)

Browse source 
Fix/email open id separator 

Signed-off-by: Philip Molares <philip.molares@udo.edu>
Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>
This commit is contained in:
Philip Molares 2020-05-21 21:23:24 +02:00 committed by GitHub
parent 90d9ba5226
commit 4c785b345b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 19 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
src/components/element-separator/element-separator.tsx
View file

@ -8,13 +8,18 @@ export const ElementSeparator: React.FC<ElementSeparatorProps> = ({children, sep
return ( return (
<Fragment> <Fragment>
{ {
React.Children.map(children, (child, index) => { React.Children
return <Fragment> .toArray(children)
{ .filter(child => child !== null)
(index > 0) ? separator : null .map((child, index) => {
} return (
{child} <Fragment>
</Fragment> {
(index > 0 ) ? separator : null
}
{child}
</Fragment>
)
}) })
} }
</Fragment> </Fragment>

15
src/components/landing/pages/login/login.tsx
View file

@ -8,6 +8,7 @@ import {useSelector} from "react-redux";
import {ApplicationState} from "../../../../redux"; import {ApplicationState} from "../../../../redux";
import {ViaOpenId} from "./auth/via-open id"; import {ViaOpenId} from "./auth/via-open id";
import "./login.scss"; import "./login.scss";
import {ElementSeparator} from "../../../element-separator/element-separator";
const Login: React.FC = () => { const Login: React.FC = () => {
useTranslation(); useTranslation();
@ -16,8 +17,6 @@ const Login: React.FC = () => {
const emailForm = authProviders.email ? <ViaEMail/> : null const emailForm = authProviders.email ? <ViaEMail/> : null
const ldapForm = authProviders.ldap ? <ViaLdap/> : null const ldapForm = authProviders.ldap ? <ViaLdap/> : null
const openIdForm = authProviders.openid ? <ViaOpenId/> : 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) => { const oneClickCustomName: (type: OneClickType) => string | undefined = (type) => {
switch (type) { switch (type) {
@ -35,13 +34,13 @@ const Login: React.FC = () => {
<div className="my-3"> <div className="my-3">
<Row className="h-100 flex justify-content-center"> <Row className="h-100 flex justify-content-center">
{ {
authProviders.email || authProviders.ldap ? authProviders.email || authProviders.ldap || authProviders.openid ?
<Col xs={12} sm={10} lg={3}> <Col xs={12} sm={10} lg={3}>
{emailForm} <ElementSeparator separator={<hr className="w-100 bg-white"/>}>
{emailLdapSeparator} {emailForm}
{ldapForm} {ldapForm}
{ldapOpenIdSeparator} {openIdForm}
{openIdForm} </ElementSeparator>
<hr className="w-100 d-lg-none d-block bg-white"/> <hr className="w-100 d-lg-none d-block bg-white"/>
</Col> </Col>
: null : null