Remove manual device verification which is not supported by the new cryptography stack

src/components/views/dialogs/UntrustedDeviceDialog.tsx

@@ -17,9 +17,20 @@ import BaseDialog from "./BaseDialog";
 import { IDevice } from "../right_panel/UserInfo";
 
 interface IProps {
+    /**
+     * The user whose device is untrusted.
+     */
     user: User;
+    /**
+     * The device that is untrusted.
+     */
     device: IDevice;
-    onFinished(mode?: "legacy" | "sas" | false): void;
+    /**
+     * Callback for when the dialog is dismissed.
+     * If mode is "sas", the user wants to verify the device with SAS. Otherwise, the dialog was dismissed.
+     * @param mode The mode of dismissal.
+     */
+    onFinished(mode?: "sas"): void;
 }
 
 const UntrustedDeviceDialog: React.FC<IProps> = ({ device, user, onFinished }) => {
@@ -59,7 +70,7 @@ const UntrustedDeviceDialog: React.FC<IProps> = ({ device, user, onFinished }) =
                 <AccessibleButton kind="primary_outline" onClick={() => onFinished("sas")}>
                     {_t("encryption|udd|interactive_verification_button")}
                 </AccessibleButton>
-                <AccessibleButton kind="primary" onClick={() => onFinished(false)}>
+                <AccessibleButton kind="primary" onClick={() => onFinished()}>
                     {_t("action|done")}
                 </AccessibleButton>
             </div>

src/verification.ts

@@ -47,10 +47,12 @@ export async function verifyDevice(matrixClient: MatrixClient, user: User, devic
         user,
         device,
         onFinished: async (action): Promise<void> => {
-            const verificationRequestPromise = matrixClient
-                .getCrypto()
-                ?.requestDeviceVerification(user.userId, device.deviceId);
-            setRightPanel({ member: user, verificationRequestPromise });
+            if (action === "sas") {
+                const verificationRequestPromise = matrixClient
+                    .getCrypto()
+                    ?.requestDeviceVerification(user.userId, device.deviceId);
+                setRightPanel({ member: user, verificationRequestPromise });
+            }
         },
     });
 }

test/unit-tests/components/views/dialogs/UntrustedDeviceDialog-test.tsx

@@ -0,0 +1,59 @@
+/*
+ * Copyright 2024 New Vector Ltd.
+ *
+ * SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
+ * Please see LICENSE files in the repository root for full details.
+ */
+
+import React from "react";
+import { Device, MatrixClient, User } from "matrix-js-sdk/src/matrix";
+import { render, screen } from "jest-matrix-react";
+
+import { stubClient } from "../../../../test-utils";
+import UntrustedDeviceDialog from "../../../../../src/components/views/dialogs/UntrustedDeviceDialog.tsx";
+
+describe("<UntrustedDeviceDialog />", () => {
+    let client: MatrixClient;
+    let user: User;
+    let device: Device;
+    const onFinished = jest.fn();
+
+    beforeEach(() => {
+        client = stubClient();
+        user = User.createUser("@alice:example.org", client);
+        user.setDisplayName("Alice");
+        device = new Device({ deviceId: "device_id", userId: user.userId, algorithms: [], keys: new Map() });
+    });
+
+    afterEach(() => {
+        onFinished.mockReset();
+    });
+
+    function renderComponent() {
+        return render(<UntrustedDeviceDialog user={user} device={device} onFinished={onFinished} />);
+    }
+
+    it("should display the dialog for the device of another user", () => {
+        const { asFragment } = renderComponent();
+        expect(asFragment()).toMatchSnapshot();
+    });
+
+    it("should display the dialog for the device of the current user", () => {
+        jest.spyOn(client, "getUserId").mockReturnValue(user.userId);
+
+        const { asFragment } = renderComponent();
+        expect(asFragment()).toMatchSnapshot();
+    });
+
+    it("should call onFinished without parameter when Done is clicked", () => {
+        renderComponent();
+        screen.getByRole("button", { name: "Done" }).click();
+        expect(onFinished).toHaveBeenCalledWith();
+    });
+
+    it("should call onFinished with sas when Interactively verify by emoji is clicked", () => {
+        renderComponent();
+        screen.getByRole("button", { name: "Interactively verify by emoji" }).click();
+        expect(onFinished).toHaveBeenCalledWith("sas");
+    });
+});

