feat: rework status cache
parent
9978b10e06
commit
0dc515647f
|
@ -12,19 +12,26 @@ const {
|
||||||
}>()
|
}>()
|
||||||
|
|
||||||
let isSending = $ref(false)
|
let isSending = $ref(false)
|
||||||
const storageKey = `elk-draft-${draftKey}`
|
|
||||||
function getDefaultStatus(): CreateStatusParamsWithStatus {
|
function getDefaultStatus(): CreateStatusParamsWithStatus {
|
||||||
return {
|
return {
|
||||||
status: '',
|
status: '',
|
||||||
inReplyToId,
|
inReplyToId,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
let draft = $(useLocalStorage<CreateStatusParamsWithStatus>(storageKey, getDefaultStatus()))
|
const draft = $computed(() => {
|
||||||
let attachments = $(useLocalStorage<Attachment[]>(`${storageKey}-attachments`, []))
|
if (!currentUserDrafts.value[draftKey]) {
|
||||||
|
currentUserDrafts.value[draftKey] = {
|
||||||
|
params: getDefaultStatus(),
|
||||||
|
attachments: [],
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return currentUserDrafts.value[draftKey]
|
||||||
|
})
|
||||||
|
|
||||||
const status = $computed(() => {
|
const status = $computed(() => {
|
||||||
return {
|
return {
|
||||||
...draft,
|
...draft.params,
|
||||||
mediaIds: attachments.map(a => a.id),
|
mediaIds: draft.attachments.map(a => a.id),
|
||||||
} as CreateStatusParams
|
} as CreateStatusParams
|
||||||
})
|
})
|
||||||
|
|
||||||
|
@ -65,21 +72,21 @@ async function uploadAttachments(files: File[]) {
|
||||||
const attachment = await masto.mediaAttachments.create({
|
const attachment = await masto.mediaAttachments.create({
|
||||||
file,
|
file,
|
||||||
})
|
})
|
||||||
attachments.push(attachment)
|
draft.attachments.push(attachment)
|
||||||
}
|
}
|
||||||
isUploading = false
|
isUploading = false
|
||||||
}
|
}
|
||||||
|
|
||||||
function removeAttachment(index: number) {
|
function removeAttachment(index: number) {
|
||||||
attachments.splice(index, 1)
|
draft.attachments.splice(index, 1)
|
||||||
}
|
}
|
||||||
|
|
||||||
async function publish() {
|
async function publish() {
|
||||||
try {
|
try {
|
||||||
isSending = true
|
isSending = true
|
||||||
await masto.statuses.create(status)
|
await masto.statuses.create(status)
|
||||||
draft = getDefaultStatus()
|
draft.params = getDefaultStatus()
|
||||||
attachments = []
|
draft.attachments = []
|
||||||
}
|
}
|
||||||
finally {
|
finally {
|
||||||
isSending = false
|
isSending = false
|
||||||
|
@ -87,11 +94,9 @@ async function publish() {
|
||||||
}
|
}
|
||||||
|
|
||||||
onUnmounted(() => {
|
onUnmounted(() => {
|
||||||
if (!draft.status) {
|
if (!draft.attachments.length && !draft.params.status) {
|
||||||
// @ts-expect-error draft cannot be undefined
|
|
||||||
draft = undefined
|
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
localStorage.removeItem(storageKey)
|
delete currentUserDrafts.value[draftKey]
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
@ -103,7 +108,7 @@ onUnmounted(() => {
|
||||||
:class="isSending ? 'pointer-events-none' : ''"
|
:class="isSending ? 'pointer-events-none' : ''"
|
||||||
>
|
>
|
||||||
<textarea
|
<textarea
|
||||||
v-model="draft.status"
|
v-model="draft.params.status"
|
||||||
:placeholder="placeholder"
|
:placeholder="placeholder"
|
||||||
p2 border-rounded w-full h-40
|
p2 border-rounded w-full h-40
|
||||||
bg-gray:10 outline-none border="~ base"
|
bg-gray:10 outline-none border="~ base"
|
||||||
|
@ -118,7 +123,7 @@ onUnmounted(() => {
|
||||||
|
|
||||||
<div flex="~ col gap-2" max-h-50vh overflow-auto>
|
<div flex="~ col gap-2" max-h-50vh overflow-auto>
|
||||||
<publish-attachment
|
<publish-attachment
|
||||||
v-for="(att, idx) in attachments" :key="att.id"
|
v-for="(att, idx) in draft.attachments" :key="att.id"
|
||||||
:attachment="att"
|
:attachment="att"
|
||||||
@remove="removeAttachment(idx)"
|
@remove="removeAttachment(idx)"
|
||||||
/>
|
/>
|
||||||
|
@ -132,7 +137,7 @@ onUnmounted(() => {
|
||||||
<div flex justify-end>
|
<div flex justify-end>
|
||||||
<button
|
<button
|
||||||
btn-solid
|
btn-solid
|
||||||
:disabled="isUploading || (attachments.length === 0 && !draft.status)"
|
:disabled="isUploading || (draft.attachments.length === 0 && !draft.params.status)"
|
||||||
@click="publish"
|
@click="publish"
|
||||||
>
|
>
|
||||||
Publish!
|
Publish!
|
||||||
|
|
|
@ -0,0 +1,18 @@
|
||||||
|
import type { Attachment, CreateStatusParamsWithStatus } from 'masto'
|
||||||
|
import { STORAGE_KEY_DRAFTS } from '~/constants'
|
||||||
|
|
||||||
|
export type DraftMap = Record<string, {
|
||||||
|
params: CreateStatusParamsWithStatus
|
||||||
|
attachments: Attachment[]
|
||||||
|
}>
|
||||||
|
|
||||||
|
const allDrafts = useLocalStorage<Record<string, DraftMap>>(STORAGE_KEY_DRAFTS, {})
|
||||||
|
|
||||||
|
export const currentUserDrafts = computed(() => {
|
||||||
|
if (!currentUser.value?.account?.id)
|
||||||
|
return {}
|
||||||
|
const id = `${currentUser.value.account.acct}@${currentUser.value.server}`
|
||||||
|
if (!allDrafts.value[id])
|
||||||
|
allDrafts.value[id] = {}
|
||||||
|
return allDrafts.value[id]
|
||||||
|
})
|
Loading…
Reference in New Issue