import React from 'react'
import ReactDOM from 'react-dom/client'
import App from './App'
import './index.css'
import { CardoraProvider } from './context/CardoraContext'

class ErrorBoundary extends React.Component {
  constructor(props) {
    super(props)
    this.state = { error: null }
  }
  static getDerivedStateFromError(error) { return { error } }
  componentDidCatch(error) { console.error('Cardora runtime error:', error) }
  render() {
    if (this.state.error) {
      return (
        <main style={{minHeight:'100vh',display:'grid',placeItems:'center',padding:'24px',fontFamily:'system-ui',background:'#f4f6f8',color:'#0f172a'}}>
          <section style={{maxWidth:'520px',width:'100%',background:'#fff',borderRadius:'24px',padding:'24px',boxShadow:'0 12px 40px rgba(15,23,42,.08)'}}>
            <h1 style={{margin:'0 0 8px',fontSize:'22px'}}>Cardora açılamadı</h1>
            <p style={{margin:'0 0 16px',lineHeight:1.6,color:'#64748b'}}>Uygulama beklenmeyen bir hatayla karşılaştı. Verileriniz silinmedi. Sayfayı yenileyin; sorun sürerse bu ekranın görüntüsünü paylaşın.</p>
            <button onClick={() => location.reload()} style={{border:0,borderRadius:'14px',padding:'12px 16px',fontWeight:700,background:'#059669',color:'#fff'}}>Tekrar dene</button>
          </section>
        </main>
      )
    }
    return this.props.children
  }
}

window.__cardoraStarted?.()

const root = document.getElementById('root')
if (!root) throw new Error('Cardora root elementi bulunamadı.')
ReactDOM.createRoot(root).render(
  <React.StrictMode>
    <ErrorBoundary>
      <CardoraProvider>
        <App />
      </CardoraProvider>
    </ErrorBoundary>
  </React.StrictMode>,
)