fix: "Replace Draft?" prompt not appearing

Namely, when doing
- 'Share Profile'
- `webxdc.sendToChat()`
- bot command click
- `mailto:...?body=...` click

The issue was described in
#5643.
The problem was that, since we save the draft the the backend
on debounce and not immediately, it is not enough
to utilize `BackendRemote.rpc.getDraft()` to check whether
a draft is present.

So let's instead treat the source of truth for the draft state
as being inside of `useDraft`, and overall move more draft logic
to inside of `useDraft`.

The problem with this, however, is that `useDraft` is not always
rendered with the `accountId` and `chatId` that we need,
so we have to store the "set draft request"
until the correct chat has been selected and loaded.

Co-authored-by: Nico de Haen <[email protected]>

Author: WofWca

packages/frontend/src/components/dialogs/ViewProfile/menu.tsx

@@ -219,8 +219,9 @@ function ShareProfileDialog(
       await createDraftMessage(accountId, chatId, '', {
         name: `${contact.displayName}.vcard`,
         path: filePath,
+        viewType: 'Vcard',
+        deleteTempFileWhenDone: true,
       })
-      runtime.removeTempFile(filePath)
     } else {
       await createDraftMessage(accountId, chatId, contact.address)
     }

packages/frontend/src/components/dialogs/WebxdcSendToChat/index.tsx

