From f01f1561373c14fdc5ad71e6ab90d8d9e2c793a6 Mon Sep 17 00:00:00 2001
From: Khoa Nguyen <khoa.tan.nguyen.96@gmail.com>
Date: Mon, 30 Oct 2017 18:20:57 -0700
Subject: [PATCH 1/2] vuex: add mutations/action for getting bands

---
 src/store/index.js | 21 +++++++++++++++++++++
 1 file changed, 21 insertions(+)

diff --git a/src/store/index.js b/src/store/index.js
index be9bcb5..d28b3d0 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -5,6 +5,8 @@ Vue.use(Vuex);
 
 export default new Vuex.Store({
   state: {
+    bands: [],
+    bandCount: 0,
     bandName: null,
     instrument: null,
     user: null,
@@ -18,6 +20,18 @@ export default new Vuex.Store({
       state.instrument = payload.instrument;
       state.user = payload.user;
     },
+    addBand: (state, payload) => {
+      const band = payload.band;
+      if (state.bands.indexOf(band) === -1) {
+        state.bands.push(band);
+      }
+    },
+    updateBandCount: (state, payload) => {
+      const count = payload.count;
+      if (count > 0) {
+        state.bandCount = count;
+      }
+    },
   },
   actions: {
     registerUser({ commit }, payload) {
@@ -34,5 +48,12 @@ export default new Vuex.Store({
         });
       }
     },
+    updateBands({ commit }, payload) {
+      const count = payload.band.count;
+      const bands = payload.band.bands;
+
+      bands.forEach(band => (commit('addBand', { band })));
+      commit('updateBandCount', { count });
+    },
   },
 });

From 3bfb584390b84211b39b1fe951c1e56a2967067b Mon Sep 17 00:00:00 2001
From: Khoa Nguyen <khoa.tan.nguyen.96@gmail.com>
Date: Mon, 30 Oct 2017 18:21:18 -0700
Subject: [PATCH 2/2] attempt to use "sockets" in App.vue

---
 src/App.vue | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/src/App.vue b/src/App.vue
index 02e89b3..99d2e32 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -8,6 +8,14 @@
 <script>
 export default {
   name: 'app',
+  sockets: {
+    'get bands': function (bandObj) {
+      this.$store.dispatch('updateBands', {
+        count: bandObj.count,
+        bands: bandObj.bands,
+      });
+    },
+  },
 };
 </script>