diff --git a/src/components/structures/RoomSubList.js b/src/components/structures/RoomSubList.js index 1e3e15b4ec..4e8e51c3cc 100644 --- a/src/components/structures/RoomSubList.js +++ b/src/components/structures/RoomSubList.js @@ -37,6 +37,42 @@ import toRem from "../../utils/rem"; // turn this on for drop & drag console debugging galore const debug = false; +class RoomTileErrorBoundary extends React.PureComponent { + constructor(props) { + super(props); + + this.state = { + error: null, + }; + } + + static getDerivedStateFromError(error) { + // Side effects are not permitted here, so we only update the state so + // that the next render shows an error message. + return { error }; + } + + componentDidCatch(error, { componentStack }) { + // Browser consoles are better at formatting output when native errors are passed + // in their own `console.error` invocation. + console.error(error); + console.error( + "The above error occured while React was rendering the following components:", + componentStack, + ); + } + + render() { + if (this.state.error) { + return (
+ {this.props.roomId} +
); + } else { + return this.props.children; + } + } +} + export default class RoomSubList extends React.PureComponent { static displayName = 'RoomSubList'; static debug = debug; @@ -208,7 +244,7 @@ export default class RoomSubList extends React.PureComponent { }; makeRoomTile = (room) => { - return ; + />; }; _onNotifBadgeClick = (e) => { diff --git a/src/components/views/rooms/RoomTile.js b/src/components/views/rooms/RoomTile.js index f157ee0df7..6a23fe309b 100644 --- a/src/components/views/rooms/RoomTile.js +++ b/src/components/views/rooms/RoomTile.js @@ -432,10 +432,9 @@ export default createReactClass({ }); let name = this.state.roomName; - if (name == undefined || name == null) name = ''; + if (typeof name !== 'string') name = ''; name = name.replace(":", ":\u200b"); // add a zero-width space to allow linewrapping after the colon - let badge; if (badges) { const limitedCount = FormattingUtils.formatCount(notificationCount);