diff --git a/matrixgw_frontend/src/api/matrix/MatrixApiEvent.ts b/matrixgw_frontend/src/api/matrix/MatrixApiEvent.ts index f81e47d..5fdf43b 100644 --- a/matrixgw_frontend/src/api/matrix/MatrixApiEvent.ts +++ b/matrixgw_frontend/src/api/matrix/MatrixApiEvent.ts @@ -92,6 +92,21 @@ export class MatrixApiEvent { }); } + /** + * Edit text message content + */ + static async SetTextMessageContent( + room: Room, + event_id: string, + content: string + ): Promise { + await APIClient.exec({ + method: "POST", + uri: `/matrix/room/${room.id}/event/${event_id}/set_text_content`, + jsonData: { content }, + }); + } + /** * Delete an event */ diff --git a/matrixgw_frontend/src/widgets/messages/RoomMessagesList.tsx b/matrixgw_frontend/src/widgets/messages/RoomMessagesList.tsx index 9c5b058..6133c06 100644 --- a/matrixgw_frontend/src/widgets/messages/RoomMessagesList.tsx +++ b/matrixgw_frontend/src/widgets/messages/RoomMessagesList.tsx @@ -5,6 +5,11 @@ import { Button, ButtonGroup, Dialog, + DialogActions, + DialogContent, + DialogContentText, + DialogTitle, + TextField, Typography, useTheme, } from "@mui/material"; @@ -14,6 +19,7 @@ import type { UsersMap } from "../../api/matrix/MatrixApiProfile"; import type { Room } from "../../api/matrix/MatrixApiRoom"; import { useAlert } from "../../hooks/contexts_provider/AlertDialogProvider"; import { useConfirm } from "../../hooks/contexts_provider/ConfirmDialogProvider"; +import { useLoadingMessage } from "../../hooks/contexts_provider/LoadingMessageProvider"; import type { Message, RoomEventsManager } from "../../utils/RoomEventsManager"; import { useUserInfo } from "../dashboard/BaseAuthenticatedPage"; import { AccountIcon } from "./AccountIcon"; @@ -75,9 +81,12 @@ function RoomMessage(p: { const user = useUserInfo(); const alert = useAlert(); const confirm = useConfirm(); + const loadingMessage = useLoadingMessage(); const [showImageFullScreen, setShowImageFullScreen] = React.useState(false); + const [editMessage, setEditMessage] = React.useState(); + const closeImageFullScreen = () => setShowImageFullScreen(false); const sender = p.users.get(p.message.account); @@ -92,6 +101,27 @@ function RoomMessage(p: { } }; + const handleEditMessage = () => setEditMessage(p.message.content); + const handleCancelEditMessage = () => setEditMessage(undefined); + const handleSubmitEditMessage = async (event: React.FormEvent) => { + event.preventDefault(); + + try { + loadingMessage.show(`Updating message content...`); + await MatrixApiEvent.SetTextMessageContent( + p.room, + p.message.event_id, + editMessage! + ); + setEditMessage(undefined); + } catch (e) { + console.error(`Failed to edit message!`, e); + alert(`Failed to edit message content! ${e}`); + } finally { + loadingMessage.hide(); + } + }; + return ( <> {/* Print date if required */} @@ -171,11 +201,12 @@ function RoomMessage(p: { right: "0px", }} > - {p.message.account === user.info.matrix_user_id && ( - - )} + {p.message.account === user.info.matrix_user_id && + !p.message.image && ( + + )} {p.message.account === user.info.matrix_user_id && ( + + + ); }