From 6c707e30999d75a7bd63b3349e2f181e12bb3670 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Sun, 24 Oct 2021 08:59:47 +0200 Subject: [PATCH 1/7] Use RoomContext instead of MatrixClientContext MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/components/views/rooms/EventTile.tsx | 41 +++++++++++++----------- 1 file changed, 22 insertions(+), 19 deletions(-) diff --git a/src/components/views/rooms/EventTile.tsx b/src/components/views/rooms/EventTile.tsx index 26b25699c04..f77e7741d7f 100644 --- a/src/components/views/rooms/EventTile.tsx +++ b/src/components/views/rooms/EventTile.tsx @@ -32,7 +32,6 @@ import { Layout } from "../../../settings/Layout"; import { formatTime } from "../../../DateUtils"; import { MatrixClientPeg } from '../../../MatrixClientPeg'; import { ALL_RULE_TYPES } from "../../../mjolnir/BanList"; -import MatrixClientContext from "../../../contexts/MatrixClientContext"; import { E2EState } from "./E2EIcon"; import { toRem } from "../../../utils/units"; import { WidgetType } from "../../../widgets/WidgetType"; @@ -62,6 +61,7 @@ import { dispatchShowThreadEvent } from '../../../dispatcher/dispatch-actions/th import { MessagePreviewStore } from '../../../stores/room-list/MessagePreviewStore'; import { logger } from "matrix-js-sdk/src/logger"; +import RoomContext from "../../../contexts/RoomContext"; const eventTileTypes = { [EventType.RoomMessage]: 'messages.MessageEvent', @@ -350,7 +350,8 @@ export default class EventTile extends React.Component { layout: Layout.Group, }; - static contextType = MatrixClientContext; + static contextType = RoomContext; + public context!: React.ContextType; constructor(props, context) { super(props, context); @@ -395,7 +396,7 @@ export default class EventTile extends React.Component { if (!this.props.mxEvent) return false; // Sanity check (should never happen, but we shouldn't explode if it does) - const room = this.context.getRoom(this.props.mxEvent.getRoomId()); + const room = MatrixClientPeg.get().getRoom(this.props.mxEvent.getRoomId()); if (!room) return false; // Quickly check to see if the event was sent by us. If it wasn't, it won't qualify for @@ -459,7 +460,7 @@ export default class EventTile extends React.Component { componentDidMount() { this.suppressReadReceiptAnimation = false; - const client = this.context; + const client = MatrixClientPeg.get(); if (!this.props.forExport) { client.on("deviceVerificationChanged", this.onDeviceVerificationChanged); client.on("userTrustStatusChanged", this.onUserVerificationChanged); @@ -479,7 +480,7 @@ export default class EventTile extends React.Component { this.props.mxEvent.on(ThreadEvent.Update, this.updateThread); } - const room = this.context.getRoom(this.props.mxEvent.getRoomId()); + const room = MatrixClientPeg.get().getRoom(this.props.mxEvent.getRoomId()); room?.on(ThreadEvent.New, this.onNewThread); } @@ -509,7 +510,7 @@ export default class EventTile extends React.Component { } componentWillUnmount() { - const client = this.context; + const client = MatrixClientPeg.get(); client.removeListener("deviceVerificationChanged", this.onDeviceVerificationChanged); client.removeListener("userTrustStatusChanged", this.onUserVerificationChanged); client.removeListener("Room.receipt", this.onRoomReceipt); @@ -523,14 +524,14 @@ export default class EventTile extends React.Component { this.props.mxEvent.off(ThreadEvent.Update, this.updateThread); } - const room = this.context.getRoom(this.props.mxEvent.getRoomId()); + const room = MatrixClientPeg.get().getRoom(this.props.mxEvent.getRoomId()); room?.off(ThreadEvent.New, this.onNewThread); } componentDidUpdate(prevProps, prevState, snapshot) { // If we're not listening for receipts and expect to be, register a listener. if (!this.isListeningForReceipts && (this.shouldShowSentReceipt || this.shouldShowSendingReceipt)) { - this.context.on("Room.receipt", this.onRoomReceipt); + MatrixClientPeg.get().on("Room.receipt", this.onRoomReceipt); this.isListeningForReceipts = true; } } @@ -538,7 +539,7 @@ export default class EventTile extends React.Component { private onNewThread = (thread: Thread) => { if (thread.id === this.props.mxEvent.getId()) { this.updateThread(thread); - const room = this.context.getRoom(this.props.mxEvent.getRoomId()); + const room = MatrixClientPeg.get().getRoom(this.props.mxEvent.getRoomId()); room.off(ThreadEvent.New, this.onNewThread); } }; @@ -611,7 +612,7 @@ export default class EventTile extends React.Component { this.forceUpdate(() => { // Per elsewhere in this file, we can remove the listener once we will have no further purpose for it. if (!this.shouldShowSentReceipt && !this.shouldShowSendingReceipt) { - this.context.removeListener("Room.receipt", this.onRoomReceipt); + MatrixClientPeg.get().removeListener("Room.receipt", this.onRoomReceipt); this.isListeningForReceipts = false; } }); @@ -644,9 +645,9 @@ export default class EventTile extends React.Component { return; } - const encryptionInfo = this.context.getEventEncryptionInfo(mxEvent); + const encryptionInfo = MatrixClientPeg.get().getEventEncryptionInfo(mxEvent); const senderId = mxEvent.getSender(); - const userTrust = this.context.checkUserTrust(senderId); + const userTrust = MatrixClientPeg.get().checkUserTrust(senderId); if (encryptionInfo.mismatchedSender) { // something definitely wrong is going on here @@ -664,7 +665,7 @@ export default class EventTile extends React.Component { return; } - const eventSenderTrust = encryptionInfo.sender && this.context.checkDeviceTrust( + const eventSenderTrust = encryptionInfo.sender && MatrixClientPeg.get().checkDeviceTrust( senderId, encryptionInfo.sender.deviceId, ); if (!eventSenderTrust) { @@ -743,11 +744,13 @@ export default class EventTile extends React.Component { shouldHighlight() { if (this.props.forExport) return false; - const actions = this.context.getPushActionsForEvent(this.props.mxEvent.replacingEvent() || this.props.mxEvent); + const actions = MatrixClientPeg.get().getPushActionsForEvent( + this.props.mxEvent.replacingEvent() || this.props.mxEvent, + ); if (!actions || !actions.tweaks) { return false; } // don't show self-highlights from another of our clients - if (this.props.mxEvent.getSender() === this.context.credentials.userId) { + if (this.props.mxEvent.getSender() === MatrixClientPeg.get().credentials.userId) { return false; } @@ -872,7 +875,7 @@ export default class EventTile extends React.Component { // Cancel any outgoing key request for this event and resend it. If a response // is received for the request with the required keys, the event could be // decrypted successfully. - this.context.cancelAndResendEventRoomKeyRequest(this.props.mxEvent); + MatrixClientPeg.get().cancelAndResendEventRoomKeyRequest(this.props.mxEvent); }; onPermalinkClicked = e => { @@ -910,7 +913,7 @@ export default class EventTile extends React.Component { } } - if (this.context.isRoomEncrypted(ev.getRoomId())) { + if (MatrixClientPeg.get().isRoomEncrypted(ev.getRoomId())) { // else if room is encrypted // and event is being encrypted or is not_sent (Unknown Devices/Network Error) if (ev.status === EventStatus.ENCRYPTING) { @@ -1185,7 +1188,7 @@ export default class EventTile extends React.Component { switch (this.props.tileShape) { case TileShape.Notif: { - const room = this.context.getRoom(this.props.mxEvent.getRoomId()); + const room = MatrixClientPeg.get().getRoom(this.props.mxEvent.getRoomId()); return React.createElement(this.props.as || "li", { "className": classes, "aria-live": ariaLive, @@ -1232,7 +1235,7 @@ export default class EventTile extends React.Component { isQuoteExpanded={isQuoteExpanded} setQuoteExpanded={this.setQuoteExpanded} />) : null; - const room = this.context.getRoom(this.props.mxEvent.getRoomId()); + const room = MatrixClientPeg.get().getRoom(this.props.mxEvent.getRoomId()); return React.createElement(this.props.as || "li", { "className": classes, "aria-live": ariaLive, From b8ca81e7bd67b4591b8a3829a5f97099f2ccb45e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Sun, 24 Oct 2021 09:00:59 +0200 Subject: [PATCH 2/7] Add timelineRenderingType and composerType MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/dispatcher/payloads/ComposerInsertPayload.ts | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/src/dispatcher/payloads/ComposerInsertPayload.ts b/src/dispatcher/payloads/ComposerInsertPayload.ts index ea5d8a0c53b..b59631a7074 100644 --- a/src/dispatcher/payloads/ComposerInsertPayload.ts +++ b/src/dispatcher/payloads/ComposerInsertPayload.ts @@ -18,9 +18,17 @@ import { MatrixEvent } from "matrix-js-sdk/src/models/event"; import { ActionPayload } from "../payloads"; import { Action } from "../actions"; +import { TimelineRenderingType } from "../../contexts/RoomContext"; + +export enum ComposerType { + Send = "send", + Edit = "edit", +} interface IBaseComposerInsertPayload extends ActionPayload { action: Action.ComposerInsert; + timelineRenderingType: TimelineRenderingType; + composerType: ComposerType | null; // null if should be re-dispatched to the correct composer } interface IComposerInsertMentionPayload extends IBaseComposerInsertPayload { From 0e3bd7e01b67872963b5084787b7d56dad706315 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Sun, 24 Oct 2021 09:05:10 +0200 Subject: [PATCH 3/7] Cleanup re-dispatching MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/components/structures/RoomView.tsx | 4 +++- src/components/views/messages/TextualBody.tsx | 6 ++++++ src/components/views/right_panel/UserInfo.tsx | 3 +++ src/components/views/rooms/EditMessageComposer.tsx | 7 ++++++- src/components/views/rooms/EventTile.tsx | 4 +++- src/components/views/rooms/MessageComposer.tsx | 9 ++++++--- src/components/views/rooms/SendMessageComposer.tsx | 6 +++++- 7 files changed, 32 insertions(+), 7 deletions(-) diff --git a/src/components/structures/RoomView.tsx b/src/components/structures/RoomView.tsx index 6338ce0c60f..33fde6e5098 100644 --- a/src/components/structures/RoomView.tsx +++ b/src/components/structures/RoomView.tsx @@ -94,6 +94,7 @@ import { logger } from "matrix-js-sdk/src/logger"; import { EventTimeline } from 'matrix-js-sdk/src/models/event-timeline'; import { dispatchShowThreadEvent } from '../../dispatcher/dispatch-actions/threads'; import { fetchInitialEvent } from "../../utils/EventUtils"; +import { ComposerType } from "../../dispatcher/payloads/ComposerInsertPayload"; const DEBUG = false; let debuglog = function(msg: string) {}; @@ -864,10 +865,11 @@ export class RoomView extends React.Component { } case Action.ComposerInsert: { + if (payload.composerType) break; // re-dispatch to the correct composer dis.dispatch({ ...payload, - action: this.state.editState ? "edit_composer_insert" : "send_composer_insert", + composerType: this.state.editState ? ComposerType.Edit : ComposerType.Send, }); break; } diff --git a/src/components/views/messages/TextualBody.tsx b/src/components/views/messages/TextualBody.tsx index b8e068ed75c..966325ef6da 100644 --- a/src/components/views/messages/TextualBody.tsx +++ b/src/components/views/messages/TextualBody.tsx @@ -44,6 +44,7 @@ import MessageEditHistoryDialog from "../dialogs/MessageEditHistoryDialog"; import EditMessageComposer from '../rooms/EditMessageComposer'; import LinkPreviewGroup from '../rooms/LinkPreviewGroup'; import { IBodyProps } from "./IBodyProps"; +import RoomContext from "../../../contexts/RoomContext"; const MAX_HIGHLIGHT_LENGTH = 4096; @@ -62,6 +63,9 @@ export default class TextualBody extends React.Component { private unmounted = false; private pills: Element[] = []; + static contextType = RoomContext; + public context!: React.ContextType; + constructor(props) { super(props); @@ -406,6 +410,8 @@ export default class TextualBody extends React.Component { dis.dispatch({ action: Action.ComposerInsert, userId: mxEvent.getSender(), + timelineRenderingType: this.context.timelineRenderingType, + composerType: null, }); }; diff --git a/src/components/views/right_panel/UserInfo.tsx b/src/components/views/right_panel/UserInfo.tsx index 195cf03af45..7dc833463aa 100644 --- a/src/components/views/right_panel/UserInfo.tsx +++ b/src/components/views/right_panel/UserInfo.tsx @@ -76,6 +76,7 @@ import { bulkSpaceBehaviour } from "../../../utils/space"; import { logger } from "matrix-js-sdk/src/logger"; import { shouldShowComponent } from "../../../customisations/helpers/UIComponents"; import { UIComponent } from "../../../settings/UIFeature"; +import { TimelineRenderingType } from "../../../contexts/RoomContext"; export interface IDevice { deviceId: string; @@ -378,6 +379,8 @@ const UserOptionsSection: React.FC<{ dis.dispatch({ action: Action.ComposerInsert, userId: member.userId, + timelineRenderingType: TimelineRenderingType.Room, + composerType: null, }); }; diff --git a/src/components/views/rooms/EditMessageComposer.tsx b/src/components/views/rooms/EditMessageComposer.tsx index 1e0a3677720..a74e62e014d 100644 --- a/src/components/views/rooms/EditMessageComposer.tsx +++ b/src/components/views/rooms/EditMessageComposer.tsx @@ -47,6 +47,7 @@ import SettingsStore from "../../../settings/SettingsStore"; import { logger } from "matrix-js-sdk/src/logger"; import { withMatrixClientHOC, MatrixClientProps } from '../../../contexts/MatrixClientContext'; import RoomContext from '../../../contexts/RoomContext'; +import { ComposerType } from "../../../dispatcher/payloads/ComposerInsertPayload"; function getHtmlReplyFallback(mxEvent: MatrixEvent): string { const html = mxEvent.getContent().formatted_body; @@ -499,7 +500,11 @@ class EditMessageComposer extends React.Component { - if (payload.action === "edit_composer_insert" && this.editorRef.current) { + if (payload.action === Action.ComposerInsert) { + if (!this.editorRef.current) return; + if (payload.timelineRenderingType !== this.context.timelineRenderingType) return; + if (payload.composerType !== ComposerType.Edit) return; + if (payload.userId) { this.editorRef.current?.insertMention(payload.userId); } else if (payload.event) { diff --git a/src/components/views/rooms/EventTile.tsx b/src/components/views/rooms/EventTile.tsx index f77e7741d7f..92de23d9d76 100644 --- a/src/components/views/rooms/EventTile.tsx +++ b/src/components/views/rooms/EventTile.tsx @@ -862,6 +862,8 @@ export default class EventTile extends React.Component { dis.dispatch({ action: Action.ComposerInsert, userId: mxEvent.getSender(), + timelineRenderingType: this.context.timelineRenderingType, + composerType: null, }); }; @@ -1094,7 +1096,7 @@ export default class EventTile extends React.Component { } if (needsSenderProfile && this.props.hideSender !== true) { - if (!this.props.tileShape) { + if (!this.props.tileShape || this.props.tileShape === TileShape.Thread) { sender = { private ref: React.RefObject = createRef(); private instanceId: number; - public static contextType = RoomContext; + static contextType = RoomContext; + public context!: React.ContextType; static defaultProps = { compact: false, @@ -398,13 +399,15 @@ export default class MessageComposer extends React.Component { } }; - private addEmoji(emoji: string): boolean { + private addEmoji = (emoji: string): boolean => { dis.dispatch({ action: Action.ComposerInsert, text: emoji, + timelineRenderingType: this.context.timelineRenderingType, + composerType: null, }); return true; - } + }; private sendMessage = async () => { if (this.state.haveRecording && this.voiceRecordingButton.current) { diff --git a/src/components/views/rooms/SendMessageComposer.tsx b/src/components/views/rooms/SendMessageComposer.tsx index c32a31f2494..35bc85ba235 100644 --- a/src/components/views/rooms/SendMessageComposer.tsx +++ b/src/components/views/rooms/SendMessageComposer.tsx @@ -58,6 +58,7 @@ import { ActionPayload } from "../../../dispatcher/payloads"; import { decorateStartSendingTime, sendRoundTripMetric } from "../../../sendTimePerformanceMetrics"; import RoomContext from '../../../contexts/RoomContext'; import DocumentPosition from "../../../editor/position"; +import { ComposerType } from "../../../dispatcher/payloads/ComposerInsertPayload"; function addReplyToMessageContent( content: IContent, @@ -591,7 +592,10 @@ export class SendMessageComposer extends React.Component Date: Mon, 25 Oct 2021 11:18:30 +0200 Subject: [PATCH 4/7] Simplifie code MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/components/views/rooms/EditMessageComposer.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/components/views/rooms/EditMessageComposer.tsx b/src/components/views/rooms/EditMessageComposer.tsx index a74e62e014d..8fd54a6a7fb 100644 --- a/src/components/views/rooms/EditMessageComposer.tsx +++ b/src/components/views/rooms/EditMessageComposer.tsx @@ -500,8 +500,9 @@ class EditMessageComposer extends React.Component { + if (!this.editorRef.current) return; + if (payload.action === Action.ComposerInsert) { - if (!this.editorRef.current) return; if (payload.timelineRenderingType !== this.context.timelineRenderingType) return; if (payload.composerType !== ComposerType.Edit) return; @@ -512,7 +513,7 @@ class EditMessageComposer extends React.Component Date: Mon, 25 Oct 2021 11:20:10 +0200 Subject: [PATCH 5/7] Make composerType optional MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/components/views/messages/TextualBody.tsx | 1 - src/components/views/right_panel/UserInfo.tsx | 1 - src/components/views/rooms/EventTile.tsx | 1 - src/components/views/rooms/MessageComposer.tsx | 1 - src/dispatcher/payloads/ComposerInsertPayload.ts | 2 +- 5 files changed, 1 insertion(+), 5 deletions(-) diff --git a/src/components/views/messages/TextualBody.tsx b/src/components/views/messages/TextualBody.tsx index 966325ef6da..66a5cc8b544 100644 --- a/src/components/views/messages/TextualBody.tsx +++ b/src/components/views/messages/TextualBody.tsx @@ -411,7 +411,6 @@ export default class TextualBody extends React.Component { action: Action.ComposerInsert, userId: mxEvent.getSender(), timelineRenderingType: this.context.timelineRenderingType, - composerType: null, }); }; diff --git a/src/components/views/right_panel/UserInfo.tsx b/src/components/views/right_panel/UserInfo.tsx index 7dc833463aa..7b16fe38788 100644 --- a/src/components/views/right_panel/UserInfo.tsx +++ b/src/components/views/right_panel/UserInfo.tsx @@ -380,7 +380,6 @@ const UserOptionsSection: React.FC<{ action: Action.ComposerInsert, userId: member.userId, timelineRenderingType: TimelineRenderingType.Room, - composerType: null, }); }; diff --git a/src/components/views/rooms/EventTile.tsx b/src/components/views/rooms/EventTile.tsx index 92de23d9d76..239e6265ddd 100644 --- a/src/components/views/rooms/EventTile.tsx +++ b/src/components/views/rooms/EventTile.tsx @@ -863,7 +863,6 @@ export default class EventTile extends React.Component { action: Action.ComposerInsert, userId: mxEvent.getSender(), timelineRenderingType: this.context.timelineRenderingType, - composerType: null, }); }; diff --git a/src/components/views/rooms/MessageComposer.tsx b/src/components/views/rooms/MessageComposer.tsx index b80988b76b0..fbbecb8a2e2 100644 --- a/src/components/views/rooms/MessageComposer.tsx +++ b/src/components/views/rooms/MessageComposer.tsx @@ -404,7 +404,6 @@ export default class MessageComposer extends React.Component { action: Action.ComposerInsert, text: emoji, timelineRenderingType: this.context.timelineRenderingType, - composerType: null, }); return true; }; diff --git a/src/dispatcher/payloads/ComposerInsertPayload.ts b/src/dispatcher/payloads/ComposerInsertPayload.ts index b59631a7074..8fc1c4b9314 100644 --- a/src/dispatcher/payloads/ComposerInsertPayload.ts +++ b/src/dispatcher/payloads/ComposerInsertPayload.ts @@ -28,7 +28,7 @@ export enum ComposerType { interface IBaseComposerInsertPayload extends ActionPayload { action: Action.ComposerInsert; timelineRenderingType: TimelineRenderingType; - composerType: ComposerType | null; // null if should be re-dispatched to the correct composer + composerType?: ComposerType; // null/undefined if should be re-dispatched to the correct composer } interface IComposerInsertMentionPayload extends IBaseComposerInsertPayload { From e905dfeaa76ea372cb3e29b4e9c104270459a913 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Mon, 25 Oct 2021 12:11:52 +0200 Subject: [PATCH 6/7] Use MatrixClientContext in EventTile and pass timelineRenderingType as a prop MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/components/structures/MessagePanel.tsx | 2 + src/components/views/rooms/EventTile.tsx | 50 +++++++++++----------- 2 files changed, 27 insertions(+), 25 deletions(-) diff --git a/src/components/structures/MessagePanel.tsx b/src/components/structures/MessagePanel.tsx index 46604236787..6a204775dc0 100644 --- a/src/components/structures/MessagePanel.tsx +++ b/src/components/structures/MessagePanel.tsx @@ -196,6 +196,7 @@ interface IReadReceiptForUser { @replaceableComponent("structures.MessagePanel") export default class MessagePanel extends React.Component { static contextType = RoomContext; + public context!: React.ContextType; // opaque readreceipt info for each userId; used by ReadReceiptMarker // to manage its animations @@ -787,6 +788,7 @@ export default class MessagePanel extends React.Component { showReadReceipts={this.props.showReadReceipts} callEventGrouper={callEventGrouper} hideSender={this.membersCount <= 2 && this.props.layout === Layout.Bubble} + timelineRenderingType={this.context.timelineRenderingType} /> , ); diff --git a/src/components/views/rooms/EventTile.tsx b/src/components/views/rooms/EventTile.tsx index 239e6265ddd..8f9915132e8 100644 --- a/src/components/views/rooms/EventTile.tsx +++ b/src/components/views/rooms/EventTile.tsx @@ -32,6 +32,7 @@ import { Layout } from "../../../settings/Layout"; import { formatTime } from "../../../DateUtils"; import { MatrixClientPeg } from '../../../MatrixClientPeg'; import { ALL_RULE_TYPES } from "../../../mjolnir/BanList"; +import MatrixClientContext from "../../../contexts/MatrixClientContext"; import { E2EState } from "./E2EIcon"; import { toRem } from "../../../utils/units"; import { WidgetType } from "../../../widgets/WidgetType"; @@ -61,7 +62,7 @@ import { dispatchShowThreadEvent } from '../../../dispatcher/dispatch-actions/th import { MessagePreviewStore } from '../../../stores/room-list/MessagePreviewStore'; import { logger } from "matrix-js-sdk/src/logger"; -import RoomContext from "../../../contexts/RoomContext"; +import { TimelineRenderingType } from "../../../contexts/RoomContext"; const eventTileTypes = { [EventType.RoomMessage]: 'messages.MessageEvent', @@ -313,6 +314,8 @@ interface IProps { // whether or not to display thread info showThreadInfo?: boolean; + + timelineRenderingType?: TimelineRenderingType; } interface IState { @@ -350,8 +353,7 @@ export default class EventTile extends React.Component { layout: Layout.Group, }; - static contextType = RoomContext; - public context!: React.ContextType; + static contextType = MatrixClientContext; constructor(props, context) { super(props, context); @@ -396,7 +398,7 @@ export default class EventTile extends React.Component { if (!this.props.mxEvent) return false; // Sanity check (should never happen, but we shouldn't explode if it does) - const room = MatrixClientPeg.get().getRoom(this.props.mxEvent.getRoomId()); + const room = this.context.getRoom(this.props.mxEvent.getRoomId()); if (!room) return false; // Quickly check to see if the event was sent by us. If it wasn't, it won't qualify for @@ -460,7 +462,7 @@ export default class EventTile extends React.Component { componentDidMount() { this.suppressReadReceiptAnimation = false; - const client = MatrixClientPeg.get(); + const client = this.context; if (!this.props.forExport) { client.on("deviceVerificationChanged", this.onDeviceVerificationChanged); client.on("userTrustStatusChanged", this.onUserVerificationChanged); @@ -480,7 +482,7 @@ export default class EventTile extends React.Component { this.props.mxEvent.on(ThreadEvent.Update, this.updateThread); } - const room = MatrixClientPeg.get().getRoom(this.props.mxEvent.getRoomId()); + const room = this.context.getRoom(this.props.mxEvent.getRoomId()); room?.on(ThreadEvent.New, this.onNewThread); } @@ -510,7 +512,7 @@ export default class EventTile extends React.Component { } componentWillUnmount() { - const client = MatrixClientPeg.get(); + const client = this.context; client.removeListener("deviceVerificationChanged", this.onDeviceVerificationChanged); client.removeListener("userTrustStatusChanged", this.onUserVerificationChanged); client.removeListener("Room.receipt", this.onRoomReceipt); @@ -524,14 +526,14 @@ export default class EventTile extends React.Component { this.props.mxEvent.off(ThreadEvent.Update, this.updateThread); } - const room = MatrixClientPeg.get().getRoom(this.props.mxEvent.getRoomId()); + const room = this.context.getRoom(this.props.mxEvent.getRoomId()); room?.off(ThreadEvent.New, this.onNewThread); } componentDidUpdate(prevProps, prevState, snapshot) { // If we're not listening for receipts and expect to be, register a listener. if (!this.isListeningForReceipts && (this.shouldShowSentReceipt || this.shouldShowSendingReceipt)) { - MatrixClientPeg.get().on("Room.receipt", this.onRoomReceipt); + this.context.on("Room.receipt", this.onRoomReceipt); this.isListeningForReceipts = true; } } @@ -539,7 +541,7 @@ export default class EventTile extends React.Component { private onNewThread = (thread: Thread) => { if (thread.id === this.props.mxEvent.getId()) { this.updateThread(thread); - const room = MatrixClientPeg.get().getRoom(this.props.mxEvent.getRoomId()); + const room = this.context.getRoom(this.props.mxEvent.getRoomId()); room.off(ThreadEvent.New, this.onNewThread); } }; @@ -612,7 +614,7 @@ export default class EventTile extends React.Component { this.forceUpdate(() => { // Per elsewhere in this file, we can remove the listener once we will have no further purpose for it. if (!this.shouldShowSentReceipt && !this.shouldShowSendingReceipt) { - MatrixClientPeg.get().removeListener("Room.receipt", this.onRoomReceipt); + this.context.removeListener("Room.receipt", this.onRoomReceipt); this.isListeningForReceipts = false; } }); @@ -645,9 +647,9 @@ export default class EventTile extends React.Component { return; } - const encryptionInfo = MatrixClientPeg.get().getEventEncryptionInfo(mxEvent); + const encryptionInfo = this.context.getEventEncryptionInfo(mxEvent); const senderId = mxEvent.getSender(); - const userTrust = MatrixClientPeg.get().checkUserTrust(senderId); + const userTrust = this.context.checkUserTrust(senderId); if (encryptionInfo.mismatchedSender) { // something definitely wrong is going on here @@ -665,7 +667,7 @@ export default class EventTile extends React.Component { return; } - const eventSenderTrust = encryptionInfo.sender && MatrixClientPeg.get().checkDeviceTrust( + const eventSenderTrust = encryptionInfo.sender && this.context.checkDeviceTrust( senderId, encryptionInfo.sender.deviceId, ); if (!eventSenderTrust) { @@ -744,13 +746,11 @@ export default class EventTile extends React.Component { shouldHighlight() { if (this.props.forExport) return false; - const actions = MatrixClientPeg.get().getPushActionsForEvent( - this.props.mxEvent.replacingEvent() || this.props.mxEvent, - ); + const actions = this.context.getPushActionsForEvent(this.props.mxEvent.replacingEvent() || this.props.mxEvent); if (!actions || !actions.tweaks) { return false; } // don't show self-highlights from another of our clients - if (this.props.mxEvent.getSender() === MatrixClientPeg.get().credentials.userId) { + if (this.props.mxEvent.getSender() === this.context.credentials.userId) { return false; } @@ -858,11 +858,11 @@ export default class EventTile extends React.Component { } onSenderProfileClick = () => { - const mxEvent = this.props.mxEvent; + if (!this.props.timelineRenderingType) return; dis.dispatch({ action: Action.ComposerInsert, - userId: mxEvent.getSender(), - timelineRenderingType: this.context.timelineRenderingType, + userId: this.props.mxEvent.getSender(), + timelineRenderingType: this.props.timelineRenderingType, }); }; @@ -876,7 +876,7 @@ export default class EventTile extends React.Component { // Cancel any outgoing key request for this event and resend it. If a response // is received for the request with the required keys, the event could be // decrypted successfully. - MatrixClientPeg.get().cancelAndResendEventRoomKeyRequest(this.props.mxEvent); + this.context.cancelAndResendEventRoomKeyRequest(this.props.mxEvent); }; onPermalinkClicked = e => { @@ -914,7 +914,7 @@ export default class EventTile extends React.Component { } } - if (MatrixClientPeg.get().isRoomEncrypted(ev.getRoomId())) { + if (this.context.isRoomEncrypted(ev.getRoomId())) { // else if room is encrypted // and event is being encrypted or is not_sent (Unknown Devices/Network Error) if (ev.status === EventStatus.ENCRYPTING) { @@ -1189,7 +1189,7 @@ export default class EventTile extends React.Component { switch (this.props.tileShape) { case TileShape.Notif: { - const room = MatrixClientPeg.get().getRoom(this.props.mxEvent.getRoomId()); + const room = this.context.getRoom(this.props.mxEvent.getRoomId()); return React.createElement(this.props.as || "li", { "className": classes, "aria-live": ariaLive, @@ -1236,7 +1236,7 @@ export default class EventTile extends React.Component { isQuoteExpanded={isQuoteExpanded} setQuoteExpanded={this.setQuoteExpanded} />) : null; - const room = MatrixClientPeg.get().getRoom(this.props.mxEvent.getRoomId()); + const room = this.context.getRoom(this.props.mxEvent.getRoomId()); return React.createElement(this.props.as || "li", { "className": classes, "aria-live": ariaLive, From c61e02d33ab4ead8c5d58c049bbf3ced0638eeaf Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Mon, 25 Oct 2021 13:37:36 +0200 Subject: [PATCH 7/7] null/undefined -> falsey Co-authored-by: Michael Telatynski <7t3chguy@gmail.com> --- src/dispatcher/payloads/ComposerInsertPayload.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/dispatcher/payloads/ComposerInsertPayload.ts b/src/dispatcher/payloads/ComposerInsertPayload.ts index 8fc1c4b9314..e5aab51a215 100644 --- a/src/dispatcher/payloads/ComposerInsertPayload.ts +++ b/src/dispatcher/payloads/ComposerInsertPayload.ts @@ -28,7 +28,7 @@ export enum ComposerType { interface IBaseComposerInsertPayload extends ActionPayload { action: Action.ComposerInsert; timelineRenderingType: TimelineRenderingType; - composerType?: ComposerType; // null/undefined if should be re-dispatched to the correct composer + composerType?: ComposerType; // falsey if should be re-dispatched to the correct composer } interface IComposerInsertMentionPayload extends IBaseComposerInsertPayload {