Page MenuHomePhorge
Files F85826981

No OneTemporary
Actions

Authored By
Unknown
Size
6 KB
Referenced Files
None
Subscribers
None

View Options

diff --git a/src/components/drafts/drafts.js b/src/components/drafts/drafts.js
index 0fdd962fc1..01a50759a4 100644
--- a/src/components/drafts/drafts.js
+++ b/src/components/drafts/drafts.js
@@ -1,39 +1,34 @@
import Draft from 'src/components/draft/draft.vue'
import List from 'src/components/list/list.vue'
import ConfirmModal from 'src/components/confirm_modal/confirm_modal.vue'
const Drafts = {
components: {
Draft,
List,
ConfirmModal,
},
data() {
return {
showingConfirmDialog: false
}
},
computed: {
drafts() {
return this.$store.getters.draftsArray
},
},
methods: {
abandonAll() {
this.showingConfirmDialog = true
},
doAbandonAll() {
- this.drafts.forEach((draft) => {
- this.$store.dispatch('abandonDraft', { id: draft.id }).then(() => {
- this.hideConfirmDialog()
- })
- })
- this.hideConfirmDialog()
+ this.$store.dispatch('abandonAllDrafts').then(() => this.hideConfirmDialog())
},
hideConfirmDialog() {
this.showingConfirmDialog = false
},
}
}
export default Drafts
diff --git a/src/components/drafts/drafts.vue b/src/components/drafts/drafts.vue
index 3a22969e12..2e3f3432cc 100644
--- a/src/components/drafts/drafts.vue
+++ b/src/components/drafts/drafts.vue
@@ -1,78 +1,78 @@
<template>
<div class="Drafts">
<div class="panel panel-default">
<div class="panel-heading -sticky">
<div class="title">
{{ $t('drafts.drafts') }}
</div>
</div>
<div class="panel-body">
<div
v-if="drafts.length === 0"
class="empty-drafs-list-alert"
>
{{ $t('drafts.no_drafts') }}
</div>
<template v-else>
<List
:items="drafts"
:non-interactive="true"
>
<template #item="{ item: draft }">
<Draft
class="draft"
:draft="draft"
/>
</template>
</List>
<div class="remove-all">
<button
class="btn -danger button-default"
@click="abandonAll"
>
{{ $t('drafts.clean_drafts') }}
</button>
</div>
</template>
</div>
</div>
<teleport to="#modal">
- <confirm-modal
+ <ConfirmModal
v-if="showingConfirmDialog"
:confirm-danger="true"
:title="$t('drafts.abandon_confirm_title')"
:confirm-text="$t('drafts.abandon_confirm_accept_button')"
:cancel-text="$t('drafts.abandon_confirm_cancel_button')"
@accepted="doAbandonAll"
@cancelled="hideConfirmDialog"
>
{{ $t('drafts.abandon_all_confirm') }}
- </confirm-modal>
+ </ConfirmModal>
</teleport>
</div>
</template>
<script src="./drafts.js"></script>
<style lang="scss">
.Drafts {
.draft {
margin: 1em 0;
}
.remove-all {
margin: 1em;
display: flex;
justify-content: center;
}
.empty-drafs-list-alert {
padding: 3em;
font-size: 1.2em;
display: flex;
justify-content: center;
color: var(--textFaint);
}
}
</style>
diff --git a/src/modules/drafts.js b/src/modules/drafts.js
index d16f49e95e..42bb3b3131 100644
--- a/src/modules/drafts.js
+++ b/src/modules/drafts.js
@@ -1,92 +1,99 @@
import { storage } from 'src/lib/storage.js'
export const defaultState = {
drafts: {},
}
export const mutations = {
addOrSaveDraft(state, { draft }) {
state.drafts[draft.id] = draft
},
abandonDraft(state, { id }) {
delete state.drafts[id]
},
loadDrafts(state, data) {
state.drafts = data
},
}
const storageKey = 'pleroma-fe-drafts'
/*
* Note: we do not use the persist state plugin because
* it is not impossible for a user to have two windows at
* the same time. The persist state plugin is just overriding
* everything with the current state. This isn't good because
* if a draft is created in one window and another draft is
* created in another, the draft in the first window will just
* be overriden.
* Here, we can't guarantee 100% atomicity unless one uses
* different keys, which will just pollute the whole storage.
* It is indeed best to have backend support for this.
*/
const getStorageData = async () =>
(await storage.getItem(storageKey)) ||
{
/* no-op */
}
const saveDraftToStorage = async (draft) => {
const currentData = await getStorageData()
currentData[draft.id] = JSON.parse(JSON.stringify(draft))
await storage.setItem(storageKey, currentData)
}
-const deleteDraftFromStorage = async (id) => {
+const deleteDraftFromStorage = async (ids) => {
const currentData = await getStorageData()
- delete currentData[id]
+ ids.forEach(id => {
+ delete currentData[id]
+ })
await storage.setItem(storageKey, currentData)
}
export const actions = {
async addOrSaveDraft(store, { draft }) {
const id = draft.id || new Date().getTime().toString()
const draftWithId = { ...draft, id }
store.commit('addOrSaveDraft', { draft: draftWithId })
await saveDraftToStorage(draftWithId)
return id
},
async abandonDraft(store, { id }) {
store.commit('abandonDraft', { id })
- await deleteDraftFromStorage(id)
+ await deleteDraftFromStorage([id])
+ },
+ async abandonAllDrafts(store) {
+ const ids = Object.keys(store.state.drafts)
+ ids.forEach((id) => store.commit('abandonDraft', { id }))
+ await deleteDraftFromStorage(ids)
},
async loadDrafts(store) {
const currentData = await getStorageData()
store.commit('loadDrafts', currentData)
},
}
export const getters = {
draftsByTypeAndRefId(state) {
return (type, refId) => {
return Object.values(state.drafts).filter(
(draft) => draft.type === type && draft.refId === refId,
)
}
},
draftsArray(state) {
return Object.values(state.drafts)
},
draftCount(state) {
return Object.values(state.drafts).length
},
}
const drafts = {
state: defaultState,
mutations,
getters,
actions,
}
export default drafts

File Metadata

Mime Type
text/x-diff
Expires
Fri, Oct 30, 12:51 PM (20 h, 46 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
1800140
Default Alt Text
(6 KB)

Event Timeline