-
- {{ $t('message.user_said', { user: inReplyToSender || "Someone" }) }}
-
-
+
{{ inReplyToSender }}
+
+
@@ -49,54 +51,46 @@ export default {
return {
items: [],
showItem: null,
- thread: null,
}
},
mounted() {
this.thread = this.timelineSet.relations.getChildEventsForEvent(this.event.getId(), "m.thread", "m.room.message");
- this.processThread();
- },
- beforeDestroy() {
- this.thread = null;
- },
- watch: {
- thread: {
- handler(newValue, oldValue) {
- if (oldValue) {
- oldValue.off('Relations.add', this.onAddRelation);
- }
- if (newValue) {
- newValue.on('Relations.add', this.onAddRelation);
- }
- this.processThread();
- },
- immediate: true
+ if (!this.thread) {
+ this.event.on("Event.relationsCreated", this.onRelationsCreated);
}
},
+ beforeDestroy() {
+ this.event.off("Event.relationsCreated", this.onRelationsCreated);
+ },
methods: {
- onAddRelation() {
- this.processThread();
+ onRelationsCreated() {
+ this.thread = this.timelineSet.relations.getChildEventsForEvent(this.event.getId(), "m.thread", "m.room.message");
+ this.event.off("Event.relationsCreated", this.onRelationsCreated);
},
onItemClick(event) {
this.showItem = event.item;
},
processThread() {
- this.items = this.timelineSet.relations.getAllChildEventsForEvent(this.event.getId()).map(e => {
- let ret = {
- event: e,
- src: null,
- };
- ret.promise =
- util
- .getThumbnail(this.$matrix.matrixClient, e, 100, 100)
- .then((url) => {
- ret.src = url;
- })
- .catch((err) => {
- console.log("Failed to fetch thumbnail: ", err);
- });
- return ret;
- });
+ this.$emit('layout-change', () => {
+ this.items = this.timelineSet.relations.getAllChildEventsForEvent(this.event.getId())
+ .filter(e => util.downloadableTypes().includes(e.getContent().msgtype))
+ .map(e => {
+ let ret = {
+ event: e,
+ src: null,
+ };
+ ret.promise =
+ util
+ .getThumbnail(this.$matrix.matrixClient, e, 100, 100)
+ .then((url) => {
+ ret.src = url;
+ })
+ .catch((err) => {
+ console.log("Failed to fetch thumbnail: ", err);
+ });
+ return ret;
+ });
+ }, this.$el);
},
layoutedItems() {
if (!this.items || this.items.length == 0) { return [] }
diff --git a/src/components/messages/export/MessageIncomingThreadExport.vue b/src/components/messages/export/MessageIncomingThreadExport.vue
new file mode 100644
index 0000000..5756683
--- /dev/null
+++ b/src/components/messages/export/MessageIncomingThreadExport.vue
@@ -0,0 +1,59 @@
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/components/messages/export/MessageOutgoingThreadExport.vue b/src/components/messages/export/MessageOutgoingThreadExport.vue
new file mode 100644
index 0000000..a746cbe
--- /dev/null
+++ b/src/components/messages/export/MessageOutgoingThreadExport.vue
@@ -0,0 +1,59 @@
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/components/messages/messageMixin.js b/src/components/messages/messageMixin.js
index 206006f..ecb0e50 100644
--- a/src/components/messages/messageMixin.js
+++ b/src/components/messages/messageMixin.js
@@ -2,7 +2,7 @@ import QuickReactions from "./QuickReactions.vue";
import * as linkify from 'linkifyjs';
import linkifyHtml from 'linkify-html';
import utils from "../../plugins/utils"
-import Vue from "vue";
+import util from "../../plugins/utils";
linkify.options.defaults.className = "link";
linkify.options.defaults.target = { url: "_blank" };
@@ -40,51 +40,22 @@ export default {
type: Function,
default: function () {
return () => {};
- }
+ },
},
},
data() {
return {
event: {},
- inReplyToEvent: null,
- inReplyToSender: null,
- utils
+ thread: null,
+ utils,
};
},
mounted() {
- const relatesTo = this.validEvent && this.event.getWireContent()["m.relates_to"];
- if (relatesTo && relatesTo["m.in_reply_to"]) {
- // Can we find the original message?
- const originalEventId = relatesTo["m.in_reply_to"].event_id;
- if (originalEventId && this.timelineSet) {
- const originalEvent = this.timelineSet.findEventById(originalEventId);
- if (originalEvent) {
- this.inReplyToEvent = originalEvent;
- this.inReplyToSender = this.eventSenderDisplayName(originalEvent);
- }
- }
- }
},
- beforeUnmount() {
- if (this.validEvent) {
- this.event.off("Event.relationsCreated", this.onRelationsCreated);
- }
+ beforeDestroy() {
+ this.thread = null;
},
watch: {
- event: {
- immediate: true,
- handler(newValue, oldValue) {
- if (oldValue && oldValue.getId) {
- oldValue.off("Event.relationsCreated", this.onRelationsCreated);
- }
- if (newValue && newValue.getId) {
- newValue.on("Event.relationsCreated", this.onRelationsCreated);
- if (newValue.isThreadRoot) {
- Vue.set(newValue, "isThread", true);
- }
- }
- }
- },
originalEvent: {
immediate: true,
handler(originalEvent, ignoredOldValue) {
@@ -96,7 +67,19 @@ export default {
});
}
},
- }
+ },
+ thread: {
+ handler(newValue, oldValue) {
+ if (oldValue) {
+ oldValue.off("Relations.add", this.onAddRelation);
+ }
+ if (newValue) {
+ newValue.on("Relations.add", this.onAddRelation);
+ }
+ this.processThread();
+ },
+ immediate: true,
+ },
},
computed: {
/**
@@ -107,6 +90,16 @@ export default {
return this.event && Object.keys(this.event).length !== 0;
},
+ /**
+ * If this is a thread event, we return the root here, so all reactions will land on the root event.
+ */
+ eventForReactions() {
+ if (this.event.parentThread) {
+ return this.event.parentThread;
+ }
+ return this.event;
+ },
+
incoming() {
return this.event && this.event.getSender() != this.$matrix.currentUserId;
},
@@ -123,11 +116,34 @@ export default {
return true;
},
+ inReplyToSender() {
+ const originalEvent = this.validEvent && this.event.replyEvent;
+ if (originalEvent) {
+ const sender = this.eventSenderDisplayName(originalEvent);
+ if (originalEvent.isThreadRoot || originalEvent.isMxThread) {
+ return sender || this.$t("message.someone");
+ } else {
+ return this.$t("message.user_said", { user: sender || this.$t("message.someone") });
+ }
+ }
+ return null;
+ },
+
+ inReplyToEvent() {
+ return this.validEvent && this.event.replyEvent;
+ },
+
inReplyToText() {
const relatesTo = this.event.getWireContent()["m.relates_to"];
if (relatesTo && relatesTo["m.in_reply_to"]) {
+ if (this.inReplyToEvent && (this.inReplyToEvent.isThreadRoot || this.inReplyToEvent.isMxThread)) {
+ const children = this.timelineSet.relations
+ .getAllChildEventsForEvent(this.inReplyToEvent.getId())
+ .filter((e) => util.downloadableTypes().includes(e.getContent().msgtype));
+ return this.$t("message.sent_media", { count: children.length });
+ }
const content = this.event.getContent();
- if ('body' in content) {
+ if ("body" in content) {
const lines = content.body.split("\n").reverse() || [];
while (lines.length && !lines[0].startsWith("> ")) lines.shift();
// Reply fallback has a blank line after it, so remove it to prevent leading newline
@@ -137,12 +153,10 @@ export default {
return text;
}
}
-
if (this.inReplyToEvent) {
var c = this.inReplyToEvent.getContent();
return c.body;
}
-
// We don't have the original text (at the moment at least)
return this.$t("fallbacks.original_text");
}
@@ -153,7 +167,7 @@ export default {
const relatesTo = this.event.getWireContent()["m.relates_to"];
if (relatesTo && relatesTo["m.in_reply_to"]) {
const content = this.event.getContent();
- if ('body' in content) {
+ if ("body" in content) {
// Remove the new text and strip "> " from the old original text
const lines = content.body.split("\n");
while (lines.length && lines[0].startsWith("> ")) lines.shift();
@@ -190,10 +204,9 @@ export default {
},
},
methods: {
- onRelationsCreated(relationType, ignoredEventType) {
- if (relationType === "m.thread") {
- Vue.set(this.event, "isThread", true);
- }
+ onAddRelation() {
+ console.error("onAddRelation");
+ this.processThread();
},
ownAvatarClicked() {
this.$emit("own-avatar-clicked", { event: this.event });
@@ -308,5 +321,10 @@ export default {
linkify(text) {
return linkifyHtml(text);
},
+
+ /**
+ * Override this to handle updates to (the) message thread.
+ */
+ processThread() {},
},
};
diff --git a/src/components/messages/messageOperationsMixin.js b/src/components/messages/messageOperationsMixin.js
index c151228..5143615 100644
--- a/src/components/messages/messageOperationsMixin.js
+++ b/src/components/messages/messageOperationsMixin.js
@@ -1,3 +1,4 @@
+import util from "../../plugins/utils";
export default {
computed: {
@@ -5,8 +6,12 @@ export default {
return !this.incoming && this.event.getContent().msgtype == "m.text";
},
isDownloadable() {
+ if ((this.event.isThreadRoot || this.event.isMxThread) && this.timelineSet) {
+ const children = this.timelineSet.relations.getAllChildEventsForEvent(this.event.getId()).filter(e => util.downloadableTypes().includes(e.getContent().msgtype));
+ return children.length > 0;
+ }
const msgtype = this.event.getContent().msgtype;
- return ['m.video','m.audio','m.image','m.file'].includes(msgtype);
+ return util.downloadableTypes().includes(msgtype);
},
isRedactable() {
const room = this.$matrix.matrixClient.getRoom(this.event.getRoomId());
diff --git a/src/plugins/utils.js b/src/plugins/utils.js
index 03e2b7a..c08c0ec 100644
--- a/src/plugins/utils.js
+++ b/src/plugins/utils.js
@@ -299,10 +299,8 @@ class Util {
if (err && err.name == "UnknownDeviceError") {
console.log("Unknown devices. Mark as known before retrying.");
var setAsKnownPromises = [];
- for (var user of Object.keys(err.devices)) {
- const userDevices = err.devices[user];
- for (var deviceId of Object.keys(userDevices)) {
- const deviceInfo = userDevices[deviceId];
+ err.devices.forEach((userDevices, user) => {
+ userDevices.forEach((deviceInfo, deviceId) => {
if (!deviceInfo.known) {
setAsKnownPromises.push(
matrixClient.setDeviceKnown(
@@ -312,9 +310,9 @@ class Util {
)
);
}
- }
- }
- Promise.all(setAsKnownPromises)
+ });
+ });
+ return Promise.all(setAsKnownPromises)
.then(() => {
// All devices now marked as "known", try to resend
let event = err.event;
@@ -499,7 +497,6 @@ class Util {
// Have we changed our local view mode of this room?
const tags = room.tags;
if (tags && tags["ui_options"]) {
- console.error("We have a tag!");
if (tags["ui_options"]["voice_mode"] === 1) {
return ROOM_TYPE_VOICE_MODE;
} else if (tags["ui_options"]["file_mode"] === 1) {
@@ -897,6 +894,10 @@ class Util {
});
}
+ downloadableTypes() {
+ return ['m.video','m.audio','m.image','m.file'];
+ }
+
download(matrixClient, event) {
this
.getAttachment(matrixClient, event)