import Vue from 'vue'
import axios from 'axios'

import App from './App.vue'
import router from './router'
import store from './store'
import {
    MdButton,
    MdContent,
    MdTabs,
    MdCard,
    MdField,
    MdElevation,
    MdProgress,
    MdToolbar,
    MdDrawer,
    MdList,
    MdAvatar,
    MdRipple,
    MdDialog,
    MdSpeedDial,
    MdSnackbar,
    MdSubheader
} from 'vue-material/dist/components'

import 'vue-material/dist/vue-material.min.css'
import 'vue-material/dist/theme/default.css'

Vue.config.productionTip = false

Vue.use(MdButton);
Vue.use(MdContent);
Vue.use(MdTabs);
Vue.use(MdCard);
Vue.use(MdField);
Vue.use(MdElevation);
Vue.use(MdProgress);
Vue.use(MdToolbar);
Vue.use(MdDrawer);
Vue.use(MdList);
Vue.use(MdAvatar);
Vue.use(MdRipple);
Vue.use(MdDialog);
Vue.use(MdSpeedDial);
Vue.use(MdSnackbar);
Vue.use(MdSubheader);

Vue.prototype.$api = axios.create({
    baseURL: process.env.VUE_APP_API_LOCATION
});

new Vue({
    router,
    store,
    render: h => h(App),
    created() {
        this.$api.interceptors.response.use(undefined, function (err) {
            return new Promise(function (resolve, reject) {
                if (err.status === 401 && err.config && !err.config.__isRetryRequest) {
                    this.$store.dispatch("performLogout").then(() => {
                        this.$router.push({name: 'Welcome'});
                    });
                }
                reject(err);
            });
        });
        this.$api.interceptors.request.use((config) => {
            if (this.$store && this.$store.getters["auth/isLoggedIn"]) {
                config.headers["Authorization"] = "Bearer " + this.$store.state.auth.token;
            }
            return config;
        })
    }
}).$mount('#app')