import { createApp } from 'vue'
import { createPinia } from 'pinia'
import { markRaw } from 'vue'
import router from './router'
import './style.css'
import App from './App.vue'

const app = createApp(App)

// Global error handler
app.config.errorHandler = (err, instance, info) => {
  console.error('Global Vue error caught:', err)
  console.error('Error info:', info)
  // Optionally show a user-friendly error message
  // You could integrate with a notification store here
}

// Global promise rejection handler (for unhandled async errors)
window.addEventListener('unhandledrejection', (event) => {
  console.error('Unhandled promise rejection:', event.reason)
  event.preventDefault()
})

const pinia = createPinia()

// Inject router into all Pinia stores
pinia.use(({ store }) => {
  store.router = markRaw(router)
})

app.use(pinia)
app.use(router)
app.mount('#app')