From ee1b858f06fb1afcad817e315f6d97ad14f79171 Mon Sep 17 00:00:00 2001
From: dannc <dannc.sao@gmail.com>
Date: Sat, 16 Mar 2019 09:55:52 +0700
Subject: [PATCH] Add event bus vue component. Refactoring helpers.

---
 src/components/Article/Details.vue       |  2 +-
 src/components/Article/Word/Card.vue     |  2 +-
 src/components/User/ProfileData.vue      | 10 +++++++++-
 src/helpers/index.js                     |  4 ----
 src/main.js                              |  7 +++++--
 src/store/user.js                        |  2 ++
 src/utils/eventBus.js                    | 25 ++++++++++++++++++++++++
 src/{ => utils}/helpers/article.js       |  0
 src/{ => utils}/helpers/formRules.js     |  0
 src/{ => utils}/helpers/word.js          |  0
 src/{helpers/utils.js => utils/index.js} |  7 +++++++
 src/views/SignIn.vue                     |  2 +-
 src/views/SignUp.vue                     |  2 +-
 13 files changed, 52 insertions(+), 11 deletions(-)
 delete mode 100644 src/helpers/index.js
 create mode 100644 src/utils/eventBus.js
 rename src/{ => utils}/helpers/article.js (100%)
 rename src/{ => utils}/helpers/formRules.js (100%)
 rename src/{ => utils}/helpers/word.js (100%)
 rename src/{helpers/utils.js => utils/index.js} (55%)

diff --git a/src/components/Article/Details.vue b/src/components/Article/Details.vue
index f78d11f..3030be2 100644
--- a/src/components/Article/Details.vue
+++ b/src/components/Article/Details.vue
@@ -66,7 +66,7 @@
 <script>
     import { mapGetters } from 'vuex';
     import YoutubeButton from '@/components/Article/YoutubeButton';