test/unit-tests/components/views/dialogs/__snapshots__/UntrustedDeviceDialog-test.tsx.snap

@@ -0,0 +1,149 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<UntrustedDeviceDialog /> should display the dialog for the device of another user 1`] = `
+<DocumentFragment>
+  <div
+    data-focus-guard="true"
+    style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
+    tabindex="0"
+  />
+  <div
+    aria-labelledby="mx_BaseDialog_title"
+    class="mx_UntrustedDeviceDialog mx_Dialog_fixedWidth"
+    data-focus-lock-disabled="false"
+    role="dialog"
+  >
+    <div
+      class="mx_Dialog_header"
+    >
+      <h1
+        class="mx_Heading_h3 mx_Dialog_title"
+        id="mx_BaseDialog_title"
+      >
+        <div
+          class="mx_E2EIcon mx_E2EIcon_warning"
+          style="width: 24px; height: 24px;"
+        />
+        Not Trusted
+      </h1>
+    </div>
+    <div
+      class="mx_Dialog_content"
+      id="mx_Dialog_content"
+    >
+      <p>
+        Alice (@alice:example.org) signed in to a new session without verifying it:
+      </p>
+      <p>
+         (device_id)
+      </p>
+      <p>
+        Ask this user to verify their session, or manually verify it below.
+      </p>
+    </div>
+    <div
+      class="mx_Dialog_buttons"
+    >
+      <div
+        class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary_outline"
+        role="button"
+        tabindex="0"
+      >
+        Interactively verify by emoji
+      </div>
+      <div
+        class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
+        role="button"
+        tabindex="0"
+      >
+        Done
+      </div>
+    </div>
+    <div
+      aria-label="Close dialog"
+      class="mx_AccessibleButton mx_Dialog_cancelButton"
+      role="button"
+      tabindex="0"
+    />
+  </div>
+  <div
+    data-focus-guard="true"
+    style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
+    tabindex="0"
+  />
+</DocumentFragment>
+`;
+
+exports[`<UntrustedDeviceDialog /> should display the dialog for the device of the current user 1`] = `
+<DocumentFragment>
+  <div
+    data-focus-guard="true"
+    style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
+    tabindex="0"
+  />
+  <div
+    aria-labelledby="mx_BaseDialog_title"
+    class="mx_UntrustedDeviceDialog mx_Dialog_fixedWidth"
+    data-focus-lock-disabled="false"
+    role="dialog"
+  >
+    <div
+      class="mx_Dialog_header"
+    >
+      <h1
+        class="mx_Heading_h3 mx_Dialog_title"
+        id="mx_BaseDialog_title"
+      >
+        <div
+          class="mx_E2EIcon mx_E2EIcon_warning"
+          style="width: 24px; height: 24px;"
+        />
+        Not Trusted
+      </h1>
+    </div>
+    <div
+      class="mx_Dialog_content"
+      id="mx_Dialog_content"
+    >
+      <p>
+        You signed in to a new session without verifying it:
+      </p>
+      <p>
+         (device_id)
+      </p>
+      <p>
+        Verify your other session using one of the options below.
+      </p>
+    </div>
+    <div
+      class="mx_Dialog_buttons"
+    >
+      <div
+        class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary_outline"
+        role="button"
+        tabindex="0"
+      >
+        Interactively verify by emoji
+      </div>
+      <div
+        class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
+        role="button"
+        tabindex="0"
+      >
+        Done
+      </div>
+    </div>
+    <div
+      aria-label="Close dialog"
+      class="mx_AccessibleButton mx_Dialog_cancelButton"
+      role="button"
+      tabindex="0"
+    />
+  </div>
+  <div
+    data-focus-guard="true"
+    style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
+    tabindex="0"
+  />
+</DocumentFragment>
+`;