import './assets/main.scss'

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import axios from 'axios'
import * as bootstrap from 'bootstrap'

import 'vue-toast-notification/dist/theme-sugar.css'

axios.defaults.baseURL = '/api'
axios.defaults.headers.post['Content-Type'] = 'application/json'

axios.interceptors.request.use(
  (config) => {
    const token = localStorage.getItem('authToken')
    if (token) {
      config.headers['Authorization'] = 'Bearer ' + token
    }
    return config
  },
  (error) => {
    return Promise.reject(error)
  }
)

axios.interceptors.response.use(
  (res) => {
    return res
  },
  async (err) => {
    const originalConfig = err.config

    if (originalConfig.url !== '/auth/signin' && err.response) {
      if (err.response.status === 401 && !originalConfig._retry) {
        originalConfig._retry = true

        try {
          const rs = await axios.post('/auth/refresh', {
            RefreshToken: localStorage.getItem('refToken')
          })

          localStorage.setItem('authToken', rs.data.auth_token)

          return axios(originalConfig)
        } catch (_error) {
          return Promise.reject(_error)
        }
      }
    }

    return Promise.reject(err)
  }
)

const app = createApp(App)

app.use(router)

app.mount('#app')

// use dark theme if system is in dark mode
// flaky
document.documentElement.setAttribute(
  'data-bs-theme',
  window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'
)