Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 | 13x 12x 8x 4x 12x 1x 1x 22x 8x | import { Component } from 'react';
/**
* Garde-fou de chargement de la vue 3D : `React.lazy` propage une erreur d'import
* (chunk indisponible, réseau, navigateur sans WebGL) — sans error boundary, tout
* l'écran tombe. Ici, l'utilisateur revient simplement en 2D.
*/
export default class Graph3DErrorBoundary extends Component {
constructor(props) {
super(props);
this.state = { hasError: false };
}
static getDerivedStateFromError() {
return { hasError: true };
}
componentDidCatch(error) {
// Trace utile au diagnostic, sans interrompre l'utilisateur.
console.error('Vue 3D indisponible :', error);
}
handleBack = () => {
this.setState({ hasError: false });
this.props.onBackTo2D?.();
};
render() {
if (!this.state.hasError) return this.props.children;
return (
<div className="border border-red-200 rounded-lg bg-red-50 p-4 text-sm text-red-700">
<p>La vue 3D n’a pas pu être chargée.</p>
<button
type="button"
onClick={this.handleBack}
className="mt-2 inline-flex items-center px-3 py-1.5 border border-red-300 rounded-lg bg-white hover:bg-red-100"
>
Revenir à la vue 2D
</button>
</div>
);
}
}
|