From bb88559f5f92732147cf627cc723d459cf375103 Mon Sep 17 00:00:00 2001
From: Dariusz Niemczyk <dariuszn@element.io>
Date: Fri, 1 Oct 2021 13:40:08 +0200
Subject: [PATCH] Fix PR comments

---
 src/components/structures/MessagePanel.tsx         |  4 ++--
 src/components/structures/RoomView.tsx             |  8 ++++----
 src/components/structures/ThreadView.tsx           |  6 +++---
 src/components/views/messages/MessageActionBar.tsx |  6 +++---
 src/components/views/rooms/EditMessageComposer.tsx | 12 ++++++------
 src/components/views/rooms/SendMessageComposer.tsx | 14 ++++----------
 src/contexts/RoomContext.ts                        |  4 ++--
 7 files changed, 24 insertions(+), 30 deletions(-)

diff --git a/src/components/structures/MessagePanel.tsx b/src/components/structures/MessagePanel.tsx
index 364dd5fca0f3..10ff34feb0fa 100644
--- a/src/components/structures/MessagePanel.tsx
+++ b/src/components/structures/MessagePanel.tsx
@@ -295,7 +295,7 @@ export default class MessagePanel extends React.Component<IProps, IState> {
             defaultDispatcher.dispatch({
                 action: Action.EditEvent,
                 event: this.props.room.findEventById(pendingEditItem),
-                renderingContext: this.context.renderingContext,
+                timelineRenderingType: this.context.timelineRenderingType,
             });
         }
     }
