import Vue from 'vue'
import Router from 'vue-router'

import Index from './routes/Index'
import NotFound from './routes/NotFound'
import Recipes from './routes/Recipes'
import Planning from './routes/Planning'

import RecipeDetails from './components/recipes/RecipeDetails'
import RecipeList from './components/recipes/RecipeList'
import CategoryTabs from './components/CategoryTabs'

Vue.use(Router)

const router = new Router({
  routes: [
    { path: '/',
      component: Index,
      meta: { title: "Home", icon: "home" }
    },

    { path: '/recipes',
      components: { default: Recipes,
                    extension: CategoryTabs, },
      meta: { title: "Recettes",
              icon:"book" },
      children: [
        { path: 'id/:id',
            component: RecipeDetails,
            meta: { subtitle: "Détails", } },
        { path: 'category/:cat',
            component: RecipeList,
            meta: { subtitle: "Liste", } },
        { path: '*',
            component: NotFound }
      ]
    },

    { path: '/planning',
      component: Planning,
      meta: { title: "Menu", icon: "calendar_today" },
    }
  ]
})

export default router