build(docker): 🧱 Improve runtime environment
This commit is contained in:
@ -9,20 +9,18 @@ import {
|
||||
} from '@chakra-ui/react'
|
||||
import React, { ChangeEvent, FormEvent, useEffect } from 'react'
|
||||
import { useState } from 'react'
|
||||
import { signIn, useSession } from 'next-auth/react'
|
||||
import {
|
||||
ClientSafeProvider,
|
||||
getProviders,
|
||||
LiteralUnion,
|
||||
signIn,
|
||||
useSession,
|
||||
} from 'next-auth/react'
|
||||
import { DividerWithText } from './DividerWithText'
|
||||
import { SocialLoginButtons } from './SocialLoginButtons'
|
||||
import { useRouter } from 'next/router'
|
||||
import { NextChakraLink } from 'components/nextChakra/NextChakraLink'
|
||||
import { isEmpty, isNotEmpty } from 'utils'
|
||||
|
||||
const hasNoAuthProvider =
|
||||
(isEmpty(process.env.NEXT_PUBLIC_SMTP_FROM) ||
|
||||
process.env.NEXT_PUBLIC_SMTP_AUTH_DISABLED === 'true') &&
|
||||
isEmpty(process.env.NEXT_PUBLIC_GOOGLE_CLIENT_ID) &&
|
||||
isEmpty(process.env.NEXT_PUBLIC_GITHUB_CLIENT_ID) &&
|
||||
isEmpty(process.env.NEXT_PUBLIC_FACEBOOK_CLIENT_ID) &&
|
||||
isEmpty(process.env.NEXT_PUBLIC_GITLAB_CLIENT_ID)
|
||||
import { BuiltInProviderType } from 'next-auth/providers'
|
||||
|
||||
type Props = {
|
||||
defaultEmail?: string
|
||||
@ -33,14 +31,28 @@ export const SignInForm = ({
|
||||
const router = useRouter()
|
||||
const { status } = useSession()
|
||||
const [authLoading, setAuthLoading] = useState(false)
|
||||
const [isLoadingProviders, setIsLoadingProviders] = useState(true)
|
||||
|
||||
const [emailValue, setEmailValue] = useState(defaultEmail ?? '')
|
||||
const toast = useToast({
|
||||
position: 'top-right',
|
||||
})
|
||||
const [providers, setProviders] =
|
||||
useState<
|
||||
Record<LiteralUnion<BuiltInProviderType, string>, ClientSafeProvider>
|
||||
>()
|
||||
|
||||
const hasNoAuthProvider =
|
||||
!isLoadingProviders && Object.keys(providers ?? {}).length === 0
|
||||
|
||||
useEffect(() => {
|
||||
if (status === 'authenticated')
|
||||
router.replace({ pathname: '/typebots', query: router.query })
|
||||
;(async () => {
|
||||
const providers = await getProviders()
|
||||
setProviders(providers ?? undefined)
|
||||
setIsLoadingProviders(false)
|
||||
})()
|
||||
}, [status, router])
|
||||
|
||||
const handleEmailChange = (e: ChangeEvent<HTMLInputElement>) =>
|
||||
@ -77,32 +89,31 @@ export const SignInForm = ({
|
||||
)
|
||||
return (
|
||||
<Stack spacing="4" w="330px">
|
||||
<SocialLoginButtons />
|
||||
{isNotEmpty(process.env.NEXT_PUBLIC_SMTP_FROM) &&
|
||||
process.env.NEXT_PUBLIC_SMTP_AUTH_DISABLED !== 'true' && (
|
||||
<>
|
||||
<DividerWithText mt="6">Or with your email</DividerWithText>
|
||||
<HStack as="form" onSubmit={handleEmailSubmit}>
|
||||
<Input
|
||||
name="email"
|
||||
type="email"
|
||||
autoComplete="email"
|
||||
placeholder="email@company.com"
|
||||
required
|
||||
value={emailValue}
|
||||
onChange={handleEmailChange}
|
||||
/>
|
||||
<Button
|
||||
type="submit"
|
||||
isLoading={
|
||||
['loading', 'authenticated'].includes(status) || authLoading
|
||||
}
|
||||
>
|
||||
Submit
|
||||
</Button>
|
||||
</HStack>
|
||||
</>
|
||||
)}
|
||||
<SocialLoginButtons providers={providers} />
|
||||
{providers?.email && (
|
||||
<>
|
||||
<DividerWithText mt="6">Or with your email</DividerWithText>
|
||||
<HStack as="form" onSubmit={handleEmailSubmit}>
|
||||
<Input
|
||||
name="email"
|
||||
type="email"
|
||||
autoComplete="email"
|
||||
placeholder="email@company.com"
|
||||
required
|
||||
value={emailValue}
|
||||
onChange={handleEmailChange}
|
||||
/>
|
||||
<Button
|
||||
type="submit"
|
||||
isLoading={
|
||||
['loading', 'authenticated'].includes(status) || authLoading
|
||||
}
|
||||
>
|
||||
Submit
|
||||
</Button>
|
||||
</HStack>
|
||||
</>
|
||||
)}
|
||||
</Stack>
|
||||
)
|
||||
}
|
||||
|
@ -1,13 +1,24 @@
|
||||
import { Stack, Button } from '@chakra-ui/react'
|
||||
import { GithubIcon } from 'assets/icons'
|
||||
import { signIn, useSession } from 'next-auth/react'
|
||||
import {
|
||||
ClientSafeProvider,
|
||||
LiteralUnion,
|
||||
signIn,
|
||||
useSession,
|
||||
} from 'next-auth/react'
|
||||
import { useRouter } from 'next/router'
|
||||
import React from 'react'
|
||||
import { stringify } from 'qs'
|
||||
import { FacebookLogo, GoogleLogo, GitlabLogo } from 'assets/logos'
|
||||
import { isEmpty } from 'utils'
|
||||
import { BuiltInProviderType } from 'next-auth/providers'
|
||||
|
||||
export const SocialLoginButtons = () => {
|
||||
type Props = {
|
||||
providers:
|
||||
| Record<LiteralUnion<BuiltInProviderType, string>, ClientSafeProvider>
|
||||
| undefined
|
||||
}
|
||||
|
||||
export const SocialLoginButtons = ({ providers }: Props) => {
|
||||
const { query } = useRouter()
|
||||
const { status } = useSession()
|
||||
|
||||
@ -33,7 +44,7 @@ export const SocialLoginButtons = () => {
|
||||
|
||||
return (
|
||||
<Stack>
|
||||
{!isEmpty(process.env.NEXT_PUBLIC_GITHUB_CLIENT_ID) && (
|
||||
{providers?.github && (
|
||||
<Button
|
||||
leftIcon={<GithubIcon />}
|
||||
onClick={handleGitHubClick}
|
||||
@ -44,7 +55,7 @@ export const SocialLoginButtons = () => {
|
||||
Continue with GitHub
|
||||
</Button>
|
||||
)}
|
||||
{!isEmpty(process.env.NEXT_PUBLIC_GOOGLE_CLIENT_ID) && (
|
||||
{providers?.google && (
|
||||
<Button
|
||||
leftIcon={<GoogleLogo />}
|
||||
onClick={handleGoogleClick}
|
||||
@ -55,7 +66,7 @@ export const SocialLoginButtons = () => {
|
||||
Continue with Google
|
||||
</Button>
|
||||
)}
|
||||
{!isEmpty(process.env.NEXT_PUBLIC_FACEBOOK_CLIENT_ID) && (
|
||||
{providers?.facebook && (
|
||||
<Button
|
||||
leftIcon={<FacebookLogo />}
|
||||
onClick={handleFacebookClick}
|
||||
@ -66,7 +77,7 @@ export const SocialLoginButtons = () => {
|
||||
Continue with Facebook
|
||||
</Button>
|
||||
)}
|
||||
{!isEmpty(process.env.NEXT_PUBLIC_GITLAB_CLIENT_ID) && (
|
||||
{providers?.gitlab && (
|
||||
<Button
|
||||
leftIcon={<GitlabLogo />}
|
||||
onClick={handleGitlabClick}
|
||||
@ -74,10 +85,7 @@ export const SocialLoginButtons = () => {
|
||||
isLoading={['loading', 'authenticated'].includes(status)}
|
||||
variant="outline"
|
||||
>
|
||||
Continue with{' '}
|
||||
{isEmpty(process.env.NEXT_PUBLIC_GITLAB_NAME)
|
||||
? 'GitLab'
|
||||
: process.env.NEXT_PUBLIC_GITLAB_NAME}
|
||||
Continue with {providers.gitlab.name}
|
||||
</Button>
|
||||
)}
|
||||
</Stack>
|
||||
|
Reference in New Issue
Block a user