rc 1.0
This commit is contained in:
@@ -2,6 +2,7 @@
|
||||
|
||||
import { useState, useEffect } from 'react'
|
||||
import { useSearchParams } from 'next/navigation'
|
||||
import { useI18n } from '@/lib/i18n'
|
||||
|
||||
interface User {
|
||||
id: number
|
||||
@@ -16,6 +17,7 @@ interface AuthModalProps {
|
||||
}
|
||||
|
||||
export default function AuthModal({ isOpen, onClose, onLogin }: AuthModalProps) {
|
||||
const { t } = useI18n()
|
||||
const searchParams = useSearchParams()
|
||||
const [isLogin, setIsLogin] = useState(true)
|
||||
const [username, setUsername] = useState('')
|
||||
@@ -83,7 +85,7 @@ export default function AuthModal({ isOpen, onClose, onLogin }: AuthModalProps)
|
||||
const data = await response.json()
|
||||
|
||||
if (!response.ok) {
|
||||
setError(data.error || 'An error occurred')
|
||||
setError(data.error || t('auth.anErrorOccurred'))
|
||||
setLoading(false)
|
||||
return
|
||||
}
|
||||
@@ -93,7 +95,7 @@ export default function AuthModal({ isOpen, onClose, onLogin }: AuthModalProps)
|
||||
onClose()
|
||||
} catch (error) {
|
||||
console.error('Auth error:', error)
|
||||
setError('An unexpected error occurred')
|
||||
setError(t('auth.unexpectedError'))
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
@@ -131,7 +133,7 @@ export default function AuthModal({ isOpen, onClose, onLogin }: AuthModalProps)
|
||||
>
|
||||
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '24px' }}>
|
||||
<h2 style={{ margin: 0 }}>
|
||||
{isLogin ? 'Login' : 'Register'}
|
||||
{isLogin ? t('auth.login') : t('auth.register')}
|
||||
</h2>
|
||||
<button
|
||||
onClick={onClose}
|
||||
@@ -165,7 +167,7 @@ export default function AuthModal({ isOpen, onClose, onLogin }: AuthModalProps)
|
||||
color: 'var(--text)',
|
||||
}}
|
||||
>
|
||||
Email
|
||||
{t('auth.email')}
|
||||
</label>
|
||||
<input
|
||||
type="email"
|
||||
@@ -182,7 +184,7 @@ export default function AuthModal({ isOpen, onClose, onLogin }: AuthModalProps)
|
||||
color: 'var(--text)',
|
||||
fontSize: '14px',
|
||||
}}
|
||||
placeholder="your@email.com"
|
||||
placeholder={t('auth.email')}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
@@ -197,7 +199,7 @@ export default function AuthModal({ isOpen, onClose, onLogin }: AuthModalProps)
|
||||
color: 'var(--text)',
|
||||
}}
|
||||
>
|
||||
Username
|
||||
{t('auth.username')}
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
@@ -215,7 +217,7 @@ export default function AuthModal({ isOpen, onClose, onLogin }: AuthModalProps)
|
||||
color: 'var(--text)',
|
||||
fontSize: '14px',
|
||||
}}
|
||||
placeholder="username"
|
||||
placeholder={t('auth.username')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -229,7 +231,7 @@ export default function AuthModal({ isOpen, onClose, onLogin }: AuthModalProps)
|
||||
color: 'var(--text)',
|
||||
}}
|
||||
>
|
||||
Password
|
||||
{t('auth.password')}
|
||||
</label>
|
||||
<input
|
||||
type="password"
|
||||
@@ -247,7 +249,7 @@ export default function AuthModal({ isOpen, onClose, onLogin }: AuthModalProps)
|
||||
color: 'var(--text)',
|
||||
fontSize: '14px',
|
||||
}}
|
||||
placeholder="password"
|
||||
placeholder={t('auth.password')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -262,7 +264,7 @@ export default function AuthModal({ isOpen, onClose, onLogin }: AuthModalProps)
|
||||
color: 'var(--text)',
|
||||
}}
|
||||
>
|
||||
Referral ID <span style={{ color: 'var(--muted)', fontSize: '12px', fontWeight: 'normal' }}>(optional)</span>
|
||||
{t('auth.referralId')} <span style={{ color: 'var(--muted)', fontSize: '12px', fontWeight: 'normal' }}>({t('auth.optional')})</span>
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
@@ -278,11 +280,11 @@ export default function AuthModal({ isOpen, onClose, onLogin }: AuthModalProps)
|
||||
color: 'var(--text)',
|
||||
fontSize: '14px',
|
||||
}}
|
||||
placeholder="Enter referral ID"
|
||||
placeholder={t('auth.referralId')}
|
||||
/>
|
||||
{searchParams?.get('ref') && referralId === searchParams.get('ref') && (
|
||||
<small style={{ display: 'block', marginTop: '4px', fontSize: '12px', color: 'var(--accent)' }}>
|
||||
✓ Auto-filled from referral link
|
||||
{t('auth.autoFilled')}
|
||||
</small>
|
||||
)}
|
||||
</div>
|
||||
@@ -316,10 +318,10 @@ export default function AuthModal({ isOpen, onClose, onLogin }: AuthModalProps)
|
||||
}}
|
||||
>
|
||||
{loading
|
||||
? 'Processing...'
|
||||
? t('common.processing')
|
||||
: isLogin
|
||||
? 'Login'
|
||||
: 'Register'}
|
||||
? t('auth.login')
|
||||
: t('auth.register')}
|
||||
</button>
|
||||
</form>
|
||||
|
||||
@@ -333,7 +335,7 @@ export default function AuthModal({ isOpen, onClose, onLogin }: AuthModalProps)
|
||||
>
|
||||
{isLogin ? (
|
||||
<>
|
||||
Don't have an account?{' '}
|
||||
{t('auth.dontHaveAccount')}{' '}
|
||||
<button
|
||||
onClick={() => {
|
||||
setIsLogin(false)
|
||||
@@ -348,12 +350,12 @@ export default function AuthModal({ isOpen, onClose, onLogin }: AuthModalProps)
|
||||
padding: 0,
|
||||
}}
|
||||
>
|
||||
Register
|
||||
{t('auth.register')}
|
||||
</button>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
Already have an account?{' '}
|
||||
{t('auth.alreadyHaveAccount')}{' '}
|
||||
<button
|
||||
onClick={() => {
|
||||
setIsLogin(true)
|
||||
@@ -368,7 +370,7 @@ export default function AuthModal({ isOpen, onClose, onLogin }: AuthModalProps)
|
||||
padding: 0,
|
||||
}}
|
||||
>
|
||||
Login
|
||||
{t('auth.login')}
|
||||
</button>
|
||||
</>
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user