import Vue from 'vue';
import VueRouter from 'vue-router';
import sync from 'vuex-router-sync';

import store from './vuex/store.js';
import * as actions from './vuex/actions.js';

import App from './app.vue';
import FeatureList from './components/featurelist.vue';
import FeatureForm from './components/featureform.vue';

Vue.use(VueRouter);

let router = new VueRouter({
    linkActiveClass: 'active'
});

router.map({
    '/list': {
        component: FeatureList,
        name: 'list-all'
    },
    '/new': {
        component: FeatureForm,
        name: 'new-feature'
    }
});

/* Bootstrap the application */
router.start({
    template: '<div><app></app></div>',
    store,
    components: {App},
    vuex: {
        actions
    },
    compiled() {
        this.fetchFeatures();
        this.fetchClients();
        this.fetchProductAreas();
    }
}, '#app');

router.redirect({
    '*': '/list'
});

/* sync route info to store */
sync(store, router);

@@ -59,20 +59,22 @@
 %0Aimport 
+%7B
 sync
+%7D
  from 'v
@@ -399,24 +399,77 @@
 ctive'%0A%7D);%0A%0A
+/* sync route info to store */%0Async(store, router);%0A%0A
 router.map(%7B
@@ -961,57 +961,4 @@
 %7D);%0A
-%0A/* sync route info to store */%0Async(store, router);%0A

store and router must be synced before starting app