Fix #30118 - TypeError in manual verify - by using MatrixClientPeg (#30131)

We can't use MatrixClientContext inside a dialog at the moment.

src/components/views/dialogs/ManualDeviceKeyVerificationDialog.tsx

@@ -20,7 +20,7 @@ import Modal from "../../../Modal";
 import InfoDialog from "./InfoDialog";
 import Field from "../elements/Field";
 import ErrorDialog from "./ErrorDialog";
-import { useMatrixClientContext } from "../../../contexts/MatrixClientContext";
+import { MatrixClientPeg } from "../../../MatrixClientPeg";
 
 interface Props {
     onFinished(confirm?: boolean): void;
@@ -37,7 +37,7 @@ export function ManualDeviceKeyVerificationDialog({ onFinished }: Readonly<Props
     const [deviceId, setDeviceId] = useState("");
     const [fingerprint, setFingerprint] = useState("");
 
-    const client = useMatrixClientContext();
+    const client = MatrixClientPeg.safeGet();
 
     const onDialogFinished = useCallback(
         async (confirm: boolean) => {

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

@@ -13,17 +13,12 @@ import { DeviceVerificationStatus } from "matrix-js-sdk/src/crypto-api";
 
 import { stubClient } from "../../../../test-utils";
 import { ManualDeviceKeyVerificationDialog } from "../../../../../src/components/views/dialogs/ManualDeviceKeyVerificationDialog";
-import MatrixClientContext from "../../../../../src/contexts/MatrixClientContext";
 
 describe("ManualDeviceKeyVerificationDialog", () => {
     let mockClient: MatrixClient;
 
     function renderDialog(onFinished: (confirm: boolean) => void) {
-        return render(
+        return render(<ManualDeviceKeyVerificationDialog onFinished={onFinished} />);
-            <MatrixClientContext.Provider value={mockClient}>
-                <ManualDeviceKeyVerificationDialog onFinished={onFinished} />
-            </MatrixClientContext.Provider>,
-        );
     }
 
     beforeEach(() => {