OpenCloud
/
riot-web
mirror of https://github.com/vector-im/riot-web
1
0
Fork 0
Code Issues Releases Wiki Activity

refactor to use functional component

pull/28211/head
Hubert Chathi 2024-10-22 14:39:56 -04:00
parent 9f2c1a1098
commit 0d186dd3ac
3 changed files with 270 additions and 307 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/views/rooms/MessageComposer.tsx
View File

@ -30,7 +30,7 @@ import E2EIcon from "./E2EIcon";
import SettingsStore from "../../../settings/SettingsStore"; import SettingsStore from "../../../settings/SettingsStore";
import { aboveLeftOf, MenuProps } from "../../structures/ContextMenu"; import { aboveLeftOf, MenuProps } from "../../structures/ContextMenu";
import ReplyPreview from "./ReplyPreview"; import ReplyPreview from "./ReplyPreview";
import UserIdentityWarning from "./UserIdentityWarning"; import { UserIdentityWarning } from "./UserIdentityWarning";
import { UPDATE_EVENT } from "../../../stores/AsyncStore"; import { UPDATE_EVENT } from "../../../stores/AsyncStore";
import VoiceRecordComposerTile from "./VoiceRecordComposerTile"; import VoiceRecordComposerTile from "./VoiceRecordComposerTile";
import { VoiceRecordingStore } from "../../../stores/VoiceRecordingStore"; import { VoiceRecordingStore } from "../../../stores/VoiceRecordingStore";
@ -672,7 +672,7 @@ export class MessageComposer extends React.Component<IProps, IState> {
<div className={classes} ref={this.ref} role="region" aria-label={_t("a11y|message_composer")}> <div className={classes} ref={this.ref} role="region" aria-label={_t("a11y|message_composer")}>
{recordingTooltip} {recordingTooltip}
<div className="mx_MessageComposer_wrapper"> <div className="mx_MessageComposer_wrapper">
<UserIdentityWarning room={this.props.room} /> <UserIdentityWarning room={this.props.room} key={this.props.room.roomId} />
<ReplyPreview <ReplyPreview
replyToEvent={this.props.replyToEvent} replyToEvent={this.props.replyToEvent}
permalinkCreator={this.props.permalinkCreator} permalinkCreator={this.props.permalinkCreator}

487
src/components/views/rooms/UserIdentityWarning.tsx
View File

@ -5,7 +5,7 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
Please see LICENSE files in the repository root for full details. Please see LICENSE files in the repository root for full details.
*/ */
import React from "react"; import React, { useEffect, useRef, useState } from "react";
import { import {
CryptoEvent, CryptoEvent,
EventType, EventType,
@ -22,20 +22,17 @@ import type { CryptoApi, UserVerificationStatus } from "matrix-js-sdk/src/crypto
import { _t } from "../../../languageHandler"; import { _t } from "../../../languageHandler";
import MemberAvatar from "../avatars/MemberAvatar"; import MemberAvatar from "../avatars/MemberAvatar";
import { MatrixClientPeg } from "../../../MatrixClientPeg"; import { MatrixClientPeg } from "../../../MatrixClientPeg";
import { SDKContext } from "../../../contexts/SDKContext";
interface UserIdentityWarningProps { interface UserIdentityWarningProps {
/** /**
* The current room being viewed. * The current room being viewed.
*/ */
room: Room; room: Room;
}
interface UserIdentityWarningState {
/** /**
* The current room member that we are prompting the user to approve. * The ID of the room being viewed. This is used to ensure that the
* component's state and references are cleared when the room changes.
*/ */
currentPrompt: RoomMember | undefined; key: string;
} }
/** /**
@ -52,277 +49,235 @@ async function userNeedsApproval(crypto: CryptoApi, userId: string): Promise<boo
* Warns when an unverified user's identity has changed, and gives the user a * Warns when an unverified user's identity has changed, and gives the user a
* button to acknowledge the change. * button to acknowledge the change.
*/ */
export default class UserIdentityWarning extends React.Component<UserIdentityWarningProps, UserIdentityWarningState> { export const UserIdentityWarning: React.FC<UserIdentityWarningProps> = ({ room }) => {
/** const cli = MatrixClientPeg.safeGet();
* Which room members need their identity approved. const crypto = cli.getCrypto();
*/
private membersNeedingApproval: Map<string, RoomMember>;
/**
* Whether we got a verification status update while we were fetching a
* user's verification status.
*
* We set the entry for a user to `false` when we fetch a user's
* verification status, and remove the user's entry when we are done
* fetching. When we receive a verification status update, if the entry for
* the user is `false`, we set it to `true`. After we have finished
* fetching the user's verification status, if the entry for the user is
* `true`, rather than `false`, we know that we got an update, and so we
* discard the value that we fetched. We always use the value from the
* update and consider it as the most up-to-date version. If the fetched
* value is more up-to-date, then we should be getting a new update soon
* with the newer value, so it will fix itself in the end.
*/
private gotVerificationStatusUpdate: Map<string, boolean>;
private mounted: boolean;
private initialised: boolean;
public constructor(props: UserIdentityWarningProps, context: React.ContextType<typeof SDKContext>) {
super(props, context);
this.state = {
currentPrompt: undefined,
};
this.membersNeedingApproval = new Map();
this.gotVerificationStatusUpdate = new Map();
this.mounted = true;
this.initialised = false;
this.addListeners();
}
public componentDidMount(): void { // The current room member that we are prompting the user to approve.
if (!MatrixClientPeg.safeGet().getCrypto()) return; const [currentPrompt, setCurrentPrompt] = useState<RoomMember | undefined>(undefined);
if (this.props.room.hasEncryptionStateEvent()) {
this.initialise().catch((e) => {
logger.error("Error initialising UserIdentityWarning:", e);
});
}
}
public componentWillUnmount(): void { // Whether or not we've already initialised the component by loading the
this.mounted = false; // room membership.
this.removeListeners(); const initialisedRef = useRef<boolean>(false);
} // Which room members need their identity approved.
const membersNeedingApprovalRef = useRef<Map<string, RoomMember>>(new Map());
// Whether we got a verification status update while we were fetching a
// user's verification status.
//
// We set the entry for a user to `false` when we fetch a user's
// verification status, and remove the user's entry when we are done
// fetching. When we receive a verification status update, if the entry for
// the user is `false`, we set it to `true`. After we have finished
// fetching the user's verification status, if the entry for the user is
// `true`, rather than `false`, we know that we got an update, and so we
// discard the value that we fetched. We always use the value from the
// update and consider it as the most up-to-date version. If the fetched
// value is more up-to-date, then we should be getting a new update soon
// with the newer value, so it will fix itself in the end.
const gotVerificationStatusUpdateRef = useRef<Map<string, boolean>>(new Map());
/** useEffect(() => {
* Select a new user to display a warning for. This is called after the if (!crypto) return;
* current prompted user no longer needs their identity approved.
*/
private selectCurrentPrompt(): void {
if (this.membersNeedingApproval.size === 0) {
this.setState({
currentPrompt: undefined,
});
return;
}
// We return the user with the smallest user ID.
const keys = Array.from(this.membersNeedingApproval.keys()).sort((a, b) => a.localeCompare(b));
this.setState({
currentPrompt: this.membersNeedingApproval.get(keys[0]!),
});
}
/** const membersNeedingApproval = membersNeedingApprovalRef.current;
* Initialise the component. Get the room members, check which ones need const gotVerificationStatusUpdate = gotVerificationStatusUpdateRef.current;
* their identity approved, and pick one to display.
*/
public async initialise(): Promise<void> {
if (!this.mounted || this.initialised) {
return;
}
this.initialised = true;
const crypto = MatrixClientPeg.safeGet().getCrypto()!; /**
const members = await this.props.room.getEncryptionTargetMembers(); * Select a new user to display a warning for. This is called after the
if (!this.mounted) { * current prompted user no longer needs their identity approved.
return; */
} function selectCurrentPrompt(): void {
if (membersNeedingApproval.size === 0) {
for (const member of members) { setCurrentPrompt(undefined);
const userId = member.userId;
if (this.gotVerificationStatusUpdate.has(userId)) {
// We're already checking their verification status, so we don't
// need to do anything here.
continue;
}
this.gotVerificationStatusUpdate.set(userId, false);
if (await userNeedsApproval(crypto, userId)) {
if (
!this.membersNeedingApproval.has(userId) &&
this.gotVerificationStatusUpdate.get(userId) === false
) {
this.membersNeedingApproval.set(userId, member);
}
}
this.gotVerificationStatusUpdate.delete(userId);
}
if (!this.mounted) {
return;
}
this.selectCurrentPrompt();
}
private addMemberNeedingApproval(userId: string): void {
if (userId === MatrixClientPeg.safeGet().getUserId()) {
// We always skip our own user, because we can't pin our own identity.
return;
}
const member = this.props.room.getMember(userId);
if (member) {
this.membersNeedingApproval.set(userId, member);
if (!this.state.currentPrompt) {
// If we're not currently displaying a prompt, then we should
// display a prompt for this user.
this.selectCurrentPrompt();
}
}
}
private removeMemberNeedingApproval(userId: string): void {
this.membersNeedingApproval.delete(userId);
// If we removed the currently displayed user, we need to pick a new one
// to display.
if (this.state.currentPrompt?.userId === userId) {
this.selectCurrentPrompt();
}
}
private addListeners(): void {
const cli = MatrixClientPeg.safeGet();
cli.on(CryptoEvent.UserTrustStatusChanged, this.onUserTrustStatusChanged);
cli.on(RoomStateEvent.Events, this.onRoomStateEvent);
}
private removeListeners(): void {
const cli = MatrixClientPeg.get();
if (cli) {
cli.removeListener(CryptoEvent.UserTrustStatusChanged, this.onUserTrustStatusChanged);
cli.removeListener(RoomStateEvent.Events, this.onRoomStateEvent);
}
}
/**
* Handle a change in user trust. If the user's identity now needs
* approval, make sure that a warning is shown. If the user's identity
* doesn't need approval, remove the warning (if any).
*/
private onUserTrustStatusChanged = (userId: string, verificationStatus: UserVerificationStatus): void => {
if (!this.initialised) {
return;
}
if (this.gotVerificationStatusUpdate.has(userId)) {
this.gotVerificationStatusUpdate.set(userId, true);
}
if (verificationStatus.needsUserApproval) {
this.addMemberNeedingApproval(userId);
} else {
this.removeMemberNeedingApproval(userId);
}
};
private onRoomStateEvent = async (event: MatrixEvent): Promise<void> => {
if (event.getRoomId() !== this.props.room.roomId) {
return;
}
const eventType = event.getType();
if (eventType === EventType.RoomEncryption && event.getStateKey() === "") {
// Room is now encrypted, so we can initialise the component.
return this.initialise().catch((e) => {
logger.error("Error initialising UserIdentityWarning:", e);
});
} else if (eventType !== EventType.RoomMember) {
return;
}
if (!this.initialised) {
return;
}
const userId = event.getStateKey();
if (!userId) return;
if (
event.getContent().membership === KnownMembership.Join ||
(event.getContent().membership === KnownMembership.Join && this.props.room.shouldEncryptForInvitedMembers())
) {
// Someone's membership changed and we will now encrypt to them. If
// their identity needs approval, show a warning.
if (this.gotVerificationStatusUpdate.has(userId)) {
// We're already checking their verification status, so we don't
// need to do anything here.
return; return;
} }
this.gotVerificationStatusUpdate.set(userId, false);
const crypto = MatrixClientPeg.safeGet().getCrypto()!; // We return the user with the smallest user ID.
if (await userNeedsApproval(crypto, userId)) { const keys = Array.from(membersNeedingApproval.keys()).sort((a, b) => a.localeCompare(b));
if ( setCurrentPrompt(membersNeedingApproval.get(keys[0]!));
!this.membersNeedingApproval.has(userId) && }
this.gotVerificationStatusUpdate.get(userId) === false
) { function addMemberNeedingApproval(userId: string): void {
this.addMemberNeedingApproval(userId); if (userId === cli.getUserId()) {
// We always skip our own user, because we can't pin our own identity.
return;
}
const member = room.getMember(userId);
if (member) {
membersNeedingApproval.set(userId, member);
if (!currentPrompt) {
// If we're not currently displaying a prompt, then we should
// display a prompt for this user.
selectCurrentPrompt();
} }
} }
this.gotVerificationStatusUpdate.delete(userId);
} else {
// Someone's membership changed and we no longer encrypt to them.
// If we're showing a warning about them, we don't need to any more.
this.removeMemberNeedingApproval(userId);
} }
};
/** function removeMemberNeedingApproval(userId: string): void {
* Callback for when the user hits the "OK" button. membersNeedingApproval.delete(userId);
*/
public confirmIdentity = async (): Promise<void> => { // If we removed the currently displayed user, we need to pick a new one
if (this.state.currentPrompt) { // to display.
await MatrixClientPeg.safeGet().getCrypto()!.pinCurrentUserIdentity(this.state.currentPrompt.userId); if (currentPrompt?.userId === userId) {
selectCurrentPrompt();
}
} }
};
public render(): React.ReactNode { /**
const { currentPrompt } = this.state; * Initialise the component. Get the room members, check which ones need
if (currentPrompt) { * their identity approved, and pick one to display.
const substituteATag = (sub: string): React.ReactNode => ( */
<a href="https://element.io/help#encryption18" target="_blank" rel="noreferrer noopener"> async function initialise(): Promise<void> {
{sub} if (initialisedRef.current) {
</a> return;
); }
const substituteBTag = (sub: string): React.ReactNode => <b>{sub}</b>; initialisedRef.current = true;
return (
<div className="mx_UserIdentityWarning"> const members = await room.getEncryptionTargetMembers();
<Separator />
<div className = "mx_UserIdentityWarning_row"> for (const member of members) {
<MemberAvatar member={currentPrompt} title={currentPrompt.userId} size="30px" /> const userId = member.userId;
<span className="mx_UserIdentityWarning_main"> if (gotVerificationStatusUpdate.has(userId)) {
{currentPrompt.rawDisplayName === currentPrompt.userId // We're already checking their verification status, so we don't
? _t( // need to do anything here.
"encryption|pinned_identity_changed_no_displayname", continue;
{ userId: currentPrompt.userId }, }
{ gotVerificationStatusUpdate.set(userId, false);
a: substituteATag, if (await userNeedsApproval(crypto!, userId)) {
b: substituteBTag, if (!membersNeedingApproval.has(userId) && gotVerificationStatusUpdate.get(userId) === false) {
}, membersNeedingApproval.set(userId, member);
) }
: _t( }
"encryption|pinned_identity_changed", gotVerificationStatusUpdate.delete(userId);
{ displayName: currentPrompt.rawDisplayName, userId: currentPrompt.userId }, }
{
a: substituteATag, selectCurrentPrompt();
b: substituteBTag, }
},
)} const onUserTrustStatusChanged = (userId: string, verificationStatus: UserVerificationStatus): void => {
</span> if (!initialisedRef.current) {
<Button kind="primary" size="sm" onClick={this.confirmIdentity}> return;
{_t("action|ok")} }
</Button>
</div> if (gotVerificationStatusUpdate.has(userId)) {
gotVerificationStatusUpdate.set(userId, true);
}
if (verificationStatus.needsUserApproval) {
addMemberNeedingApproval(userId);
} else {
removeMemberNeedingApproval(userId);
}
};
const onRoomStateEvent = async (event: MatrixEvent): Promise<void> => {
if (event.getRoomId() !== room.roomId) {
return;
}
const eventType = event.getType();
if (eventType === EventType.RoomEncryption && event.getStateKey() === "") {
// Room is now encrypted, so we can initialise the component.
return initialise().catch((e) => {
logger.error("Error initialising UserIdentityWarning:", e);
});
} else if (eventType !== EventType.RoomMember) {
return;
}
if (!initialisedRef.current) {
return;
}
const userId = event.getStateKey();
if (!userId) return;
if (
event.getContent().membership === KnownMembership.Join ||
(event.getContent().membership === KnownMembership.Join && room.shouldEncryptForInvitedMembers())
) {
// Someone's membership changed and we will now encrypt to them. If
// their identity needs approval, show a warning.
if (gotVerificationStatusUpdate.has(userId)) {
// We're already checking their verification status, so we don't
// need to do anything here.
return;
}
gotVerificationStatusUpdate.set(userId, false);
const crypto = MatrixClientPeg.safeGet().getCrypto()!;
if (await userNeedsApproval(crypto!, userId)) {
if (!membersNeedingApproval.has(userId) && gotVerificationStatusUpdate.get(userId) === false) {
addMemberNeedingApproval(userId);
}
}
gotVerificationStatusUpdate.delete(userId);
} else {
// Someone's membership changed and we no longer encrypt to them.
// If we're showing a warning about them, we don't need to any more.
removeMemberNeedingApproval(userId);
}
};
cli.on(CryptoEvent.UserTrustStatusChanged, onUserTrustStatusChanged);
cli.on(RoomStateEvent.Events, onRoomStateEvent);
if (room.hasEncryptionStateEvent()) {
initialise().catch((e) => {
logger.error("Error initialising UserIdentityWarning:", e);
});
}
return () => {
cli.removeListener(CryptoEvent.UserTrustStatusChanged, onUserTrustStatusChanged);
cli.removeListener(RoomStateEvent.Events, onRoomStateEvent);
};
}, [currentPrompt, room, cli, crypto]);
if (!crypto) return null;
if (currentPrompt) {
const confirmIdentity = async (): Promise<void> => {
await crypto.pinCurrentUserIdentity(currentPrompt.userId);
};
const substituteATag = (sub: string): React.ReactNode => (
<a href="https://element.io/help#encryption18" target="_blank" rel="noreferrer noopener">
{sub}
</a>
);
const substituteBTag = (sub: string): React.ReactNode => <b>{sub}</b>;
return (
<div className="mx_UserIdentityWarning">
<Separator />
<div className="mx_UserIdentityWarning_row">
<MemberAvatar member={currentPrompt} title={currentPrompt.userId} size="30px" />
<span className="mx_UserIdentityWarning_main">
{currentPrompt.rawDisplayName === currentPrompt.userId
? _t(
"encryption|pinned_identity_changed_no_displayname",
{ userId: currentPrompt.userId },
{
a: substituteATag,
b: substituteBTag,
},
)
: _t(
"encryption|pinned_identity_changed",
{ displayName: currentPrompt.rawDisplayName, userId: currentPrompt.userId },
{
a: substituteATag,
b: substituteBTag,
},
)}
</span>
<Button kind="primary" size="sm" onClick={confirmIdentity}>
{_t("action|ok")}
</Button>
</div> </div>
); </div>
} else { );
return null; } else {
} return null;
} }
} };

