Allow "replying" to an event with a file

Send a pseudo-reply consisting of two messages: a `m.text` which is just
a reply with an empty body, then the file event itself.

This is a workaround to the restriction imposed by the Matrix API,
which prevents us from simply attaching a reply to a media event:
https://matrix.org/docs/spec/client_server/latest#rich-replies

src/backend/matrix_client.py

@@ -617,7 +617,12 @@ class MatrixClient(nio.AsyncClient):
         self.upload_tasks[uuid].cancel()
 
 
-    async def send_clipboard_image(self, room_id: str, image: bytes) -> None:
+    async def send_clipboard_image(
+        self,
+        room_id:           str,
+        image:             bytes,
+        reply_to_event_id: Optional[str] = None,
+    ) -> None:
         """Send a clipboard image passed from QML as a `m.image` message."""
 
         prefix = datetime.now().strftime("%Y%m%d-%H%M%S.")
@@ -633,16 +638,28 @@ class MatrixClient(nio.AsyncClient):
 
                 return Path(temp.name)
 
-            await self.send_file(room_id, get_path)
+            await self.send_file(room_id, get_path, reply_to_event_id)
 
 
-    async def send_file(self, room_id: str, path: PathCallable) -> None:
-        """Send a `m.file`, `m.image`, `m.audio` or `m.video` message."""
+    async def send_file(
+        self,
+        room_id:           str,
+        path:              PathCallable,
+        reply_to_event_id: Optional[str] = None,
+    ) -> None:
+        """Send a `m.file`, `m.image`, `m.audio` or `m.video` message.
+
+        The Matrix client-server API states that media messages can't have a
+        reply attached.
+        Thus, if a `reply_to_event_id` is passed, we send a pseudo-reply as two
+        events: a `m.text` one with the reply but an empty body, then the
+        actual media.
+        """
 
         item_uuid = uuid4()
 
         try:
-            await self._send_file(item_uuid, room_id, path)
+            await self._send_file(item_uuid, room_id, path, reply_to_event_id)
         except (nio.TransferCancelledError, asyncio.CancelledError):
             self.upload_monitors.pop(item_uuid, None)
             self.upload_tasks.pop(item_uuid, None)
@@ -650,9 +667,13 @@ class MatrixClient(nio.AsyncClient):
 
 
     async def _send_file(
-        self, item_uuid: UUID, room_id: str, path: PathCallable,
+        self,
+        item_uuid:         UUID,
+        room_id:           str,
+        path:              PathCallable,
+        reply_to_event_id: Optional[str] = None,
     ) -> None:
-        """Upload and monitor a file + thumbnail and send the built event."""
+        """Upload and monitor a file + thumbnail and send the built event(s)"""
 
         # TODO: this function is way too complex, and most of it should be
         # refactored into nio.
@@ -860,6 +881,11 @@ class MatrixClient(nio.AsyncClient):
         del self.upload_tasks[item_uuid]
         del self.models[room_id, "uploads"][str(upload_item.id)]
 