@@ -563,7 +563,7 @@ export default class MessagePanel extends React.Component<IProps, IState> {
 
     private get pendingEditItem(): string | undefined {
         try {
-            return localStorage.getItem(`mx_edit_room_${this.props.room.roomId}_${this.context.renderingContext}`);
+            return localStorage.getItem(`mx_edit_room_${this.props.room.roomId}_${this.context.timelineRenderingType}`);
         } catch (err) {
             logger.error(err);
             return undefined;
diff --git a/src/components/structures/RoomView.tsx b/src/components/structures/RoomView.tsx
index ea8abec52271..aa5342574f17 100644
--- a/src/components/structures/RoomView.tsx
+++ b/src/components/structures/RoomView.tsx
@@ -48,7 +48,7 @@ import { Layout } from "../../settings/Layout";
 import AccessibleButton from "../views/elements/AccessibleButton";
 import RightPanelStore from "../../stores/RightPanelStore";
 import { haveTileForEvent } from "../views/rooms/EventTile";
-import RoomContext, { AppRenderingContext } from "../../contexts/RoomContext";
+import RoomContext, { TimelineRenderingType } from "../../contexts/RoomContext";
 import MatrixClientContext, { withMatrixClientHOC, MatrixClientProps } from "../../contexts/MatrixClientContext";
 import { E2EStatus, shieldStatusForRoom } from '../../utils/ShieldUtils';
 import { Action } from "../../dispatcher/actions";
@@ -188,7 +188,7 @@ export interface IRoomState {
     // if it did we don't want the room to be marked as read as soon as it is loaded.
     wasContextSwitch?: boolean;
     editState?: EditorStateTransfer;
-    renderingContext: AppRenderingContext;
+    timelineRenderingType: TimelineRenderingType;
     liveTimeline?: EventTimeline;
 }
 
@@ -250,7 +250,7 @@ class RoomView extends React.Component<IRoomProps, IRoomState> {
             showDisplaynameChanges: true,
             matrixClientIsReady: this.context && this.context.isInitialSyncComplete(),
             dragCounter: 0,
-            renderingContext: AppRenderingContext.Room,
+            timelineRenderingType: TimelineRenderingType.Room,
             liveTimeline: undefined,
         };
 
@@ -815,7 +815,7 @@ class RoomView extends React.Component<IRoomProps, IRoomState> {
 
             case Action.EditEvent: {
                 // Quit early if we're trying to edit events in wrong rendering context
-                if (payload.renderingContext !== this.state.renderingContext) return;
+                if (payload.timelineRenderingType !== this.state.timelineRenderingType) return;
                 const editState = payload.event ? new EditorStateTransfer(payload.event) : null;
                 this.setState({ editState }, () => {
                     if (payload.event) {
diff --git a/src/components/structures/ThreadView.tsx b/src/components/structures/ThreadView.tsx
index 54e92c2a6f30..bbddbcd54d49 100644
--- a/src/components/structures/ThreadView.tsx
+++ b/src/components/structures/ThreadView.tsx
@@ -35,7 +35,7 @@ import { Action } from '../../dispatcher/actions';
 import { MatrixClientPeg } from '../../MatrixClientPeg';
 import { E2EStatus } from '../../utils/ShieldUtils';
 import EditorStateTransfer from '../../utils/EditorStateTransfer';
-import RoomContext, { AppRenderingContext } from '../../contexts/RoomContext';
+import RoomContext, { TimelineRenderingType } from '../../contexts/RoomContext';
 
 interface IProps {
     room: Room;
@@ -99,7 +99,7 @@ export default class ThreadView extends React.Component<IProps, IState> {
         switch (payload.action) {
             case Action.EditEvent: {
                 // Quit early if it's not a thread context
-                if (payload.renderingContext !== AppRenderingContext.Thread) return;
+                if (payload.timelineRenderingType !== TimelineRenderingType.Thread) return;
                 // Quit early if that's not a thread event
                 if (payload.event && !payload.event.getThread()) return;
                 const editState = payload.event ? new EditorStateTransfer(payload.event) : null;
@@ -149,7 +149,7 @@ export default class ThreadView extends React.Component<IProps, IState> {
         return (
             <RoomContext.Provider value={{
                 ...this.context,
-                renderingContext: AppRenderingContext.Thread,
+                timelineRenderingType: TimelineRenderingType.Thread,
                 liveTimeline: this.state?.thread?.timelineSet?.getLiveTimeline(),
             }}>
 
diff --git a/src/components/views/messages/MessageActionBar.tsx b/src/components/views/messages/MessageActionBar.tsx
index 90f0bbe85255..7ee951a812ac 100644
--- a/src/components/views/messages/MessageActionBar.tsx
+++ b/src/components/views/messages/MessageActionBar.tsx
@@ -27,7 +27,7 @@ import { Action } from '../../../dispatcher/actions';
 import { RightPanelPhases } from '../../../stores/RightPanelStorePhases';
 import { aboveLeftOf, ContextMenu, ContextMenuTooltipButton, useContextMenu } from '../../structures/ContextMenu';
 import { isContentActionable, canEditContent } from '../../../utils/EventUtils';
-import RoomContext, { AppRenderingContext } from "../../../contexts/RoomContext";
+import RoomContext, { TimelineRenderingType } from "../../../contexts/RoomContext";
 import Toolbar from "../../../accessibility/Toolbar";
 import { RovingAccessibleTooltipButton, useRovingTabIndex } from "../../../accessibility/RovingTabIndex";
 import { replaceableComponent } from "../../../utils/replaceableComponent";
@@ -209,7 +209,7 @@ export default class MessageActionBar extends React.PureComponent<IMessageAction
         dis.dispatch({
             action: Action.EditEvent,
             event: this.props.mxEvent,
-            renderingContext: this.context.renderingContext,
+            timelineRenderingType: this.context.timelineRenderingType,
         });
     };
 
@@ -289,7 +289,7 @@ export default class MessageActionBar extends React.PureComponent<IMessageAction
                 // Like the resend button, the react and reply buttons need to appear before the edit.
                 // The only catch is we do the reply button first so that we can make sure the react
                 // button is the very first button without having to do length checks for `splice()`.
-                if (this.context.canReply && this.context.renderingContext === AppRenderingContext.Room) {
+                if (this.context.canReply && this.context.timelineRenderingType === TimelineRenderingType.Room) {
                     toolbarOpts.splice(0, 0, <>
                         <RovingAccessibleTooltipButton
                             className="mx_MessageActionBar_maskButton mx_MessageActionBar_replyButton"
diff --git a/src/components/views/rooms/EditMessageComposer.tsx b/src/components/views/rooms/EditMessageComposer.tsx
index 00924c20a480..bc1ebe881ce8 100644
--- a/src/components/views/rooms/EditMessageComposer.tsx
+++ b/src/components/views/rooms/EditMessageComposer.tsx
@@ -171,7 +171,7 @@ class EditMessageComposer extends React.Component<IEditMessageComposerProps, ISt
                     dis.dispatch({
                         action: Action.EditEvent,
                         event: previousEvent,
-                        renderingContext: this.context.renderingContext,
+                        timelineRenderingType: this.context.timelineRenderingType,
                     });
                     event.preventDefault();
                 }
@@ -190,14 +190,14 @@ class EditMessageComposer extends React.Component<IEditMessageComposerProps, ISt
                     dis.dispatch({
                         action: Action.EditEvent,
                         event: nextEvent,
-                        renderingContext: this.context.renderingContext,
+                        timelineRenderingType: this.context.timelineRenderingType,
                     });
                 } else {
                     this.clearStoredEditorState();
                     dis.dispatch({
                         action: Action.EditEvent,
                         event: null,
-                        renderingContext: this.context.renderingContext,
+                        timelineRenderingType: this.context.timelineRenderingType,
                     });
                     dis.fire(Action.FocusSendMessageComposer);
                 }
@@ -208,7 +208,7 @@ class EditMessageComposer extends React.Component<IEditMessageComposerProps, ISt
     };
 
     private get editorRoomKey(): string {
-        return `mx_edit_room_${this.getRoom().roomId}_${this.context.renderingContext}`;
+        return `mx_edit_room_${this.getRoom().roomId}_${this.context.timelineRenderingType}`;
     }
 
     private get editorStateKey(): string {
@@ -227,7 +227,7 @@ class EditMessageComposer extends React.Component<IEditMessageComposerProps, ISt
         dis.dispatch({
             action: Action.EditEvent,
             event: null,
-            renderingContext: this.context.renderingContext,
+            timelineRenderingType: this.context.timelineRenderingType,
         });
         dis.fire(Action.FocusSendMessageComposer);
     };
@@ -422,7 +422,7 @@ class EditMessageComposer extends React.Component<IEditMessageComposerProps, ISt
         dis.dispatch({
             action: Action.EditEvent,
             event: null,
-            renderingContext: this.context.renderingContext,
+            timelineRenderingType: this.context.timelineRenderingType,
         });
         dis.fire(Action.FocusSendMessageComposer);
     };
diff --git a/src/components/views/rooms/SendMessageComposer.tsx b/src/components/views/rooms/SendMessageComposer.tsx
index c5426fb2fd50..35a028aadce5 100644
--- a/src/components/views/rooms/SendMessageComposer.tsx
+++ b/src/components/views/rooms/SendMessageComposer.tsx
@@ -19,6 +19,7 @@ import EMOJI_REGEX from 'emojibase-regex';
 import { IContent, MatrixEvent } from 'matrix-js-sdk/src/models/event';
 import { DebouncedFunc, throttle } from 'lodash';
 import { EventType, RelationType } from "matrix-js-sdk/src/@types/event";
+import { logger } from "matrix-js-sdk/src/logger";
 
 import dis from '../../../dispatcher/dispatcher';
 import EditorModel from '../../../editor/model';
@@ -55,9 +56,6 @@ import ErrorDialog from "../dialogs/ErrorDialog";
 import QuestionDialog from "../dialogs/QuestionDialog";
 import { ActionPayload } from "../../../dispatcher/payloads";
 import { decorateStartSendingTime, sendRoundTripMetric } from "../../../sendTimePerformanceMetrics";
-
-import { logger } from "matrix-js-sdk/src/logger";
-import type { EventTimeline } from 'matrix-js-sdk/src/models/event-timeline';
 import RoomContext from '../../../contexts/RoomContext';
 
 function addReplyToMessageContent(
@@ -134,7 +132,6 @@ export function isQuickReaction(model: EditorModel): boolean {
 
 interface ISendMessageComposerProps extends MatrixClientProps {
     room: Room;
-    liveTimeline: EventTimeline;
     placeholder?: string;
     permalinkCreator: RoomPermalinkCreator;
     replyInThread?: boolean;
@@ -146,8 +143,6 @@ interface ISendMessageComposerProps extends MatrixClientProps {
 @replaceableComponent("views.rooms.SendMessageComposer")
 export class SendMessageComposer extends React.Component<ISendMessageComposerProps> {
     static contextType = RoomContext;
-    context!: React.ContextType<typeof RoomContext>;
-
     private readonly prepareToEncrypt?: DebouncedFunc<() => void>;
     private readonly editorRef = createRef<BasicMessageComposer>();
     private model: EditorModel = null;
@@ -157,7 +152,6 @@ export class SendMessageComposer extends React.Component<ISendMessageComposerPro
 
     constructor(props: ISendMessageComposerProps, context: React.ContextType<typeof RoomContext>) {
         super(props);
-        this.context = context; // otherwise React will only set it prior to render due to type def above
         if (this.props.mxClient.isCryptoEnabled() && this.props.mxClient.isRoomEncrypted(this.props.room.roomId)) {
             this.prepareToEncrypt = throttle(() => {
                 this.props.mxClient.prepareToEncrypt(this.props.room);
@@ -206,7 +200,7 @@ export class SendMessageComposer extends React.Component<ISendMessageComposerPro
                 // selection must be collapsed and caret at start
                 if (this.editorRef.current?.isSelectionCollapsed() && this.editorRef.current?.isCaretAtStart()) {
                     const events =
-                        this.props.liveTimeline.getEvents()
+                        this.context.liveTimeline.getEvents()
                             .concat(this.props.replyInThread ? [] : this.props.room.getPendingEvents());
                     const editEvent = findEditableEvent({
                         events,
@@ -218,7 +212,7 @@ export class SendMessageComposer extends React.Component<ISendMessageComposerPro
                         dis.dispatch({
                             action: Action.EditEvent,
                             event: editEvent,
-                            renderingContext: this.context.renderingContext,
+                            timelineRenderingType: this.context.timelineRenderingType,
                         });
                     }
                 }
@@ -285,7 +279,7 @@ export class SendMessageComposer extends React.Component<ISendMessageComposerPro
     }
 
     private sendQuickReaction(): void {
-        const timeline = this.props.room.getLiveTimeline();
+        const timeline = this.context.liveTimeline();
         const events = timeline.getEvents();
         const reaction = this.model.parts[1].text;
         for (let i = events.length - 1; i >= 0; i--) {
diff --git a/src/contexts/RoomContext.ts b/src/contexts/RoomContext.ts
index 91ddabfb5317..a57c14d90f20 100644
--- a/src/contexts/RoomContext.ts
+++ b/src/contexts/RoomContext.ts
@@ -19,7 +19,7 @@ import { createContext } from "react";
 import { IRoomState } from "../components/structures/RoomView";
 import { Layout } from "../settings/Layout";
 
-export enum AppRenderingContext {
+export enum TimelineRenderingType {
     Room,
     Thread
 }
@@ -58,7 +58,7 @@ const RoomContext = createContext<IRoomState>({
     showDisplaynameChanges: true,
     matrixClientIsReady: false,
     dragCounter: 0,
-    renderingContext: AppRenderingContext.Room,
+    timelineRenderingType: TimelineRenderingType.Room,
     liveTimeline: undefined,
 });
 RoomContext.displayName = "RoomContext";