From 252b4a037fa97c3e876881404b24b4149815c685 Mon Sep 17 00:00:00 2001 From: Max Date: Thu, 19 Jun 2025 14:40:11 +0200 Subject: [PATCH] fix(webapp): show hint that message is being saved (#8690) * Show hint that message is being saved * Translate transmitting message --- webapp/components/Chat/Chat.vue | 52 ++++++++++++++++++++++++++------- webapp/locales/de.json | 1 + webapp/locales/en.json | 1 + webapp/locales/es.json | 1 + webapp/locales/fr.json | 1 + webapp/locales/it.json | 1 + webapp/locales/nl.json | 1 + webapp/locales/pl.json | 1 + webapp/locales/pt.json | 1 + webapp/locales/ru.json | 1 + 10 files changed, 50 insertions(+), 11 deletions(-) diff --git a/webapp/components/Chat/Chat.vue b/webapp/components/Chat/Chat.vue index 893b6164f..5d2b745e8 100644 --- a/webapp/components/Chat/Chat.vue +++ b/webapp/components/Chat/Chat.vue @@ -69,6 +69,14 @@ +
+ {{ $t('chat.transmitting') }} +
+
0) { mutationVariables.files = filesToUpload } + + // Immediately add new message + const localMessage = { + ...messageDetails, + _id: 'new', + seen: false, + saved: false, + date: new Date(), + senderId: this.currentUser.id, + files: + messageDetails.files?.map((file) => ({ + ...file, + url: URL.createObjectURL(new Blob([file.blob], { type: file.type })), + })) ?? [], + // Custom property + isUploading: true, + } + this.messages = [...this.messages, localMessage] + + const roomIndex = this.rooms.findIndex((r) => r.id === roomId) + if (roomIndex !== -1) { + const changedRoom = { ...this.rooms[roomIndex] } + changedRoom.lastMessage.content = content + + // Move changed room to the top of the list + changedRoom.index = changedRoom.lastMessage.date + this.rooms = [changedRoom, ...this.rooms.filter((r) => r.id !== roomId)] + } + try { const { data } = await this.$apollo.mutate({ mutation: createMessageMutation(), @@ -401,17 +438,10 @@ export default { }) const createdMessagePayload = data.CreateMessage - if (createdMessagePayload) { - const roomIndex = this.rooms.findIndex((r) => r.id === roomId) - if (roomIndex !== -1) { - const changedRoom = { ...this.rooms[roomIndex] } - changedRoom.lastMessage.content = createdMessagePayload.content.trim().substring(0, 30) - changedRoom.lastMessage.date = createdMessagePayload.date - - // Move changed room to the top of the list - changedRoom.index = createdMessagePayload.date - this.rooms = [changedRoom, ...this.rooms.filter((r) => r.id !== roomId)] - } + if (createdMessagePayload && roomIndex !== -1) { + const changedRoom = { ...this.rooms[roomIndex] } + changedRoom.lastMessage.content = createdMessagePayload.content.trim().substring(0, 30) + changedRoom.lastMessage.date = createdMessagePayload.date } } catch (error) { this.$toast.error(error.message) diff --git a/webapp/locales/de.json b/webapp/locales/de.json index 3d17e5e5b..9d3b391f7 100644 --- a/webapp/locales/de.json +++ b/webapp/locales/de.json @@ -130,6 +130,7 @@ "roomEmpty": "Keinen Raum selektiert", "roomsEmpty": "Keine Räume", "search": "Chat-Räume filtern", + "transmitting": "Nachricht wird übertragen ...", "typeMessage": "Nachricht schreiben", "userProfileButton": { "label": "Chat", diff --git a/webapp/locales/en.json b/webapp/locales/en.json index 69082f227..07b6365ba 100644 --- a/webapp/locales/en.json +++ b/webapp/locales/en.json @@ -130,6 +130,7 @@ "roomEmpty": "No room selected", "roomsEmpty": "No rooms", "search": "Filter chat rooms", + "transmitting": "Transmitting message ...", "typeMessage": "Type message", "userProfileButton": { "label": "Chat", diff --git a/webapp/locales/es.json b/webapp/locales/es.json index 45b27135e..36cf585b8 100644 --- a/webapp/locales/es.json +++ b/webapp/locales/es.json @@ -130,6 +130,7 @@ "roomEmpty": null, "roomsEmpty": null, "search": "Filtrar salas de chat", + "transmitting": null, "typeMessage": null, "userProfileButton": { "label": null, diff --git a/webapp/locales/fr.json b/webapp/locales/fr.json index e64b87454..063b4987c 100644 --- a/webapp/locales/fr.json +++ b/webapp/locales/fr.json @@ -130,6 +130,7 @@ "roomEmpty": null, "roomsEmpty": null, "search": "Filtrer les salons de chat", + "transmitting": null, "typeMessage": null, "userProfileButton": { "label": null, diff --git a/webapp/locales/it.json b/webapp/locales/it.json index 30c7cc40b..448de1a5a 100644 --- a/webapp/locales/it.json +++ b/webapp/locales/it.json @@ -130,6 +130,7 @@ "roomEmpty": null, "roomsEmpty": null, "search": null, + "transmitting": null, "typeMessage": null, "userProfileButton": { "label": null, diff --git a/webapp/locales/nl.json b/webapp/locales/nl.json index 613ca84c6..2cf257ada 100644 --- a/webapp/locales/nl.json +++ b/webapp/locales/nl.json @@ -130,6 +130,7 @@ "roomEmpty": null, "roomsEmpty": null, "search": null, + "transmitting": null, "typeMessage": null, "userProfileButton": { "label": null, diff --git a/webapp/locales/pl.json b/webapp/locales/pl.json index bf7296906..5b1c085ed 100644 --- a/webapp/locales/pl.json +++ b/webapp/locales/pl.json @@ -130,6 +130,7 @@ "roomEmpty": null, "roomsEmpty": null, "search": null, + "transmitting": null, "typeMessage": null, "userProfileButton": { "label": null, diff --git a/webapp/locales/pt.json b/webapp/locales/pt.json index 985ec6604..3cd520442 100644 --- a/webapp/locales/pt.json +++ b/webapp/locales/pt.json @@ -130,6 +130,7 @@ "roomEmpty": null, "roomsEmpty": null, "search": null, + "transmitting": null, "typeMessage": null, "userProfileButton": { "label": null, diff --git a/webapp/locales/ru.json b/webapp/locales/ru.json index d1214e3fc..cc1a7cff5 100644 --- a/webapp/locales/ru.json +++ b/webapp/locales/ru.json @@ -130,6 +130,7 @@ "roomEmpty": null, "roomsEmpty": null, "search": null, + "transmitting": null, "typeMessage": null, "userProfileButton": { "label": null,