86
test/unit-tests/components/views/rooms/UserIdentityWarning-test.tsx
View File

@ -18,10 +18,10 @@ import {
RoomMember, RoomMember,
} from "matrix-js-sdk/src/matrix"; } from "matrix-js-sdk/src/matrix";
import { UserVerificationStatus } from "matrix-js-sdk/src/crypto-api"; import { UserVerificationStatus } from "matrix-js-sdk/src/crypto-api";
import { fireEvent, render, screen, waitFor } from "jest-matrix-react"; import { act, fireEvent, render, screen, waitFor } from "jest-matrix-react";
import { stubClient } from "../../../../test-utils"; import { stubClient } from "../../../../test-utils";
import UserIdentityWarning from "../../../../../src/components/views/rooms/UserIdentityWarning"; import { UserIdentityWarning } from "../../../../../src/components/views/rooms/UserIdentityWarning";
import MatrixClientContext from "../../../../../src/contexts/MatrixClientContext"; import MatrixClientContext from "../../../../../src/contexts/MatrixClientContext";
const ROOM_ID = "!room:id"; const ROOM_ID = "!room:id";
@ -88,7 +88,7 @@ describe("UserIdentityWarning", () => {
return Promise.resolve(new UserVerificationStatus(false, false, false, true)); return Promise.resolve(new UserVerificationStatus(false, false, false, true));
}); });
crypto.pinCurrentUserIdentity = jest.fn(); crypto.pinCurrentUserIdentity = jest.fn();
const { container } = render(<UserIdentityWarning room={room} />, { const { container } = render(<UserIdentityWarning room={room} key={ROOM_ID} />, {
wrapper: ({ ...rest }) => <MatrixClientContext.Provider value={client} {...rest} />, wrapper: ({ ...rest }) => <MatrixClientContext.Provider value={client} {...rest} />,
}); });
@ -115,7 +115,7 @@ describe("UserIdentityWarning", () => {
return Promise.resolve(new UserVerificationStatus(false, false, false, true)); return Promise.resolve(new UserVerificationStatus(false, false, false, true));
}); });
render(<UserIdentityWarning room={room} />, { render(<UserIdentityWarning room={room} key={ROOM_ID} />, {
wrapper: ({ ...rest }) => <MatrixClientContext.Provider value={client} {...rest} />, wrapper: ({ ...rest }) => <MatrixClientContext.Provider value={client} {...rest} />,
}); });
await sleep(10); // give it some time to finish initialising await sleep(10); // give it some time to finish initialising
@ -156,18 +156,20 @@ describe("UserIdentityWarning", () => {
crypto["getUserVerificationStatus"] = jest.fn(async () => { crypto["getUserVerificationStatus"] = jest.fn(async () => {
return Promise.resolve(new UserVerificationStatus(false, false, false, false)); return Promise.resolve(new UserVerificationStatus(false, false, false, false));
}); });
render(<UserIdentityWarning room={room} />, { render(<UserIdentityWarning room={room} key={ROOM_ID} />, {
wrapper: ({ ...rest }) => <MatrixClientContext.Provider value={client} {...rest} />, wrapper: ({ ...rest }) => <MatrixClientContext.Provider value={client} {...rest} />,
}); });
await sleep(10); // give it some time to finish initialising await sleep(10); // give it some time to finish initialising
expect(() => getWarningByText("Alice's (@alice:example.org) identity appears to have changed.")).toThrow(); expect(() => getWarningByText("Alice's (@alice:example.org) identity appears to have changed.")).toThrow();
// The user changes their identity, so we should show the warning. // The user changes their identity, so we should show the warning.
client.emit( act(() => {
CryptoEvent.UserTrustStatusChanged, client.emit(
"@alice:example.org", CryptoEvent.UserTrustStatusChanged,
new UserVerificationStatus(false, false, false, true), "@alice:example.org",
); new UserVerificationStatus(false, false, false, true),
);
});
await waitFor(() => await waitFor(() =>
expect( expect(
getWarningByText("Alice's (@alice:example.org) identity appears to have changed."), getWarningByText("Alice's (@alice:example.org) identity appears to have changed."),
@ -176,11 +178,13 @@ describe("UserIdentityWarning", () => {
// Simulate the user's new identity having been approved, so we no // Simulate the user's new identity having been approved, so we no
// longer show the warning. // longer show the warning.
client.emit( act(() => {
CryptoEvent.UserTrustStatusChanged, client.emit(
"@alice:example.org", CryptoEvent.UserTrustStatusChanged,
new UserVerificationStatus(false, false, false, false), "@alice:example.org",
); new UserVerificationStatus(false, false, false, false),
);
});
await waitFor(() => await waitFor(() =>
expect(() => getWarningByText("Alice's (@alice:example.org) identity appears to have changed.")).toThrow(), expect(() => getWarningByText("Alice's (@alice:example.org) identity appears to have changed.")).toThrow(),
); );
@ -198,7 +202,7 @@ describe("UserIdentityWarning", () => {
crypto["getUserVerificationStatus"] = jest.fn(async () => { crypto["getUserVerificationStatus"] = jest.fn(async () => {
return Promise.resolve(new UserVerificationStatus(false, false, false, true)); return Promise.resolve(new UserVerificationStatus(false, false, false, true));
}); });
render(<UserIdentityWarning room={room} />, { render(<UserIdentityWarning room={room} key={ROOM_ID} />, {
wrapper: ({ ...rest }) => <MatrixClientContext.Provider value={client} {...rest} />, wrapper: ({ ...rest }) => <MatrixClientContext.Provider value={client} {...rest} />,
}); });
await sleep(10); // give it some time to finish initialising await sleep(10); // give it some time to finish initialising
@ -226,21 +230,23 @@ describe("UserIdentityWarning", () => {
); );
// Alice leaves, so we no longer show her warning. // Alice leaves, so we no longer show her warning.
client.emit( act(() => {
RoomStateEvent.Events, client.emit(
new MatrixEvent({ RoomStateEvent.Events,
event_id: "$event_id", new MatrixEvent({
type: EventType.RoomMember, event_id: "$event_id",
state_key: "@alice:example.org", type: EventType.RoomMember,
content: { state_key: "@alice:example.org",
membership: "leave", content: {
}, membership: "leave",
room_id: ROOM_ID, },
sender: "@alice:example.org", room_id: ROOM_ID,
}), sender: "@alice:example.org",
dummyRoomState(), }),
null, dummyRoomState(),
); null,
);
});
await waitFor(() => await waitFor(() =>
expect(() => getWarningByText("Alice's (@alice:example.org) identity appears to have changed.")).toThrow(), expect(() => getWarningByText("Alice's (@alice:example.org) identity appears to have changed.")).toThrow(),
); );
@ -258,7 +264,7 @@ describe("UserIdentityWarning", () => {
return Promise.resolve(new UserVerificationStatus(false, false, false, true)); return Promise.resolve(new UserVerificationStatus(false, false, false, true));
}); });
render(<UserIdentityWarning room={room} />, { render(<UserIdentityWarning room={room} key={ROOM_ID} />, {
wrapper: ({ ...rest }) => <MatrixClientContext.Provider value={client} {...rest} />, wrapper: ({ ...rest }) => <MatrixClientContext.Provider value={client} {...rest} />,
}); });
// We should warn about Alice's identity first. // We should warn about Alice's identity first.
@ -270,11 +276,13 @@ describe("UserIdentityWarning", () => {
// Simulate Alice's new identity having been approved, so now we warn // Simulate Alice's new identity having been approved, so now we warn
// about Bob's identity. // about Bob's identity.
client.emit( act(() => {
CryptoEvent.UserTrustStatusChanged, client.emit(
"@alice:example.org", CryptoEvent.UserTrustStatusChanged,
new UserVerificationStatus(false, false, false, false), "@alice:example.org",
); new UserVerificationStatus(false, false, false, false),
);
});
await waitFor(() => await waitFor(() =>
expect(getWarningByText("@bob:example.org's identity appears to have changed.")).toBeInTheDocument(), expect(getWarningByText("@bob:example.org's identity appears to have changed.")).toBeInTheDocument(),
); );
@ -300,7 +308,7 @@ describe("UserIdentityWarning", () => {
); );
return Promise.resolve(new UserVerificationStatus(false, false, false, false)); return Promise.resolve(new UserVerificationStatus(false, false, false, false));
}); });
render(<UserIdentityWarning room={room} />, { render(<UserIdentityWarning room={room} key={ROOM_ID} />, {
wrapper: ({ ...rest }) => <MatrixClientContext.Provider value={client} {...rest} />, wrapper: ({ ...rest }) => <MatrixClientContext.Provider value={client} {...rest} />,
}); });
await sleep(10); // give it some time to finish initialising await sleep(10); // give it some time to finish initialising
@ -328,7 +336,7 @@ describe("UserIdentityWarning", () => {
); );
return Promise.resolve(new UserVerificationStatus(false, false, false, true)); return Promise.resolve(new UserVerificationStatus(false, false, false, true));
}); });
render(<UserIdentityWarning room={room} />, { render(<UserIdentityWarning room={room} key={ROOM_ID} />, {
wrapper: ({ ...rest }) => <MatrixClientContext.Provider value={client} {...rest} />, wrapper: ({ ...rest }) => <MatrixClientContext.Provider value={client} {...rest} />,
}); });
await sleep(10); // give it some time to finish initialising await sleep(10); // give it some time to finish initialising