/* eslint no-unused-vars: "off" */
import { createApp } from 'vue'
import { createPinia } from 'pinia'
import App from '../../../views/admin/App.vue'
import router from '@/router'
import 'maz-ui/styles'
import 'element-plus/dist/index.css'
import { useLabelsStore } from '@/stores/labels'
import { useLabels } from '@/composables/useLabels'

declare global {
  const wp: {
    media: () => void
    open: () => void
  }
  const wpIvyApiSettings: {
    root: string
    nonce: string
    namespace: string
  }
  const wpIvyUrls: {
    pluginUrl: string
    siteURL: string
  }
  const wpIvyDateFormat: {
    dateFormat: string
    timeFormat: string
    dateTimeFormat: string
    locale: string
  }
}

const app = createApp(App)
const pinia = createPinia()
app.use(pinia)
app.use(router)

// Initialize the labels store with WordPress data
const labelsStore = useLabelsStore()
labelsStore.initialize()

// Make labels globally available to all components
app.config.globalProperties.$labels = useLabels()

app.mount('#ivyforms-app')