From 84c6319a1f7955b616b9f5ae1849863814531145 Mon Sep 17 00:00:00 2001
From: Angelina Filippova <linakirsanova@gmail.com>
Date: Wed, 24 Jun 2020 21:13:31 +0300
Subject: [PATCH] Update function that saves active tabs in state

---
 src/store/modules/emojiPacks.js                     | 10 +++++-----
 src/views/emojiPacks/components/RemoteEmojiPack.vue |  2 +-
 src/views/emojiPacks/index.vue                      | 11 +++++------
 3 files changed, 11 insertions(+), 12 deletions(-)

diff --git a/src/store/modules/emojiPacks.js b/src/store/modules/emojiPacks.js
index 4d378508..ec2d6f04 100644
--- a/src/store/modules/emojiPacks.js
+++ b/src/store/modules/emojiPacks.js
@@ -19,7 +19,7 @@ import Vue from 'vue'
 
 const emojiPacks = {
   state: {
-    activeCollapseItems: [],
+    activeTab: '',
     currentFilesPage: 1,
     currentPage: 1,
     filesPageSize: 30,
@@ -31,8 +31,8 @@ const emojiPacks = {
     remotePacks: {}
   },
   mutations: {
-    SET_ACTIVE_COLLAPSE_ITEMS: (state, items) => {
-      state.activeCollapseItems = items
+    SET_ACTIVE_TAB: (state, tab) => {
+      state.activeTab = tab
     },
     SET_FILES_COUNT: (state, count) => {
       state.localPackFilesCount = count
@@ -177,8 +177,8 @@ const emojiPacks = {
         commit('UPDATE_LOCAL_PACK_PACK', { name: packName, pack: result.data })
       }
     },
-    SetActiveCollapseItems({ commit }, activeItems) {
-      commit('SET_ACTIVE_COLLAPSE_ITEMS', activeItems)
+    SetActiveTab({ commit }, activeTab) {
+      commit('SET_ACTIVE_TAB', activeTab)
     },
     async SetRemoteEmojiPacks({ commit, getters }, { remoteInstance }) {
       const { data } = await listRemotePacks(getters.authHost, getters.token, remoteInstance)
diff --git a/src/views/emojiPacks/components/RemoteEmojiPack.vue b/src/views/emojiPacks/components/RemoteEmojiPack.vue
index c83db513..532095df 100644
--- a/src/views/emojiPacks/components/RemoteEmojiPack.vue
+++ b/src/views/emojiPacks/components/RemoteEmojiPack.vue
@@ -114,7 +114,7 @@ export default {
       }
     },
     loadRemotePack() {
-      return this.$store.state.emojiPacks.activeCollapseItems.includes(this.name)
+      return this.$store.state.emojiPacks.activeTab === this.name
     },
     remoteInstanceAddress() {
       return this.$store.state.emojiPacks.remoteInstance
diff --git a/src/views/emojiPacks/index.vue b/src/views/emojiPacks/index.vue
index 1b004e64..1475ad4f 100644
--- a/src/views/emojiPacks/index.vue
+++ b/src/views/emojiPacks/index.vue
@@ -32,7 +32,7 @@
             </div>
           </el-form-item>
           <el-form-item v-if="Object.keys(localPacks).length > 0" :label="$t('emoji.packs')">
-            <el-collapse v-for="(pack, name) in localPacks" :key="name" v-model="activeLocalPack" accordion @change="setActiveCollapseItems">
+            <el-collapse v-for="(pack, name) in localPacks" :key="name" v-model="activeLocalPack" accordion @change="setActiveTab">
               <local-emoji-pack :name="name" :pack="pack" :host="$store.getters.authHost" :is-local="true" />
             </el-collapse>
           </el-form-item>
@@ -65,8 +65,8 @@
             </div>
           </el-form-item>
           <el-form-item v-if="Object.keys(remotePacks).length > 0" :label="$t('emoji.packs')">
-            <el-collapse v-for="(pack, name) in remotePacks" :key="name" v-model="activeRemotePack" @change="setActiveCollapseItems">
-              <remote-emoji-pack :name="name" :pack="sortPack(pack)" :host="$store.getters.authHost" :is-local="false" />
+            <el-collapse v-for="(pack, name) in remotePacks" :key="name" v-model="activeRemotePack" accordion @change="setActiveTab">
+              <remote-emoji-pack :name="name" :pack="pack" :host="$store.getters.authHost" :is-local="false" />
             </el-collapse>
           </el-form-item>
         </el-form>
@@ -184,9 +184,8 @@ export default {
         message: i18n.t('emoji.reloaded')
       })
     },
-    setActiveCollapseItems(activeItems) {
-      const items = Array.isArray(activeItems) ? activeItems : [activeItems]
-      this.$store.dispatch('SetActiveCollapseItems', items)
+    setActiveTab(activeTab) {
+      this.$store.dispatch('SetActiveTab', activeTab)
     }
   }
 }
-- 
GitLab