imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Wrap EventTile rather than its children in an error boundary (#7945)

Browse source
This commit is contained in:
Michael Telatynski 2022-03-09 11:22:36 +00:00 • committed by GitHub
parent a75100ef86
commit 782ce016d1
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 26 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/components/structures/MessagePanel.tsx
View file

@ -31,7 +31,7 @@ import SettingsStore from '../../settings/SettingsStore';
import RoomContext, { TimelineRenderingType } from "../../contexts/RoomContext";
import { Layout } from "../../settings/enums/Layout";
import { _t } from "../../languageHandler";
import EventTile, { haveTileForEvent, IReadReceiptProps } from "../views/rooms/EventTile";
import EventTile, { UnwrappedEventTile, haveTileForEvent, IReadReceiptProps } from "../views/rooms/EventTile";
import { hasText } from "../../TextForEvent";
import IRCTimelineProfileResizer from "../views/elements/IRCTimelineProfileResizer";
import DMRoomMap from "../../utils/DMRoomMap";
@ -251,7 +251,7 @@ export default class MessagePanel extends React.Component<IProps, IState> {
private scrollPanel = createRef<ScrollPanel>();
private readonly showTypingNotificationsWatcherRef: string;
private eventTiles: Record<string, EventTile> = {};
private eventTiles: Record<string, UnwrappedEventTile> = {};
// A map to allow groupers to maintain consistent keys even if their first event is uprooted due to back-pagination.
public grouperKeyMap = new WeakMap<MatrixEvent, string>();
@ -336,7 +336,7 @@ export default class MessagePanel extends React.Component<IProps, IState> {
return this.eventTiles[eventId]?.ref?.current;
}
public getTileForEventId(eventId: string): EventTile {
public getTileForEventId(eventId: string): UnwrappedEventTile {
if (!this.eventTiles) {
return undefined;
}
@ -919,7 +919,7 @@ export default class MessagePanel extends React.Component<IProps, IState> {
return receiptsByEvent;
}
private collectEventTile = (eventId: string, node: EventTile): void => {
private collectEventTile = (eventId: string, node: UnwrappedEventTile): void => {
this.eventTiles[eventId] = node;
};

20
src/components/views/rooms/EventTile.tsx
View file

@ -15,7 +15,7 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import React, { createRef, MouseEvent } from 'react';
import React, { createRef, forwardRef, MouseEvent, RefObject } from 'react';
import classNames from "classnames";
import { EventType, MsgType, RelationType } from "matrix-js-sdk/src/@types/event";
import { EventStatus, MatrixEvent, MatrixEventEvent } from "matrix-js-sdk/src/models/event";
@ -356,7 +356,7 @@ interface IState {
// MUST be rendered within a RoomContext with a set timelineRenderingType
@replaceableComponent("views.rooms.EventTile")
export default class EventTile extends React.Component<IProps, IState> {
export class UnwrappedEventTile extends React.Component<IProps, IState> {
private suppressReadReceiptAnimation: boolean;
private isListeningForReceipts: boolean;
// TODO: Types
@ -1129,7 +1129,7 @@ export default class EventTile extends React.Component<IProps, IState> {
return false;
}
private renderEvent() {
public render() {
const msgtype = this.props.mxEvent.getContent().msgtype;
const eventType = this.props.mxEvent.getType() as EventType;
const {
@ -1652,14 +1652,16 @@ export default class EventTile extends React.Component<IProps, IState> {
}
}
}
public render() {
return <TileErrorBoundary mxEvent={this.props.mxEvent} layout={this.props.layout}>
{ this.renderEvent() }
</TileErrorBoundary>;
}
}
// Wrap all event tiles with the tile error boundary so that any throws even during construction are captured
const SafeEventTile = forwardRef((props: IProps, ref: RefObject<UnwrappedEventTile>) => {
return <TileErrorBoundary mxEvent={props.mxEvent} layout={props.layout}>
<UnwrappedEventTile ref={ref} {...props} />
</TileErrorBoundary>;
});
export default SafeEventTile;
// XXX this'll eventually be dynamic based on the fields once we have extensible event types
const messageTypes = [EventType.RoomMessage, EventType.Sticker];
function isMessageEvent(ev: MatrixEvent): boolean {