diff --git a/src/components/structures/RoomView.tsx b/src/components/structures/RoomView.tsx index 58e37606b2..54c2de7619 100644 --- a/src/components/structures/RoomView.tsx +++ b/src/components/structures/RoomView.tsx @@ -671,6 +671,7 @@ export class RoomView extends React.Component { // the RoomView instance if (initial) { newState.room = this.context.client!.getRoom(newState.roomId) || undefined; + newState.isRoomEncrypted = null; if (newState.room) { newState.showApps = this.shouldShowApps(newState.room); this.onRoomLoaded(newState.room); @@ -713,6 +714,14 @@ export class RoomView extends React.Component { if (initial) { this.setupRoom(newState.room, newState.roomId, !!newState.joining, !!newState.shouldPeek); } + + // We don't block the initial setup but we want to make it early to not block the timeline rendering + const isRoomEncrypted = await this.getIsRoomEncrypted(newState.roomId); + this.setState({ + isRoomEncrypted, + ...(isRoomEncrypted && + newState.roomId && { e2eStatus: RoomView.e2eStatusCache.get(newState.roomId) ?? E2EStatus.Warning }), + }); }; private onConnectedCalls = (): void => { @@ -863,7 +872,7 @@ export class RoomView extends React.Component { return isManuallyShown && widgets.length > 0; } - public async componentDidMount(): Promise { + public componentDidMount(): void { this.unmounted = false; this.dispatcherRef = defaultDispatcher.register(this.onAction); @@ -1482,24 +1491,17 @@ export class RoomView extends React.Component { private async updateE2EStatus(room: Room): Promise { if (!this.context.client || !this.state.isRoomEncrypted) return; - - // If crypto is not currently enabled, we aren't tracking devices at all, - // so we don't know what the answer is. Let's error on the safe side and show - // a warning for this case. - let e2eStatus = RoomView.e2eStatusCache.get(room.roomId) ?? E2EStatus.Warning; - // set the state immediately then update, so we don't scare the user into thinking the room is unencrypted + const e2eStatus = await this.cacheAndGetE2EStatus(room, this.context.client); + if (this.unmounted) return; this.setState({ e2eStatus }); - - if (this.context.client.getCrypto()) { - /* At this point, the user has encryption on and cross-signing on */ - e2eStatus = await this.cacheAndGetE2EStatus(room, this.context.client); - if (this.unmounted) return; - this.setState({ e2eStatus }); - } } private async cacheAndGetE2EStatus(room: Room, client: MatrixClient): Promise { - const e2eStatus = await shieldStatusForRoom(client, room); + let e2eStatus = RoomView.e2eStatusCache.get(room.roomId); + // set the state immediately then update, so we don't scare the user into thinking the room is unencrypted + if (e2eStatus) this.setState({ e2eStatus }); + + e2eStatus = await shieldStatusForRoom(client, room); RoomView.e2eStatusCache.set(room.roomId, e2eStatus); return e2eStatus; }