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

import RecipeEdit from './components/RecipeEdit';
import RecipeShow from './components/RecipeShow';
import The404Page from './components/The404Page';
import TheAboutPage from './components/TheAboutPage';
import TheCalculator from './components/TheCalculator';
import TheIngredientList from './components/TheIngredientList';
import TheNotesList from './components/TheNotesList';
import TheRecipeList from './components/TheRecipeList';

Vue.use(Router);

export default new Router({
  routes: [
    {
      path: '/',
      name: 'recipeList',
      component: TheRecipeList
    },
    {
      path: '/recipes/:id/edit',
      name: 'edit_recipe',
      component: RecipeEdit
    },
    {
      path: '/recipe/:id',
      name: 'recipe',
      component: RecipeShow
    },
    {
      path: "/about",
      name: "about",
      component: TheAboutPage
    },
    {
      path: "/calculator",
      name: "calculator",
      component: TheCalculator
    },
    {
      path: "/ingredients",
      name: "ingredients",
      component: TheIngredientList
    },
    {
      path: "/notes",
      name: "notes",
      component: TheNotesList
    },
    {
      path: '*',
      component: The404Page
    }
  ]
})