From cd14566a34013e65b603a71208d058871e992956 Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Fri, 9 Aug 2019 23:28:46 -0400
Subject: remove useless index param of onSwitch

---
 src/components/tab_switcher/tab_switcher.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/components/tab_switcher/tab_switcher.js')

diff --git a/src/components/tab_switcher/tab_switcher.js b/src/components/tab_switcher/tab_switcher.js
index a5fe019c..ff99e3e7 100644
--- a/src/components/tab_switcher/tab_switcher.js
+++ b/src/components/tab_switcher/tab_switcher.js
@@ -20,7 +20,7 @@ export default Vue.component('tab-switcher', {
     activateTab (index, dataset) {
       return () => {
         if (typeof this.onSwitch === 'function') {
-          this.onSwitch.call(null, index, this.$slots.default[index].elm.dataset)
+          this.onSwitch.call(null, this.$slots.default[index].elm.dataset)
         }
         this.active = index
       }
-- 
cgit v1.2.3-70-g09d2


From df3e80b7c3fc91cbd62764be467d1dfe28b4b299 Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Fri, 9 Aug 2019 23:48:08 -0400
Subject: use key prop instead of dataset to identify active tab

---
 src/components/interactions/interactions.js  | 4 ++--
 src/components/interactions/interactions.vue | 9 +++------
 src/components/search/search.js              | 4 ++--
 src/components/search/search.vue             | 9 +++------
 src/components/tab_switcher/tab_switcher.js  | 2 +-
 5 files changed, 11 insertions(+), 17 deletions(-)

(limited to 'src/components/tab_switcher/tab_switcher.js')

diff --git a/src/components/interactions/interactions.js b/src/components/interactions/interactions.js
index 90dbd76b..1f8a9de9 100644
--- a/src/components/interactions/interactions.js
+++ b/src/components/interactions/interactions.js
@@ -13,8 +13,8 @@ const Interactions = {
     }
   },
   methods: {
-    onModeSwitch (dataset) {
-      this.filterMode = tabModeDict[dataset.filter]
+    onModeSwitch (key) {
+      this.filterMode = tabModeDict[key]
     }
   },
   components: {
diff --git a/src/components/interactions/interactions.vue b/src/components/interactions/interactions.vue
index d71c99d5..08cee343 100644
--- a/src/components/interactions/interactions.vue
+++ b/src/components/interactions/interactions.vue
@@ -10,18 +10,15 @@
       :on-switch="onModeSwitch"
     >
       <span
-        data-tab-dummy
-        data-filter="mentions"
+        key="mentions"
         :label="$t('nav.mentions')"
       />
       <span
-        data-tab-dummy
-        data-filter="likes+repeats"
+        key="likes+repeats"
         :label="$t('interactions.favs_repeats')"
       />
       <span
-        data-tab-dummy
-        data-filter="follows"
+        key="follows"
         :label="$t('interactions.follows')"
       />
     </tab-switcher>
diff --git a/src/components/search/search.js b/src/components/search/search.js
index 37940f34..8e903052 100644
--- a/src/components/search/search.js
+++ b/src/components/search/search.js
@@ -75,8 +75,8 @@ const Search = {
       const length = this[tabName].length
       return length === 0 ? '' : ` (${length})`
     },
-    onResultTabSwitch (dataset) {
-      this.currenResultTab = dataset.filter
+    onResultTabSwitch (key) {
+      this.currenResultTab = key
     },
     getActiveTab () {
       if (this.visibleStatuses.length > 0) {
diff --git a/src/components/search/search.vue b/src/components/search/search.vue
index 4350e672..eb20973b 100644
--- a/src/components/search/search.vue
+++ b/src/components/search/search.vue
@@ -34,18 +34,15 @@
           :custom-active="currenResultTab"
         >
           <span
-            data-tab-dummy
-            data-filter="statuses"
+            key="statuses"
             :label="$t('user_card.statuses') + resultCount('visibleStatuses')"
           />
           <span
-            data-tab-dummy
-            data-filter="people"
+            key="people"
             :label="$t('search.people') + resultCount('users')"
           />
           <span
-            data-tab-dummy
-            data-filter="hashtags"
+            key="hashtags"
             :label="$t('search.hashtags') + resultCount('hashtags')"
           />
         </tab-switcher>
diff --git a/src/components/tab_switcher/tab_switcher.js b/src/components/tab_switcher/tab_switcher.js
index ff99e3e7..b26040ff 100644
--- a/src/components/tab_switcher/tab_switcher.js
+++ b/src/components/tab_switcher/tab_switcher.js
@@ -20,7 +20,7 @@ export default Vue.component('tab-switcher', {
     activateTab (index, dataset) {
       return () => {
         if (typeof this.onSwitch === 'function') {
-          this.onSwitch.call(null, this.$slots.default[index].elm.dataset)
+          this.onSwitch.call(null, this.$slots.default[index].key)
         }
         this.active = index
       }
-- 
cgit v1.2.3-70-g09d2


From 9dd9ba0205cde312f78c510188c98f2be5cf6b2c Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Fri, 9 Aug 2019 23:48:33 -0400
Subject: remove unused param

---
 src/components/tab_switcher/tab_switcher.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/components/tab_switcher/tab_switcher.js')

diff --git a/src/components/tab_switcher/tab_switcher.js b/src/components/tab_switcher/tab_switcher.js
index b26040ff..e0d4572c 100644
--- a/src/components/tab_switcher/tab_switcher.js
+++ b/src/components/tab_switcher/tab_switcher.js
@@ -17,7 +17,7 @@ export default Vue.component('tab-switcher', {
     }
   },
   methods: {
-    activateTab (index, dataset) {
+    activateTab (index) {
       return () => {
         if (typeof this.onSwitch === 'function') {
           this.onSwitch.call(null, this.$slots.default[index].key)
-- 
cgit v1.2.3-70-g09d2


From eafd53f99429b6b0b314b9ae873f642a34167a6c Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Sat, 10 Aug 2019 00:25:09 -0400
Subject: fix potential bug to render active tab in controlled way

---
 src/components/tab_switcher/tab_switcher.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/components/tab_switcher/tab_switcher.js')

diff --git a/src/components/tab_switcher/tab_switcher.js b/src/components/tab_switcher/tab_switcher.js
index e0d4572c..816d61eb 100644
--- a/src/components/tab_switcher/tab_switcher.js
+++ b/src/components/tab_switcher/tab_switcher.js
@@ -71,7 +71,7 @@ export default Vue.component('tab-switcher', {
 
     const contents = this.$slots.default.map((slot, index) => {
       if (!slot.tag) return
-      const active = index === this.active
+      const active = this.isActiveTab(index)
       if (this.renderOnlyFocused) {
         return active
           ? <div class="active">{slot}</div>
-- 
cgit v1.2.3-70-g09d2


From 6e51774ccbc2628177b43126f089cfdc24acf713 Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Sat, 10 Aug 2019 00:26:29 -0400
Subject: use better name of controlled prop

---
 src/components/search/search.vue            |  2 +-
 src/components/tab_switcher/tab_switcher.js | 18 +++++++++---------
 2 files changed, 10 insertions(+), 10 deletions(-)

(limited to 'src/components/tab_switcher/tab_switcher.js')

diff --git a/src/components/search/search.vue b/src/components/search/search.vue
index eb20973b..746bbaa2 100644
--- a/src/components/search/search.vue
+++ b/src/components/search/search.vue
@@ -31,7 +31,7 @@
         <tab-switcher
           ref="tabSwitcher"
           :on-switch="onResultTabSwitch"
-          :custom-active="currenResultTab"
+          :active-tab="currenResultTab"
         >
           <span
             key="statuses"
diff --git a/src/components/tab_switcher/tab_switcher.js b/src/components/tab_switcher/tab_switcher.js
index 816d61eb..f11d96e6 100644
--- a/src/components/tab_switcher/tab_switcher.js
+++ b/src/components/tab_switcher/tab_switcher.js
@@ -4,7 +4,7 @@ import './tab_switcher.scss'
 
 export default Vue.component('tab-switcher', {
   name: 'TabSwitcher',
-  props: ['renderOnlyFocused', 'onSwitch', 'customActive'],
+  props: ['renderOnlyFocused', 'onSwitch', 'activeTab'],
   data () {
     return {
       active: this.$slots.default.findIndex(_ => _.tag)
@@ -26,12 +26,12 @@ export default Vue.component('tab-switcher', {
       }
     },
     isActiveTab (index) {
-      const customActiveIndex = this.$slots.default.findIndex(slot => {
-        const dataFilter = slot.data && slot.data.attrs && slot.data.attrs['data-filter']
-        return this.customActive && this.customActive === dataFilter
-      })
-
-      return customActiveIndex > -1 ? customActiveIndex === index : index === this.active
+      // In case of controlled component
+      if (this.activeTab) {
+        return this.$slots.default.findIndex(slot => this.activeTab === slot.key) === index
+      } else {
+        return this.active === index
+      }
     }
   },
   render (h) {
@@ -47,7 +47,7 @@ export default Vue.component('tab-switcher', {
         }
         if (slot.data.attrs.image) {
           return (
-            <div class={ classesWrapper.join(' ')}>
+            <div class={classesWrapper.join(' ')}>
               <button
                 disabled={slot.data.attrs.disabled}
                 onClick={this.activateTab(index)}
@@ -59,7 +59,7 @@ export default Vue.component('tab-switcher', {
           )
         }
         return (
-          <div class={ classesWrapper.join(' ')}>
+          <div class={classesWrapper.join(' ')}>
             <button
               disabled={slot.data.attrs.disabled}
               onClick={this.activateTab(index)}
-- 
cgit v1.2.3-70-g09d2


From e8c22fbfa37afc0cc7466309f8a2d059d7ddd6c3 Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Sat, 10 Aug 2019 14:48:05 -0400
Subject: refactor TabSwitcher

---
 src/components/tab_switcher/tab_switcher.js | 22 ++++++++++++----------
 1 file changed, 12 insertions(+), 10 deletions(-)

(limited to 'src/components/tab_switcher/tab_switcher.js')

diff --git a/src/components/tab_switcher/tab_switcher.js b/src/components/tab_switcher/tab_switcher.js
index f11d96e6..08d5d08f 100644
--- a/src/components/tab_switcher/tab_switcher.js
+++ b/src/components/tab_switcher/tab_switcher.js
@@ -10,6 +10,16 @@ export default Vue.component('tab-switcher', {
       active: this.$slots.default.findIndex(_ => _.tag)
     }
   },
+  computed: {
+    activeIndex () {
+      // In case of controlled component
+      if (this.activeTab) {
+        return this.$slots.default.findIndex(slot => this.activeTab === slot.key)
+      } else {
+        return this.active
+      }
+    }
+  },
   beforeUpdate () {
     const currentSlot = this.$slots.default[this.active]
     if (!currentSlot.tag) {
@@ -24,14 +34,6 @@ export default Vue.component('tab-switcher', {
         }
         this.active = index
       }
-    },
-    isActiveTab (index) {
-      // In case of controlled component
-      if (this.activeTab) {
-        return this.$slots.default.findIndex(slot => this.activeTab === slot.key) === index
-      } else {
-        return this.active === index
-      }
     }
   },
   render (h) {
@@ -41,7 +43,7 @@ export default Vue.component('tab-switcher', {
         const classesTab = ['tab']
         const classesWrapper = ['tab-wrapper']
 
-        if (this.isActiveTab(index)) {
+        if (this.activeIndex === index) {
           classesTab.push('active')
           classesWrapper.push('active')
         }
@@ -71,7 +73,7 @@ export default Vue.component('tab-switcher', {
 
     const contents = this.$slots.default.map((slot, index) => {
       if (!slot.tag) return
-      const active = this.isActiveTab(index)
+      const active = this.activeIndex === index
       if (this.renderOnlyFocused) {
         return active
           ? <div class="active">{slot}</div>
-- 
cgit v1.2.3-70-g09d2