Implement the new invite modal designs

test/Toast-test.tsx

@@ -0,0 +1,59 @@
+/*
+Copyright 2023 New Vector Ltd
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+import { screen, render } from "@testing-library/react";
+import { Toast } from "../src/Toast";
+import userEvent from "@testing-library/user-event";
+import { withFakeTimers } from "./utils";
+
+test("Toast renders", () => {
+  render(
+    <Toast open={false} onDismiss={() => {}}>
+      Hello world!
+    </Toast>
+  );
+  expect(screen.queryByRole("dialog")).toBe(null);
+  render(
+    <Toast open={true} onDismiss={() => {}}>
+      Hello world!
+    </Toast>
+  );
+  expect(screen.getByRole("dialog")).toMatchSnapshot();
+});
+
+test("Toast dismisses when clicked", async () => {
+  const onDismiss = jest.fn();
+  render(
+    <Toast open={true} onDismiss={onDismiss}>
+      Hello world!
+    </Toast>
+  );
+  await userEvent.click(screen.getByRole("dialog"));
+  expect(onDismiss).toHaveBeenCalled();
+});
+
+test("Toast dismisses itself after the specified timeout", async () => {
+  withFakeTimers(() => {
+    const onDismiss = jest.fn();
+    render(
+      <Toast open={true} onDismiss={onDismiss} autoDismiss={2000}>
+        Hello world!
+      </Toast>
+    );
+    jest.advanceTimersByTime(2000);
+    expect(onDismiss).toHaveBeenCalled();
+  });
+});

test/__snapshots__/Toast-test.tsx.snap

@@ -0,0 +1,22 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Toast renders 1`] = `
+<button
+  aria-describedby="radix-:r5:"
+  aria-labelledby="radix-:r4:"
+  class="overlay animate toast"
+  data-state="open"
+  id="radix-:r3:"
+  role="dialog"
+  style="pointer-events: auto;"
+  tabindex="-1"
+  type="button"
+>
+  <h3
+    class="_font-body-sm-semibold_1jx6b_45"
+    id="radix-:r4:"
+  >
+    Hello world!
+  </h3>
+</button>
+`;

test/room/checkForParallelCalls-test.ts

@@ -18,15 +18,7 @@ import { Mocked, mocked } from "jest-mock";
 import { RoomState } from "matrix-js-sdk/src/models/room-state";
 import { PosthogAnalytics } from "../../src/analytics/PosthogAnalytics";
 import { checkForParallelCalls } from "../../src/room/checkForParallelCalls";
-
-const withFakeTimers = (continuation: () => void) => {
-  jest.useFakeTimers();
-  try {
-    continuation();
-  } finally {
-    jest.useRealTimers();
-  }
-};
+import { withFakeTimers } from "../utils";
 
 const withMockedPosthog = (
   continuation: (posthog: Mocked<PosthogAnalytics>) => void

test/utils.ts

@@ -0,0 +1,24 @@
+/*
+Copyright 2023 New Vector Ltd
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+export function withFakeTimers(continuation: () => void): void {
+  jest.useFakeTimers();
+  try {
+    continuation();
+  } finally {
+    jest.useRealTimers();
+  }
+}