Lars
a748f4607d
- Introduced a utility function to standardize email verification checks across EmailVerificationBanner and AccountSettingsPage. - Updated conditional logic to enhance clarity and maintainability regarding email verification status. - Ensured consistent treatment of various representations of email verification status in user profiles.
83 lines
2.5 KiB
JavaScript
83 lines
2.5 KiB
JavaScript
import { useState } from 'react'
|
|
import api from '../utils/api'
|
|
|
|
function isEmailVerifiedRow(p) {
|
|
if (!p) return false
|
|
const v = p.email_verified
|
|
return v === true || v === 't' || v === 1 || v === 'true'
|
|
}
|
|
|
|
/**
|
|
* Hinweis + „Erneut senden“, wenn eingeloggt aber E-Mail noch nicht verifiziert (wie Mitai).
|
|
*/
|
|
export default function EmailVerificationBanner({ profile }) {
|
|
const [resending, setResending] = useState(false)
|
|
const [success, setSuccess] = useState(false)
|
|
const [error, setError] = useState('')
|
|
|
|
if (!profile?.email || isEmailVerifiedRow(profile)) return null
|
|
|
|
const handleResend = async () => {
|
|
if (!profile.email) return
|
|
setResending(true)
|
|
setError('')
|
|
setSuccess(false)
|
|
try {
|
|
await api.resendVerification(profile.email)
|
|
setSuccess(true)
|
|
setTimeout(() => setSuccess(false), 6000)
|
|
} catch (err) {
|
|
setError(err.message || 'Versand fehlgeschlagen')
|
|
setTimeout(() => setError(''), 7000)
|
|
} finally {
|
|
setResending(false)
|
|
}
|
|
}
|
|
|
|
return (
|
|
<div
|
|
className="card"
|
|
style={{
|
|
marginBottom: '1.25rem',
|
|
borderLeft: '4px solid #D97706',
|
|
background: 'var(--surface2)',
|
|
}}
|
|
role="status"
|
|
>
|
|
<div
|
|
style={{
|
|
display: 'flex',
|
|
flexWrap: 'wrap',
|
|
alignItems: 'center',
|
|
gap: '12px',
|
|
}}
|
|
>
|
|
<span style={{ fontSize: '1.5rem', lineHeight: 1 }} aria-hidden>
|
|
📧
|
|
</span>
|
|
<div style={{ flex: '1 1 200px' }}>
|
|
<div style={{ fontWeight: 700, fontSize: '0.95rem', color: '#D97706', marginBottom: 4 }}>
|
|
E-Mail noch nicht bestätigt
|
|
</div>
|
|
<p style={{ fontSize: '0.875rem', color: 'var(--text2)', lineHeight: 1.45, margin: 0 }}>
|
|
Bitte prüfe dein Postfach und öffne den Bestätigungslink (auch Spam-Ordner).
|
|
{success && (
|
|
<span style={{ color: 'var(--accent-dark)', fontWeight: 600, marginLeft: 8 }}>Neue Mail wurde angefordert.</span>
|
|
)}
|
|
{error && <span style={{ color: 'var(--danger)', fontWeight: 600, marginLeft: 8 }}>{error}</span>}
|
|
</p>
|
|
</div>
|
|
<button
|
|
type="button"
|
|
className="btn btn-secondary"
|
|
onClick={handleResend}
|
|
disabled={resending || success}
|
|
style={{ flexShrink: 0 }}
|
|
>
|
|
{resending ? 'Sende…' : success ? '✓ Unterwegs' : 'Erneut senden'}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|