Remove references to VerificationRequest (#11050)

* Update references to `VerificationRequestEvent`

* Update references to `Phase`

* update references to legacy `PHASE_*` constants

* Replace `request.canAccept` with `canAcceptVerificationRequest`

* Replace `VerificationRequest` with the interface throughout

* Minor strict type fixes

* Add a couple of tests

test/components/views/messages/MKeyVerificationRequest-test.tsx

@@ -18,10 +18,8 @@ import React from "react";
 import { render, within } from "@testing-library/react";
 import { EventEmitter } from "events";
 import { MatrixEvent } from "matrix-js-sdk/src/matrix";
-import {
-    Phase as VerificationPhase,
-    VerificationRequest,
-} from "matrix-js-sdk/src/crypto/verification/request/VerificationRequest";
+import { VerificationPhase } from "matrix-js-sdk/src/crypto-api/verification";
+import { VerificationRequest } from "matrix-js-sdk/src/crypto/verification/request/VerificationRequest";
 
 import { MatrixClientPeg } from "../../../../src/MatrixClientPeg";
 import { getMockClientWithEventEmitter, mockClientMethodsUser } from "../../../test-utils";
@@ -85,6 +83,18 @@ describe("MKeyVerificationRequest", () => {
         expect(within(container).getByRole("button")).toHaveTextContent("@other:user accepted");
     });
 
+    it("should render appropriately when the request was initiated by the other user and has not yet been accepted", () => {
+        const event = new MatrixEvent({ type: "m.key.verification.request" });
+        event.verificationRequest = getMockVerificationRequest({
+            phase: VerificationPhase.Requested,
+            initiatedByMe: false,
+            otherUserId: "@other:user",
+        });
+        const result = render(<MKeyVerificationRequest mxEvent={event} />);
+        expect(result.container).toHaveTextContent("@other:user wants to verify");
+        result.getByRole("button", { name: "Accept" });
+    });
+
     it("should render appropriately when the request was initiated by the other user and has been accepted", () => {
         const event = new MatrixEvent({ type: "m.key.verification.request" });
         event.verificationRequest = getMockVerificationRequest({

test/components/views/right_panel/VerificationPanel-test.tsx

@@ -16,11 +16,6 @@ limitations under the License.
 
 import { act, render, waitFor } from "@testing-library/react";
 import React, { ComponentProps } from "react";
-import {
-    Phase,
-    VerificationRequest,
-    VerificationRequestEvent,
-} from "matrix-js-sdk/src/crypto/verification/request/VerificationRequest";
 import { TypedEventEmitter } from "matrix-js-sdk/src/models/typed-event-emitter";
 import { User } from "matrix-js-sdk/src/models/user";
 import { Mocked } from "jest-mock";
@@ -30,6 +25,9 @@ import {
     Verifier,
     VerifierEvent,
     VerifierEventHandlerMap,
+    VerificationPhase as Phase,
+    VerificationRequest,
+    VerificationRequestEvent,
 } from "matrix-js-sdk/src/crypto-api/verification";
 
 import VerificationPanel from "../../../../src/components/views/right_panel/VerificationPanel";

test/components/views/toasts/VerificationRequestToast-test.tsx

@@ -27,6 +27,7 @@ import { TypedEventEmitter } from "matrix-js-sdk/src/models/typed-event-emitter"
 
 import VerificationRequestToast from "../../../../src/components/views/toasts/VerificationRequestToast";
 import { flushPromises, getMockClientWithEventEmitter, mockClientMethodsUser } from "../../../test-utils";
+import ToastStore from "../../../../src/stores/ToastStore";
 
 function renderComponent(
     props: Partial<ComponentProps<typeof VerificationRequestToast>> & { request: VerificationRequest },
@@ -82,6 +83,23 @@ describe("VerificationRequestToast", () => {
         });
         expect(result.container).toMatchSnapshot();
     });
+
+    it("dismisses itself once the request can no longer be accepted", async () => {
+        const otherUserId = "@other:user";
+        const request = makeMockVerificationRequest({
+            isSelfVerification: false,
+            otherUserId,
+        });
+        renderComponent({ request, toastKey: "testKey" });
+        await act(async () => {
+            await flushPromises();
+        });
+
+        const dismiss = jest.spyOn(ToastStore.sharedInstance(), "dismissToast");
+        Object.defineProperty(request, "accepting", { value: true });
+        request.emit(VerificationRequestEvent.Change);
+        expect(dismiss).toHaveBeenCalledWith("testKey");
+    });
 });
 
 function makeMockVerificationRequest(props: Partial<VerificationRequest> = {}): Mocked<VerificationRequest> {

test/components/views/toasts/__snapshots__/VerificationRequestToast-test.tsx.snap

@@ -17,7 +17,7 @@ exports[`VerificationRequestToast should render a cross-user verification 1`] =
         role="button"
         tabindex="0"
       >
-        Ignore (NaN)
+        Ignore
       </div>
       <div
         class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
@@ -53,7 +53,7 @@ exports[`VerificationRequestToast should render a self-verification 1`] = `
         role="button"
         tabindex="0"
       >
-        Ignore (NaN)
+        Ignore
       </div>
       <div
         class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"