+        if reply_to_event_id:
+            await self.send_text(
+                room_id=room_id, text="", reply_to_event_id=reply_to_event_id,
+            )
+
         await self._local_echo(
             room_id,
             transaction_id,

src/gui/Dialogs/SendFilePicker.qml

@@ -6,8 +6,11 @@ import Qt.labs.platform 1.1
 HFileDialogOpener {
     property string userId
     property string roomId
+    property string replyToEventId: ""
     property bool destroyWhenDone: false
 
+    signal replied()
+
 
     fill: false
     dialog.title: qsTr("Select a file to send")
@@ -16,14 +19,17 @@ HFileDialogOpener {
     onFilesPicked: {
         for (const file of files) {
             const path = Qt.resolvedUrl(file).replace(/^file:/, "")
+            const args = [roomId, path, replyToEventId || undefined]
 
-            py.callClientCoro(userId, "send_file", [roomId, path], () => {
+            py.callClientCoro(userId, "send_file", args, () => {
                 if (destroyWhenDone) destroy()
 
             }, (type, args, error, traceback) => {
                 console.error(`python:\n${traceback}`)
                 if (destroyWhenDone) destroy()
             })
+
+            if (replyToUserId) replied()
         }
     }
 

src/gui/Pages/Chat/Chat.qml

@@ -28,6 +28,14 @@ Item {
     readonly property bool composerHasFocus:
         Boolean(loader.item && loader.item.composer.hasFocus)
 
+    function clearReplyTo() {
+        if (! replyToEventId) return
+
+        replyToEventId     = ""
+        replyToUserId      = ""
+        replyToDisplayName = ""
+    }
+
 
     onFocusChanged: if (focus && loader.item) loader.item.composer.takeFocus()
     onReadyChanged: longLoading = false

src/gui/Pages/Chat/Composer/MessageArea.qml

@@ -98,14 +98,6 @@ HTextArea {
         py.callClientCoro(userId, "room_typing", [chat.roomId, typing])
     }
 
-    function clearReplyTo() {
-        if (! chat.replyToEventId) return
-
-        chat.replyToEventId     = ""
-        chat.replyToUserId      = ""
-        chat.replyToDisplayName = ""
-    }
-
     function addNewLine() {
         let indents = 0
         const parts = lineText.split(indent)
@@ -171,7 +163,9 @@ HTextArea {
             userId: chat.userId,
             roomId: chat.roomId,
             roomName: chat.roomInfo.display_name,
+            replyToEventId: chat.replyToEventId,
         },
+        popup => popup.replied.connect(chat.clearReplyTo),
     )
 
     Keys.onEscapePressed:

src/gui/Pages/Chat/Composer/UploadButton.qml

@@ -28,7 +28,9 @@ HButton {
                 roomId: chat.roomId,
                 roomName: chat.roomInfo.display_name,
                 filePath: Clipboard.text.trim(),
+                replyToEventId: chat.replyToEventId,
             },
+            popup => popup.replied.connect(chat.clearReplyTo),
         )
     }
 
@@ -36,6 +38,8 @@ HButton {
         id: sendFilePicker
         userId: chat.userId
         roomId: chat.roomId
+        replyToEventId: chat.replyToEventId
+        onReplied: chat.clearReplyTo()
 
         HShortcut {
             sequences: window.settings.keys.sendFile

src/gui/Popups/ConfirmClipboardUploadPopup.qml

@@ -16,6 +16,9 @@ HColumnPopup {
     property string userId
     property string roomId
     property string roomName
+    property string replyToEventId: ""
+
+    signal replied()
 
 
     contentWidthLimit: theme.controls.popup.defaultWidth * 1.25
@@ -26,11 +29,14 @@ HColumnPopup {
             text: qsTr("Send")
             icon.name: "confirm-uploading-file"
             onClicked: {
-                py.callClientCoro(
-                    popup.userId,
-                    "send_clipboard_image",
-                    [popup.roomId, Clipboard.image],
-                )
+                const args = [
+                    popup.roomId,
+                    Clipboard.image,
+                    popup.replyToEventId || undefined,
+                ]
+
+                py.callClientCoro(popup.userId, "send_clipboard_image", args)
+                if (popup.replyToEventId) popup.replied()
                 popup.close()
             }
         }

src/gui/Popups/ConfirmUploadPopup.qml

@@ -13,9 +13,12 @@ HColumnPopup {
     property string roomId
     property string roomName
     property string filePath
+    property string replyToEventId: ""
 
     readonly property string fileName: filePath.split("/").slice(-1)[0]
 
+    signal replied()
+
 
     contentWidthLimit: theme.controls.popup.defaultWidth * 1.25
 
@@ -25,9 +28,14 @@ HColumnPopup {
             text: qsTr("Send")
             icon.name: "confirm-uploading-file"
             onClicked: {
-                py.callClientCoro(
-                    popup.userId, "send_file", [popup.roomId, filePath],
-                )
+                const args = [
+                    popup.roomId,
+                    popup.filePath,
+                    popup.replyToEventId || undefined,
+                ]
+
+                py.callClientCoro(popup.userId, "send_file", args)
+                if (popup.replyToEventId) popup.replied()
                 popup.close()
             }
         }