100 lines
2.7 KiB
JavaScript
100 lines
2.7 KiB
JavaScript
import Link from 'next/link'
|
|
import { useTranslation } from 'next-i18next'
|
|
import { Loader } from 'shared/components/loader.mjs'
|
|
import { useAccount } from 'shared/hooks/use-account.mjs'
|
|
|
|
export const ns = ['auth']
|
|
|
|
const Wrap = ({ children }) => (
|
|
<div className="m-auto max-w-lg text-center mt-24 p-8">{children}</div>
|
|
)
|
|
|
|
const ContactSupport = ({ t }) => (
|
|
<div className="flex flex-row items-center justify-center gap-4 mt-8">
|
|
<Link href="/support" className="btn btn-warning w-full">
|
|
{t('contactSupport')}
|
|
</Link>
|
|
</div>
|
|
)
|
|
|
|
const AuthRequired = ({ t }) => (
|
|
<Wrap>
|
|
<h1>{t('authRequired')}</h1>
|
|
<p>{t('membersOnly')}</p>
|
|
<div className="flex flex-row items-center justify-center gap-4 mt-8">
|
|
<Link href="/signup" className="btn btn-primary w-32">
|
|
{t('signUp')}
|
|
</Link>
|
|
<Link href="/signin" className="btn btn-primary btn-outline w-32">
|
|
{t('signIn')}
|
|
</Link>
|
|
</div>
|
|
</Wrap>
|
|
)
|
|
|
|
const AccountInactive = ({ t }) => (
|
|
<Wrap>
|
|
<h1>{t('accountInactive')}</h1>
|
|
<p>{t('accountInactiveMsg')}</p>
|
|
<p>{t('signupAgain')}</p>
|
|
<div className="flex flex-row items-center justify-center gap-4 mt-8">
|
|
<Link href="/signup" className="btn btn-primary w-full">
|
|
{t('signUp')}
|
|
</Link>
|
|
</div>
|
|
</Wrap>
|
|
)
|
|
|
|
const AccountDisabled = ({ t }) => (
|
|
<Wrap>
|
|
<h1>{t('accountDisabled')}</h1>
|
|
<p>{t('accountDisabledMsg')}</p>
|
|
<ContactSupport t={t} />
|
|
</Wrap>
|
|
)
|
|
|
|
const AccountProhibited = ({ t }) => (
|
|
<Wrap>
|
|
<h1>{t('accountProhibited')}</h1>
|
|
<p>{t('accountProhibitedMsg')}</p>
|
|
<ContactSupport t={t} />
|
|
</Wrap>
|
|
)
|
|
|
|
const AccountStatusUnknown = ({ t }) => (
|
|
<Wrap>
|
|
<h1>{t('statusUnknown')}</h1>
|
|
<p>{t('statusUnknownMsg')}</p>
|
|
<ContactSupport t={t} />
|
|
</Wrap>
|
|
)
|
|
|
|
const ConsentLacking = ({ t }) => (
|
|
<Wrap>
|
|
<h1>{t('consentLacking')}</h1>
|
|
<p>{t('membersOnly')}</p>
|
|
<div className="flex flex-row items-center justify-center gap-4 mt-8">
|
|
<Link href="/signup" className="btn btn-primary w-32">
|
|
{t('signUp')}
|
|
</Link>
|
|
<Link href="/signin" className="btn btn-primary btn-outline w-32">
|
|
{t('signIn')}
|
|
</Link>
|
|
</div>
|
|
</Wrap>
|
|
)
|
|
|
|
export const AuthWrapper = ({ children, app }) => {
|
|
const { t } = useTranslation(ns)
|
|
const { account, token } = useAccount()
|
|
if (!token || !account.username) return <AuthRequired t={t} />
|
|
if (account.status !== 1) {
|
|
if (account.status === 0) return <AccountInactive t={t} />
|
|
if (account.status === -1) return <AccountDisabled t={t} />
|
|
if (account.status === -2) return <AccountProhibited t={t} />
|
|
return <AccountStatusUnknown t={t} />
|
|
}
|
|
if (account.consent < 1) return <ConsentLacking />
|
|
|
|
return children
|
|
}
|