Show a "progress" dialog while invites are being sent (#30561)

* InviteDialog: show some words and a spinner while invites are being sent

* MultiInviter-test: avoid building unhandled rejected promises

If we don't handle rejected promises, jest gets confused by them. Instead,
let's create them on-demand.

* Open a "progress" dialog while invites are being sent

* Inhibit invite progress dialog when RoomUpgradeWarning dialog is kept open

... otherwise the `RoomUpgradeWarning` dialog disappears during the invites,
and the tests that assert that it is showing the correct thing fail.
 enter the commit message for your changes. Lines starting

* Switch to compound CSS variables instead of old pcss vars

* update playwright screenshots

* Revert "update playwright screenshots"

This reverts commit b0a15d97f35a088fe5b67009085eab46be1316fd.

* Another go at updating screenshots

* Address review comments

* remove redundant Props

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

@@ -137,6 +137,7 @@ describe("InviteDialog", () => {
             supportsThreads: jest.fn().mockReturnValue(false),
             isInitialSyncComplete: jest.fn().mockReturnValue(true),
             getClientWellKnown: jest.fn().mockResolvedValue({}),
+            invite: jest.fn(),
         });
         SdkConfig.put({ validated_server_config: {} as ValidatedServerConfig } as IConfigOptions);
         DMRoomMap.makeShared(mockClient);
@@ -406,6 +407,18 @@ describe("InviteDialog", () => {
         expect(tile).toBeInTheDocument();
     });
 
+    describe("while the invite is in progress", () => {
+        it("should show a spinner", async () => {
+            mockClient.invite.mockReturnValue(new Promise(() => {}));
+
+            render(<InviteDialog kind={InviteKind.Invite} roomId={roomId} onFinished={jest.fn()} />);
+            await enterIntoSearchField(bobId);
+            await userEvent.click(screen.getByRole("button", { name: "Invite" }));
+
+            await screen.findByText("Preparing invitations...");
+        });
+    });
+
     describe("when inviting a user with an unknown profile", () => {
         beforeEach(async () => {
             render(<InviteDialog kind={InviteKind.Dm} onFinished={jest.fn()} />);