mirror of
https://github.com/IliesAllali/parenthese.git
synced 2026-11-15 00:30:50 +00:00
IliesAllaliandClaude Opus 5.5
6f28918dde
Module frontend/src/i18n : le texte français sert de clé, dictionnaires anglais par zone, langue du navigateur puis choix mémorisé, ?lang=en pour forcer. Bascule dans le menu du compte, la pastille visiteur, le menu Plus, l'écran d'accès et la connexion. Démo traduite (noms et lieux gardés). Liens d'aide et de vie privée selon la langue. Textes français sans accents corrigés. Test : chaque texte passé à t() a sa traduction. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
99 lines
2.8 KiB
React
99 lines
2.8 KiB
React
import { Component } from 'react'
|
|
import { t } from '../i18n/index.js'
|
|
|
|
class ErrorBoundary extends Component {
|
|
constructor(props) {
|
|
super(props)
|
|
this.state = { hasError: false, error: null }
|
|
}
|
|
|
|
static getDerivedStateFromError(error) {
|
|
return { hasError: true, error }
|
|
}
|
|
|
|
componentDidCatch(error, errorInfo) {
|
|
console.error('ErrorBoundary caught:', error, errorInfo)
|
|
}
|
|
|
|
handleReset = () => {
|
|
this.setState({ hasError: false, error: null })
|
|
}
|
|
|
|
render() {
|
|
if (this.state.hasError) {
|
|
return (
|
|
<div style={{
|
|
display: 'flex',
|
|
flexDirection: 'column',
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
height: '100vh',
|
|
fontFamily: 'system-ui, sans-serif',
|
|
color: '#2a2622',
|
|
background: '#f7f5f4',
|
|
padding: '2rem',
|
|
textAlign: 'center',
|
|
}}>
|
|
<h1 style={{ fontSize: '1.5rem', marginBottom: '0.5rem' }}>
|
|
{t('Une erreur inattendue est survenue')}
|
|
</h1>
|
|
<p style={{ color: '#6b645d', marginBottom: '1.5rem', maxWidth: '400px' }}>
|
|
{t("L'application a rencontré un problème. Vous pouvez essayer de recharger ou revenir à l'écran précédent.")}
|
|
</p>
|
|
<div style={{ display: 'flex', gap: '0.75rem' }}>
|
|
<button
|
|
type="button"
|
|
onClick={this.handleReset}
|
|
style={{
|
|
padding: '0.5rem 1.25rem',
|
|
borderRadius: '6px',
|
|
border: '1px solid #bab6b2',
|
|
background: 'white',
|
|
color: '#2a2622',
|
|
cursor: 'pointer',
|
|
fontSize: '0.9rem',
|
|
}}
|
|
>
|
|
{t('Réessayer')}
|
|
</button>
|
|
<button
|
|
type="button"
|
|
onClick={() => window.location.reload()}
|
|
style={{
|
|
padding: '0.5rem 1.25rem',
|
|
borderRadius: '6px',
|
|
border: 'none',
|
|
background: '#2a2622',
|
|
color: 'white',
|
|
cursor: 'pointer',
|
|
fontSize: '0.9rem',
|
|
}}
|
|
>
|
|
{t('Recharger la page')}
|
|
</button>
|
|
</div>
|
|
{this.state.error && (
|
|
<pre style={{
|
|
marginTop: '2rem',
|
|
padding: '1rem',
|
|
background: '#f8e4db',
|
|
borderRadius: '6px',
|
|
fontSize: '0.75rem',
|
|
color: '#6b645d',
|
|
maxWidth: '600px',
|
|
overflow: 'auto',
|
|
textAlign: 'left',
|
|
}}>
|
|
{this.state.error.message || String(this.state.error)}
|
|
</pre>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|
|
|
|
return this.props.children
|
|
}
|
|
}
|
|
|
|
export default ErrorBoundary
|