Merge pull request #16 from deanfchung/master

User can delete routes now.

Author: deanfchung

src/components/HomeSideDropDown.vue

@@ -137,5 +137,4 @@ export default {
 .input-container {
     margin-top: 1rem;
   }
-
 </style>

src/components/RouteDisplay.vue

@@ -36,12 +36,13 @@ export default {
     }
   },
   methods: {
-    ...mapActions(['addRouteToRouteMap']),
+    ...mapActions(['addRouteToRouteMap', 'setRoutes']),
     handleEnterKeyPress () {
       this.addRouteToRouteMap(this.newRoute)
         .then(() => {
           this.newRoute = ''
         })
+
         .catch(err => console.log(err))
     }
   }

src/components/Routes.vue

@@ -6,6 +6,7 @@
       v-for="route in Object.keys(routes)"
       :key="route"
       @click="handleClick(route)"
+      v-on:keyup.delete="deleteSelectedRoute(route)"
     >
 <!--
       <span class="panel-icon">
@@ -34,9 +35,13 @@ export default {
     ...mapState(['routes', 'activeRoute'])
   },
   methods: {
-    ...mapActions(['setActiveRoute']),
+    ...mapActions(['setActiveRoute', 'deleteRoute']),
     handleClick (route) {
       this.setActiveRoute(route)
+    },
+    deleteSelectedRoute (route) {
+      this.deleteRoute(route)
+      this.setActiveRoute('')
     }
   }
 }

src/store/actions.js

@@ -112,6 +112,10 @@ const actions = {
   },
   [types.parentSelected]: ({ commit }, payload) => {
     commit(types.PARENT_SELECTED, payload)
+  },
+  [types.deleteRoute]: ({ state, commit }, payload) => {
+    console.log('stat in actions:', state)
+    commit(types.DELETE_ROUTE, payload)
   }
 }
 

src/store/mutations.js

@@ -103,6 +103,7 @@ const mutations = {
       ...state.routes,
       [payload]: []
     }
+    console.log('payload in add_route', payload)
   },
   // Changes the component map
   [types.ADD_ROUTE_TO_COMPONENT_MAP]: (state, payload) => {
@@ -128,6 +129,7 @@ const mutations = {
     state.activeComponent = payload
   },
   [types.SET_ROUTES]: (state, payload) => {
+    console.log('setroutespayload:', payload)
     state.routes = Object.assign({}, payload)
   },
   // invoked when a component is deleted
@@ -179,6 +181,13 @@ const mutations = {
   },
   [types.PARENT_SELECTED]: (state, payload) => {
     state.parentSelected = payload
+  },
+  [types.DELETE_ROUTE]: (state, payload) => {
+    const stateCopy = state
+    delete stateCopy.routes[payload]
+    delete stateCopy.componentMap[payload]
+    state = stateCopy
+    console.log('aftermutations state', state)
   }
 }
 

src/store/types.js

@@ -39,6 +39,7 @@ export const ADD_COMPONENT_TO_COMPONENT_CHILDREN =
   'ADD_COMPONENT_TO_COMPONENT_CHILDREN'
 export const UPDATE_OPEN_MODAL = 'UPDATE_OPEN_MODAL'
 export const PARENT_SELECTED = 'PARENT_SELECTED'
+export const DELETE_ROUTE = 'DELETE_ROUTE'
 
 // Actions
 export const registerComponent = 'registerComponent'
@@ -71,3 +72,4 @@ export const updateComponentChildrenValue = 'updateComponentChildrenValue'
 export const updateComponentNameInputValue = 'updateComponentNameInputValue'
 export const updateOpenModal = 'updateOpenModal'
 export const parentSelected = 'parentSelected'
+export const deleteRoute = 'deleteRoute'