@@ -23,19 +23,18 @@ export default function WebxdcSaveToChatDialog(props: Props) {
   const createDraftMessage = useCreateDraftMessage()
 
   const onChatClick = async (chatId: number) => {
-    const file2 = file
+    const file2: Parameters<typeof createDraftMessage>[3] = file
       ? {
           path: await runtime.writeTempFileFromBase64(
             file.file_name,
             file.file_content
           ),
           name: file.file_name,
+          deleteTempFileWhenDone: true,
+          // viewType: undefined
         }
       : undefined
     await createDraftMessage(accountId, chatId, messageText ?? '', file2)
-    if (file2) {
-      await runtime.removeTempFile(file2.path)
-    }
     onClose()
   }
 

packages/frontend/src/components/message/MessageParser.tsx

@@ -12,7 +12,6 @@ import { BackendRemote } from '../../backend-com'
 import { selectedAccountId } from '../../ScreenController'
 import { MessagesDisplayContext } from '../../contexts/MessagesDisplayContext'
 import useChat from '../../hooks/chat/useChat'
-import useConfirmationDialog from '../../hooks/dialog/useConfirmationDialog'
 import useCreateChatByEmail from '../../hooks/chat/useCreateChatByEmail'
 
 const log = getLogger('renderer/message-parser')
@@ -237,7 +236,6 @@ function BotCommandSuggestion({
   suggestion: string
   tabIndex: -1 | 0
 }) {
-  const openConfirmationDialog = useConfirmationDialog()
   const messageDisplay = useContext(MessagesDisplayContext)
   const accountId = selectedAccountId()
   const { selectChat } = useChat()
@@ -269,42 +267,16 @@ function BotCommandSuggestion({
       return
     }
 
-    // IDEA: Optimisation - unify these two calls in a new backend call that only returns the info we need
-    const [chat, draft] = await Promise.all([
-      BackendRemote.rpc.getBasicChatInfo(accountId, chatId),
-      BackendRemote.rpc.getDraft(accountId, chatId),
-    ])
-
-    if (!chat) {
-      log.error('chat not defined')
-      return
-    }
-
-    const { name } = chat
-
-    if (draft) {
-      // Ask if the draft should be replaced
-      const confirmed: boolean = await openConfirmationDialog({
-        message: window.static_translate('confirm_replace_draft', name),
-        confirmLabel: window.static_translate('replace_draft'),
-      })
-
-      if (!confirmed) {
-        return
-      }
+    // Copy-pasted from `useCreateDraftMesssage`.
+    if (window.__setDraftRequest != undefined) {
+      log.error('previous BotCommandSuggestion has not worked?')
     }
-
-    await BackendRemote.rpc.miscSetDraft(
+    window.__setDraftRequest = {
       accountId,
       chatId,
-      suggestion,
-      null,
-      null,
-      null,
-      'Text'
-    )
-
-    window.__reloadDraft && window.__reloadDraft()
+      text: suggestion,
+    }
+    window.__checkSetDraftRequest?.()
   }
 
   return (

packages/frontend/src/global.d.ts

@@ -18,9 +18,35 @@ declare global {
     __settingsOpened: boolean
     __keybindingsDialogOpened: boolean
     __aboutDialogOpened: boolean
+
     __setQuoteInDraft: ((msgId: number) => void) | null
+    /**
+     * Setting this will make `useDraft` set the draft to this state,
+     * as soon as it renders with the specified `accountId` and `chatId`.
+     *
+     * @see {@linkcode __internal_jump_to_message_asap}
+     */
+    __setDraftRequest?: {
+      accountId: number
+      chatId: number
+      file?: {
+        path: string
+        name?: string
+        viewType: T.Viewtype
+        deleteTempFileWhenDone: boolean
+      }
+      text?: string
+    }
+    /**
+     * This should be called after assigning to {@linkcode __setDraftRequest}
+     * so that we don't have to wait for `useDraft` to re-render.
+     *
+     * @see {@linkcode __internal_check_jump_to_message}
+     */
+    __checkSetDraftRequest?: () => void
+
     __enterEditMessageMode: ((messageToEdit: T.Message) => void) | null
-    __reloadDraft: (() => void) | null
+
     __chatlistSetSearch:
       | ((searchTerm: string, chatId: number | null) => void)
       | undefined
@@ -39,6 +65,8 @@ declare global {
      * Ensuring that MessageList _will_ load the chat with the specified
      * `accountId` and `chatId` is the responsibility of whoever
      * accesses this property.
+     *
+     * @see {@linkcode __setDraftRequest}
      */
     __internal_jump_to_message_asap?: {
       accountId: number
@@ -66,6 +94,7 @@ declare global {
      *
      * This property is managed by the MessageList component instance,
      * it gets assigned when the component gets rendered.
+     * @see {@linkcode __checkSetDraftRequest}
      */
     __internal_check_jump_to_message?: () => void
     /**

packages/frontend/src/hooks/chat/useCreateDraftMesssage.ts

@@ -1,15 +1,28 @@
 import { useCallback } from 'react'
 
 import useChat from './useChat'
-import useConfirmationDialog from '../dialog/useConfirmationDialog'
-import useTranslationFunction from '../useTranslationFunction'
-import { BackendRemote } from '../../backend-com'
+import { getLogger } from '@deltachat-desktop/shared/logger'
+import type { T } from '@deltachat/jsonrpc-client'
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import type { runtime } from '@deltachat-desktop/runtime-interface'
+
+const log = getLogger('useCreateDraftMessage')
 
 export type CreateDraftMessage = (
   accountId: number,
   chatId: number,
   messageText: string,
-  file?: { path: string; name?: string }
+  file?: {
+    path: string
+    name?: string
+    viewType?: T.Viewtype
+    /**
+     * If the provided file is a temp file, set this to `true`,
+     * and the file will be deleted (with {@linkcode runtime.removeTempFile})
+     * when we're done adding it to the draft (or if something failed).
+     */
+    deleteTempFileWhenDone: boolean
+  }
 ) => Promise<void>
 
 /**
@@ -19,45 +32,29 @@ export type CreateDraftMessage = (
  * replace it.
  */
 export default function useCreateDraftMessage() {
-  const tx = useTranslationFunction()
-  const openConfirmationDialog = useConfirmationDialog()
   const { selectChat } = useChat()
 
   return useCallback<CreateDraftMessage>(
     async (accountId, chatId, messageText, file) => {
-      const draft = await BackendRemote.rpc.getDraft(accountId, chatId)
-
       selectChat(accountId, chatId)
 
-      if (draft) {
-        const { name } = await BackendRemote.rpc.getBasicChatInfo(
-          accountId,
-          chatId
-        )
-
-        // Ask if the draft should be replaced
-        const continueProcess = await openConfirmationDialog({
-          message: tx('confirm_replace_draft', name),
-          confirmLabel: tx('replace_draft'),
-        })
-
-        if (!continueProcess) {
-          return
-        }
+      if (window.__setDraftRequest != undefined) {
+        log.error('previous createDraftMessage has not worked?')
       }
-
-      await BackendRemote.rpc.miscSetDraft(
+      window.__setDraftRequest = {
         accountId,
         chatId,
-        messageText,
-        file?.path || null,
-        file?.name || null,
-        null,
-        file ? 'File' : 'Text'
-      )
-
-      window.__reloadDraft?.()
+        file: file
+          ? {
+              ...file,
+              // Should we make `viewType` required?
+              viewType: file.viewType ?? 'File',
+            }
+          : undefined,
+        text: messageText,
+      }
+      window.__checkSetDraftRequest?.()
     },
-    [tx, openConfirmationDialog, selectChat]
+    [selectChat]
   )
 }