Show login-buttons and boxes only if providers are configured (#122)

* Hide "Sign-in via ..." box if no provider is enabled

* Show sign-in buttons only if auth-providers exist

* Rebase fixes

* Replaced ternary operators with ShowIf

* Added ShowIf on two other code positions
This commit is contained in:
Erik Michelson 2020-06-04 23:38:21 +02:00 committed by GitHub
parent 2b4c3c76ba
commit b051b109e5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 58 additions and 47 deletions

View file

@ -2,7 +2,10 @@ import React from 'react'
import { Button } from 'react-bootstrap'
import { ButtonProps } from 'react-bootstrap/Button'
import { Trans, useTranslation } from 'react-i18next'
import { useSelector } from 'react-redux'
import { LinkContainer } from 'react-router-bootstrap'
import { ApplicationState } from '../../../../redux'
import { ShowIf } from '../../../common/show-if'
type SignInButtonProps = {
className?: string
@ -10,15 +13,17 @@ type SignInButtonProps = {
export const SignInButton: React.FC<SignInButtonProps> = ({ variant, ...props }) => {
const { t } = useTranslation()
const authProviders = useSelector((state: ApplicationState) => state.backendConfig.authProviders)
return (
<LinkContainer to="/login" title={t('login.signIn')}>
<Button
variant={variant || 'success'}
{...props}
>
<Trans i18nKey="login.signIn"/>
</Button>
</LinkContainer>
<ShowIf condition={Object.values(authProviders).includes(true)}>
<LinkContainer to="/login" title={t('login.signIn')}>
<Button
variant={variant || 'success'}
{...props}
>
<Trans i18nKey="login.signIn"/>
</Button>
</LinkContainer>
</ShowIf>
)
}