Merge branch 'fix/get-remote-packs' into 'develop'

Fix for closing emoji packs panels when switching between panels

Closes #152

See merge request pleroma/admin-fe!189
This commit is contained in:
Angelina Filippova 2020-12-23 19:25:40 +00:00
commit 0e36395a3e
4 changed files with 30 additions and 17 deletions

View file

@ -29,6 +29,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
- Allow using underscores and hyphens in new account's usernames
- Fix wrapping `:icons` setting and parsing tuples in settings with key `:headers`
- Update keys for Pleroma.Web.Plugs.RemoteIp and PurgeExpiredActivity settings
- Update switching between local and remote emoji packs panels: the panel with the pack's metadata will be closed when another panel is opened
## [2.2] - 2020-11-18

View file

@ -19,7 +19,6 @@ import Vue from 'vue'
const emojiPacks = {
state: {
activeTab: '',
currentLocalFilesPage: 1,
currentLocalPacksPage: 1,
currentRemoteFilesPage: 1,
@ -35,9 +34,6 @@ const emojiPacks = {
remotePacksCount: 0
},
mutations: {
SET_ACTIVE_TAB: (state, tab) => {
state.activeTab = tab
},
SET_LOCAL_FILES_COUNT: (state, count) => {
state.localPackFilesCount = count
},
@ -205,9 +201,6 @@ const emojiPacks = {
commit('UPDATE_LOCAL_PACK_PACK', { name: packName, pack: result.data })
}
},
SetActiveTab({ commit }, activeTab) {
commit('SET_ACTIVE_TAB', activeTab)
},
async SetRemoteEmojiPacks({ commit, getters, state }, { page, remoteInstance }) {
const { data } = await listRemotePacks(remoteInstance, page, state.pageSize, getters.authHost, getters.token)
const { packs, count } = data

View file

@ -81,6 +81,10 @@ import SingleEmojiEditor from './SingleEmojiEditor.vue'
export default {
components: { SingleEmojiEditor },
props: {
activeTab: {
type: String,
required: true
},
name: {
type: String,
required: true
@ -130,7 +134,7 @@ export default {
}
},
loadRemotePack() {
return this.$store.state.emojiPacks.activeTab === this.name
return this.activeTab === this.name
},
pageSize() {
return this.$store.state.emojiPacks.filesPageSize
@ -199,6 +203,9 @@ export default {
}
},
methods: {
collapse() {
this.showPackContent = []
},
downloadFromInstance() {
this.$store.dispatch(
'DownloadFrom',

View file

@ -33,7 +33,7 @@
<span class="emoji-name-warning">{{ $t('emoji.emojiWarning') }}</span>
</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="setActiveTab">
<el-collapse v-for="(pack, name) in localPacks" :key="name" v-model="activeLocalPack" accordion @change="closeRemoteTabs">
<local-emoji-pack ref="localEmojiPack" :name="name" :pack="pack" :host="$store.getters.authHost" :is-local="true" />
</el-collapse>
</el-form-item>
@ -66,8 +66,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" accordion @change="setActiveTab">
<remote-emoji-pack :name="name" :pack="pack" :host="$store.getters.authHost" :is-local="false" />
<el-collapse v-for="(pack, name) in remotePacks" :key="name" v-model="activeRemotePack" accordion @change="closeLocalTabs">
<remote-emoji-pack ref="remoteEmojiPack" :active-tab="activeRemotePack" :name="name" :pack="pack" :host="$store.getters.authHost" :is-local="false" />
</el-collapse>
</el-form-item>
</el-form>
@ -98,8 +98,8 @@ export default {
return {
activeTab: 'local',
newPackName: '',
activeLocalPack: [],
activeRemotePack: [],
activeLocalPack: '',
activeRemotePack: '',
fullscreenLoading: false
}
},
@ -155,6 +155,22 @@ export default {
this.refreshLocalPacks()
},
methods: {
closeLocalTabs() {
this.collapseExistingEmojis()
this.activeLocalPack = ''
},
closeRemoteTabs() {
this.collapseExistingEmojis()
this.activeRemotePack = ''
},
collapseExistingEmojis() {
if (this.$refs.localEmojiPack && this.$refs.localEmojiPack.length > 0) {
this.$refs.localEmojiPack.forEach(el => el.collapse())
}
if (this.$refs.remoteEmojiPack && this.$refs.remoteEmojiPack.length > 0) {
this.$refs.remoteEmojiPack.forEach(el => el.collapse())
}
},
createLocalPack() {
this.$store.dispatch('CreatePack', { name: this.newPackName })
.then(() => {
@ -203,10 +219,6 @@ export default {
type: 'success',
message: i18n.t('emoji.reloaded')
})
},
setActiveTab(activeTab) {
this.$refs.localEmojiPack.forEach(el => el.collapse())
this.$store.dispatch('SetActiveTab', activeTab)
}
}
}