import { Component } from 'react';

/**
 * isolates an optional 3D feature so a runtime failure in one
 * (labels, rings, zones, cover, logo, movement) cannot crash the
 * whole Canvas. On failure it renders a small amber wireframe marker
 * (pure native geometry + meshBasicMaterial — no shaders, no Html)
 * so the procedural prosthetic stays visible and the user can see
 * which feature was disabled.
 */
export default class SceneFeatureBoundary extends Component {
  constructor(props) {
    super(props);
    this.state = { error: null };
  }

  static getDerivedStateFromError(error) {
    return { error };
  }

  componentDidCatch(error) {
    // eslint-disable-next-line no-console
    console.warn('[SceneFeatureBoundary]', this.props.name, error?.message || error);
  }

  render() {
    if (this.state.error) {
      const pos = this.props.warningPosition || [0, 200, 0];
      return (
        <mesh position={pos} raycast={() => null}>
          <sphereGeometry args={[7, 14, 14]} />
          <meshBasicMaterial color="#f59e0b" wireframe transparent opacity={0.8} />
        </mesh>
      );
    }
    return this.props.children;
  }
}