refactor: separate dialog and edit drafts

components/modal/ModalContainer.vue

@@ -16,7 +16,7 @@ import {
     <HelpPreview @close="closePreviewHelp()" />
   </ModalDialog>
   <ModalDialog v-model="isPublishDialogOpen">
-    <PublishWidget draft-key="dialog" expanded min-w-180 />
+    <PublishWidget :draft-key="dialogDraftKey" expanded min-w-180 />
   </ModalDialog>
   <ModalDialog v-model="isImagePreviewDialogOpen">
     <img :src="imagePreview.src" :alt="imagePreview.alt" max-w-95vw max-h-95vh>

components/publish/PublishButton.vue

@@ -1,8 +1,6 @@
 <script setup lang="ts">
 function openDialog() {
-  if (dialogDraft.draft.value.editingStatus)
-    openPublishDialog(getDefaultDraft())
-  else openPublishDialog()
+  openPublishDialog()
 }
 </script>
 

components/status/StatusActions.vue

@@ -102,17 +102,14 @@ const deleteAndRedraft = async () => {
     // TODO confirm to overwrite
   }
 
-  openPublishDialog({
+  openPublishDialog('dialog', {
     params: { ...getParamsFromStatus(status), status: text! },
     attachments: [],
   })
 }
 
 function editStatus() {
-  if (!dialogDraft.isEmpty) {
-    // TODO confirm to overwrite
-  }
-  openPublishDialog({
+  openPublishDialog(`edit-${status.id}`, {
     editingStatus: status,
     params: getParamsFromStatus(status),
     attachments: [],

composables/dialog.ts

@@ -4,6 +4,7 @@ import { STORAGE_KEY_FIRST_VISIT, STORAGE_KEY_ZEN_MODE } from '~/constants'
 
 export const imagePreview = ref({ src: '', alt: '' })
 export const statusEdit = ref<StatusEdit>()
+export const dialogDraftKey = ref<string>()
 export const isFirstVisit = useLocalStorage(STORAGE_KEY_FIRST_VISIT, true)
 export const isZenMode = useLocalStorage(STORAGE_KEY_ZEN_MODE, false)
 export const toggleZenMode = useToggle(isZenMode)
@@ -18,9 +19,10 @@ export function openSigninDialog() {
   isSigninDialogOpen.value = true
 }
 
-export function openPublishDialog(draft?: Draft) {
+export function openPublishDialog(draftKey = 'dialog', draft?: Draft) {
+  dialogDraftKey.value = draftKey
   if (draft)
-    dialogDraft.draft.value = draft
+    currentUserDrafts.value[draftKey] = draft
   isPublishDialogOpen.value = true
 }
 

composables/statusDrafts.ts

@@ -69,11 +69,13 @@ export function useDraft(draftKey: string, inReplyToId?: string) {
 export const dialogDraft = useDraft('dialog')
 
 export function mentionUser(account: Account) {
-  openPublishDialog(getDefaultDraft({ status: `@${account.acct} ` }))
+  openPublishDialog('dialog', getDefaultDraft({
+    status: `@${account.acct} `,
+  }))
 }
 
 export function directMessageUser(account: Account) {
-  openPublishDialog(getDefaultDraft({
+  openPublishDialog('dialog', getDefaultDraft({
     status: `@${account.acct} `,
     visibility: 'direct',
   }))