-    import { getArticleLevel, declOfNum } from '@/helpers';
+    import { getArticleLevel, declOfNum } from '@/utils';
 
     export default {
         props: {
diff --git a/src/components/Article/Word/Card.vue b/src/components/Article/Word/Card.vue
index c38fb59..1ca1203 100644
--- a/src/components/Article/Word/Card.vue
+++ b/src/components/Article/Word/Card.vue
@@ -39,7 +39,7 @@
 
 <script>
     import { mapGetters } from 'vuex';
-    import { getFullOriginalWord, WORD_TYPES } from '@/helpers';
+    import { getFullOriginalWord, WORD_TYPES } from '@/utils';
 
     export default {
         props: {
diff --git a/src/components/User/ProfileData.vue b/src/components/User/ProfileData.vue
index b2eddd1..75f8db8 100644
--- a/src/components/User/ProfileData.vue
+++ b/src/components/User/ProfileData.vue
@@ -120,7 +120,7 @@
 
 <script>
     import { mapGetters } from 'vuex';
-    import { emailRules, passwordRules, nameRules } from "@/helpers";
+    import { emailRules, passwordRules, nameRules, EVENTS } from "@/utils";
 
     export default {
         data: () => ({
@@ -162,5 +162,13 @@
                 });
             },
         },
+        created() {
+            this.$bus.$on(EVENTS.USER.DATA_CHANGED, () => {
+                this.dialog = false;
+            });
+        },
+        beforeDestroy() {
+            this.$bus.$off(EVENTS.USER.DATA_CHANGED);
+        },
     };
 </script>
diff --git a/src/helpers/index.js b/src/helpers/index.js
deleted file mode 100644
index 8733a98..0000000
--- a/src/helpers/index.js
+++ /dev/null
@@ -1,4 +0,0 @@
-export * from '@/helpers/article';
-export * from '@/helpers/formRules';
-export * from '@/helpers/utils';
-export * from '@/helpers/word';
diff --git a/src/main.js b/src/main.js
index d54b1d6..57d103d 100644
--- a/src/main.js
+++ b/src/main.js
@@ -10,10 +10,11 @@ import 'vuetify/dist/vuetify.min.css';
 import 'material-design-icons-iconfont/dist/material-design-icons.css';
 
 import App from '@/App.vue';
-import router from '@/router';
-import store from '@/store';
 import firebaseConfig from '@/config/firebase';
 import formattedDate from '@/filters/formattedDate';
+import router from '@/router';
+import store from '@/store';
+import { setUpEventBus } from '@/utils';
 
 const firebaseApp = firebase.initializeApp(firebaseConfig);
 const db = firebaseApp.firestore();
@@ -31,6 +32,8 @@ Vue.use(VueYouTubeEmbed);
 
 Vue.filter('formattedDate', formattedDate);
 
+setUpEventBus();
+
 new Vue({
   router,
   store,
diff --git a/src/store/user.js b/src/store/user.js
index d6cd639..8b4782f 100644
--- a/src/store/user.js
+++ b/src/store/user.js
@@ -1,6 +1,7 @@
 import Vue from 'vue';
 import firebase from 'firebase/app';
 import 'firebase/auth';
+import { EventBus, EVENTS } from '@/utils';
 
 export default {
     state: {
@@ -118,6 +119,7 @@ export default {
                 });
 
             await commit('setProcessing', false);
+            await EventBus.notify(EVENTS.USER.DATA_CHANGED);
         },
     },
     getters: {
diff --git a/src/utils/eventBus.js b/src/utils/eventBus.js
new file mode 100644
index 0000000..6290ab0
--- /dev/null
+++ b/src/utils/eventBus.js
@@ -0,0 +1,25 @@
+import Vue from 'vue';
+
+export const EVENTS = {
+    USER: {
+        DATA_CHANGED: 'user-profile-data-changed',
+    },
+};
+
+export const EventBus = new Vue({
+    methods: {
+        notify(eventName, eventPayload) {
+            this.$emit(eventName, eventPayload);
+        },
+    },
+});
+
+export const setUpEventBus = () => {
+    Object.defineProperties(Vue.prototype, {
+        $bus: {
+            get: function() {
+                return EventBus;
+            },
+        },
+    });
+}
\ No newline at end of file
diff --git a/src/helpers/article.js b/src/utils/helpers/article.js
similarity index 100%
rename from src/helpers/article.js
rename to src/utils/helpers/article.js
diff --git a/src/helpers/formRules.js b/src/utils/helpers/formRules.js
similarity index 100%
rename from src/helpers/formRules.js
rename to src/utils/helpers/formRules.js
diff --git a/src/helpers/word.js b/src/utils/helpers/word.js
similarity index 100%
rename from src/helpers/word.js
rename to src/utils/helpers/word.js
diff --git a/src/helpers/utils.js b/src/utils/index.js
similarity index 55%
rename from src/helpers/utils.js
rename to src/utils/index.js
index ee55eb0..0b43e8c 100644
--- a/src/helpers/utils.js
+++ b/src/utils/index.js
@@ -1,4 +1,11 @@
+export * from '@/utils/helpers/article';
+export * from '@/utils/helpers/formRules';
+export * from '@/utils/helpers/word';
+
+export * from '@/utils/eventBus';
+
 export const declOfNum = (number, titles) => {
     const cases = [2, 0, 1, 1, 1, 2];
     return titles[(number % 100 > 4 && number % 100 < 20) ? 2 : cases[(number % 10 < 5) ? number % 10 : 5]];
 };
+
diff --git a/src/views/SignIn.vue b/src/views/SignIn.vue
index 5f8eca0..4cfa50a 100644
--- a/src/views/SignIn.vue
+++ b/src/views/SignIn.vue
@@ -52,7 +52,7 @@
 </template>
 
 <script>
-    import { emailRules, passwordRules } from '@/helpers';
+    import { emailRules, passwordRules } from '@/utils';
 
     export default {
         beforeMount() {
diff --git a/src/views/SignUp.vue b/src/views/SignUp.vue
index 801eee5..9745801 100644
--- a/src/views/SignUp.vue
+++ b/src/views/SignUp.vue
@@ -63,7 +63,7 @@
 </template>
 
 <script>
-    import { emailRules, passwordRules, nameRules } from '@/helpers';
+    import { emailRules, passwordRules, nameRules } from '@/utils';
 
     export default {
         beforeMount() {