Merge branch 'develop' into florianduros/rip-out-legacy-crypto/remove-legacy-crypto

.eslintrc.js

@@ -200,8 +200,13 @@ module.exports = {
                 "@typescript-eslint/ban-ts-comment": "off",
                 // We're okay with assertion errors when we ask for them
                 "@typescript-eslint/no-non-null-assertion": "off",
-                // We do this sometimes to brand interfaces
-                "@typescript-eslint/no-empty-object-type": "off",
+                "@typescript-eslint/no-empty-object-type": [
+                    "error",
+                    {
+                        // We do this sometimes to brand interfaces
+                        allowInterfaces: "with-single-extends",
+                    },
+                ],
             },
         },
         // temporary override for offending icon require files
@@ -247,6 +252,7 @@ module.exports = {
                 // We don't need super strict typing in test utilities
                 "@typescript-eslint/explicit-function-return-type": "off",
                 "@typescript-eslint/explicit-member-accessibility": "off",
+                "@typescript-eslint/no-empty-object-type": "off",
 
                 // Jest/Playwright specific
 

.github/workflows/dockerhub.yaml

@@ -51,7 +51,7 @@ jobs:
 
             - name: Build and push
               id: build-and-push
-              uses: docker/build-push-action@67a2d409c0a876cbe6b11854e3e25193efe4e62d # v6
+              uses: docker/build-push-action@ca877d9245402d1537745e0e356eab47c3520991 # v6
               with:
                   context: .
                   push: true

playwright/pages/client.ts

@@ -25,6 +25,7 @@ import type {
     StateEvents,
     TimelineEvents,
     AccountDataEvents,
+    EmptyObject,
 } from "matrix-js-sdk/src/matrix";
 import type { RoomMessageEventContent } from "matrix-js-sdk/src/types";
 import { Credentials } from "../plugins/homeserver";
@@ -363,7 +364,7 @@ export class Client {
         event: JSHandle<MatrixEvent>,
         receiptType?: ReceiptType,
         unthreaded?: boolean,
-    ): Promise<{}> {
+    ): Promise<EmptyObject> {
         const client = await this.prepareClient();
         return client.evaluate(
             (client, { event, receiptType, unthreaded }) => {
@@ -386,7 +387,7 @@ export class Client {
      * @return {Promise} Resolves: {} an empty object.
      * @return {module:http-api.MatrixError} Rejects: with an error response.
      */
-    public async setDisplayName(name: string): Promise<{}> {
+    public async setDisplayName(name: string): Promise<EmptyObject> {
         const client = await this.prepareClient();
         return client.evaluate(async (cli: MatrixClient, name) => cli.setDisplayName(name), name);
     }
@@ -397,7 +398,7 @@ export class Client {
      * @return {Promise} Resolves: {} an empty object.
      * @return {module:http-api.MatrixError} Rejects: with an error response.
      */
-    public async setAvatarUrl(url: string): Promise<{}> {
+    public async setAvatarUrl(url: string): Promise<EmptyObject> {
         const client = await this.prepareClient();
         return client.evaluate(async (cli: MatrixClient, url) => cli.setAvatarUrl(url), url);
     }

playwright/testcontainers/synapse.ts

@@ -19,7 +19,7 @@ import { HomeserverContainer, StartedHomeserverContainer } from "./HomeserverCon
 import { StartedMatrixAuthenticationServiceContainer } from "./mas.ts";
 import { Api, ClientServerApi, Verb } from "../plugins/utils/api.ts";
 
-const TAG = "develop@sha256:e6b4c69101a0d8fd6ff6a26233eb6f92e984d578476f087c26a0fb72cddc9623";
+const TAG = "develop@sha256:098126c6be750dffaff5bd19db254609aadaf34f76c70f2dca9821cb12428613";
 
 const DEFAULT_CONFIG = {
     server_name: "localhost",

res/css/views/right_panel/_UserInfo.pcss

@@ -34,7 +34,7 @@ Please see LICENSE files in the repository root for full details.
     }
 
     .mx_UserInfo_container {
-        padding: var(--cpd-space-4x) 0;
+        padding: var(--cpd-space-2x) 0 var(--cpd-space-4x);
         margin: 0 var(--cpd-space-4x);
 
         .mx_UserInfo_container_verifyButton {
@@ -65,7 +65,7 @@ Please see LICENSE files in the repository root for full details.
     }
 
     .mx_UserInfo_avatar {
-        margin: $spacing-24 $spacing-32 0 $spacing-32;
+        margin: var(--cpd-space-12x) var(--cpd-space-4x) 0 var(--cpd-space-4x);
 
         .mx_UserInfo_avatar_transition {
             max-width: 120px;
@@ -98,8 +98,18 @@ Please see LICENSE files in the repository root for full details.
         margin: 5px 0;
     }
 
+    .mx_UserInfo_header {
+        margin-bottom: var(--cpd-space-8x);
+        padding-bottom: 0;
+    }
+
     .mx_UserInfo_profile {
+        display: flex;
+        flex-direction: column;
+        gap: var(--cpd-space-1x);
+
         h1 {
+            margin: 0;
             font-size: $font-20px;
             line-height: $font-25px;
 
@@ -119,8 +129,45 @@ Please see LICENSE files in the repository root for full details.
             }
         }
 
+        .mx_UserInfo_profile_name {
+            height: 30px;
+        }
+
+        .mx_UserInfo_profile_mxid {
+            color: var(--cpd-color-text-secondary);
+            height: 28px;
+        }
+
         .mx_UserInfo_profileStatus {
-            margin: var(--cpd-space-1x) 0;
+            height: 20px;
+        }
+
+        .mx_UserInfo_timezone {
+            height: 20px;
+            margin: 0;
+            display: flex;
+            align-items: center;
+        }
+
+        /** Overrides for the copy to clipboard button **/
+        .mx_CopyableText {
+            align-items: center;
+        }
+
+        .mx_CopyableText_copyButton {
+            width: 28px;
+            height: 28px;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            position: unset;
+            padding-left: var(--cpd-space-2x);
+        }
+
+        .mx_CopyableText_copyButton::before {
+            width: 20px;
+            height: 20px;
+            background-color: var(--cpd-color-icon-secondary-alpha);
         }
     }
 

src/@types/diff-dom.d.ts

@@ -18,6 +18,7 @@ declare module "diff-dom" {
         newValue: HTMLElement | string;
     }
 
+    // eslint-disable-next-line @typescript-eslint/no-empty-object-type
     interface IOpts {}
 
     export class DiffDOM {

src/@types/matrix-js-sdk.d.ts

@@ -11,6 +11,7 @@ import type { BLURHASH_FIELD } from "../utils/image-media";
 import type { JitsiCallMemberEventType, JitsiCallMemberContent } from "../call-types";
 import type { ILayoutStateEvent, WIDGET_LAYOUT_EVENT_TYPE } from "../stores/widgets/types";
 import type { EncryptedFile } from "matrix-js-sdk/src/types";
+import type { EmptyObject } from "matrix-js-sdk/src/matrix";
 import type { DeviceClientInformation } from "../utils/device/types.ts";
 import type { UserWidget } from "../utils/WidgetUtils-types.ts";
 
@@ -35,7 +36,7 @@ declare module "matrix-js-sdk/src/types" {
         [JitsiCallMemberEventType]: JitsiCallMemberContent;
 
         // Unstable widgets state events
-        "im.vector.modular.widgets": IWidget | {};
+        "im.vector.modular.widgets": IWidget | EmptyObject;
         [WIDGET_LAYOUT_EVENT_TYPE]: ILayoutStateEvent;
 
         // Element custom state events
@@ -104,6 +105,6 @@ declare module "matrix-js-sdk/src/types" {
             // https://github.com/matrix-org/matrix-doc/pull/3246
             waveform?: number[];
         };
-        "org.matrix.msc3245.voice"?: {};
+        "org.matrix.msc3245.voice"?: EmptyObject;
     }
 }

src/@types/react.d.ts

@@ -10,7 +10,7 @@ import React, { PropsWithChildren } from "react";
 
 declare module "react" {
     // Fix forwardRef types for Generic components - https://stackoverflow.com/a/58473012
-    function forwardRef<T, P = {}>(
+    function forwardRef<T, P extends object>(
         render: (props: PropsWithChildren<P>, ref: React.ForwardedRef<T>) => React.ReactElement | null,
     ): (props: P & React.RefAttributes<T>) => React.ReactElement | null;
 

src/AddThreepid.ts

@@ -249,6 +249,7 @@ export default class AddThreepid {
      * @param {{type: string, session?: string}} auth UI auth object
      * @return {Promise<Object>} Response from /3pid/add call (in current spec, an empty object)
      */
+    // eslint-disable-next-line @typescript-eslint/no-empty-object-type
     private makeAddThreepidOnlyRequest = (auth?: IAddThreePidOnlyBody["auth"] | null): Promise<{}> => {
         return this.matrixClient.addThreePidOnly({
             sid: this.sessionId!,

src/TextForEvent.tsx

@@ -17,6 +17,7 @@ import {
     MsgType,
     M_POLL_START,
     M_POLL_END,
+    ContentHelpers,
 } from "matrix-js-sdk/src/matrix";
 import { KnownMembership } from "matrix-js-sdk/src/types";
 import { logger } from "matrix-js-sdk/src/logger";
@@ -227,11 +228,16 @@ function textForMemberEvent(
 
 function textForTopicEvent(ev: MatrixEvent): (() => string) | null {
     const senderDisplayName = ev.sender && ev.sender.name ? ev.sender.name : ev.getSender();
+    const topic = ContentHelpers.parseTopicContent(ev.getContent()).text;
     return () =>
-        _t("timeline|m.room.topic", {
-            senderDisplayName,
-            topic: ev.getContent().topic,
-        });
+        topic
+            ? _t("timeline|m.room.topic|changed", {
+                  senderDisplayName,
+                  topic,
+              })
+            : _t("timeline|m.room.topic|removed", {
+                  senderDisplayName,
+              });
 }
 
 function textForRoomAvatarEvent(ev: MatrixEvent): (() => string) | null {

src/WorkerManager.ts

@@ -10,7 +10,7 @@ import { defer, IDeferred } from "matrix-js-sdk/src/utils";
 
 import { WorkerPayload } from "./workers/worker";
 
-export class WorkerManager<Request extends {}, Response> {
+export class WorkerManager<Request extends object, Response> {
     private readonly worker: Worker;
     private seq = 0;
     private pendingDeferredMap = new Map<number, IDeferred<Response>>();

src/autocomplete/QueryMatcher.ts

@@ -14,7 +14,7 @@ import { removeHiddenChars } from "matrix-js-sdk/src/utils";
 import { TimelineRenderingType } from "../contexts/RoomContext";
 import { Leaves } from "../@types/common";
 
-interface IOptions<T extends {}> {
+interface IOptions<T extends object> {
     keys: Array<Leaves<T>>;
     funcs?: Array<(o: T) => string | string[]>;
     shouldMatchWordsOnly?: boolean;
@@ -37,7 +37,7 @@ interface IOptions<T extends {}> {
  * @param {function[]} options.funcs List of functions that when called with the
  *     object as an arg will return a string to use as an index
  */
-export default class QueryMatcher<T extends {}> {
+export default class QueryMatcher<T extends object> {
     private _options: IOptions<T>;
     private _items = new Map<string, { object: T; keyWeight: number }[]>();
 

src/components/structures/AutoHideScrollbar.tsx

@@ -11,7 +11,7 @@ import classNames from "classnames";
 import React, { HTMLAttributes, ReactHTML, ReactNode, WheelEvent } from "react";
 
 type DynamicHtmlElementProps<T extends keyof JSX.IntrinsicElements> =
-    JSX.IntrinsicElements[T] extends HTMLAttributes<{}> ? DynamicElementProps<T> : DynamicElementProps<"div">;
+    JSX.IntrinsicElements[T] extends HTMLAttributes<object> ? DynamicElementProps<T> : DynamicElementProps<"div">;
 type DynamicElementProps<T extends keyof JSX.IntrinsicElements> = Partial<Omit<JSX.IntrinsicElements[T], "ref">>;
 
 export type IProps<T extends keyof JSX.IntrinsicElements> = Omit<DynamicHtmlElementProps<T>, "onScroll"> & {

src/components/structures/NonUrgentToastContainer.tsx

@@ -7,19 +7,18 @@ Please see LICENSE files in the repository root for full details.
 */
 
 import * as React from "react";
+import { EmptyObject } from "matrix-js-sdk/src/matrix";
 
 import { ComponentClass } from "../../@types/common";
 import NonUrgentToastStore from "../../stores/NonUrgentToastStore";
 import { UPDATE_EVENT } from "../../stores/AsyncStore";
 
-interface IProps {}
-
 interface IState {
     toasts: ComponentClass[];
 }
 
-export default class NonUrgentToastContainer extends React.PureComponent<IProps, IState> {
-    public constructor(props: IProps) {
+export default class NonUrgentToastContainer extends React.PureComponent<EmptyObject, IState> {
+    public constructor(props: EmptyObject) {
         super(props);
 
         this.state = {

src/components/structures/ToastContainer.tsx

@@ -9,6 +9,7 @@ Please see LICENSE files in the repository root for full details.
 import * as React from "react";
 import classNames from "classnames";
 import { Text } from "@vector-im/compound-web";
+import { EmptyObject } from "matrix-js-sdk/src/matrix";
 
 import ToastStore, { IToast } from "../../stores/ToastStore";
 
@@ -17,8 +18,8 @@ interface IState {
     countSeen: number;
 }
 
-export default class ToastContainer extends React.Component<{}, IState> {
-    public constructor(props: {}) {
+export default class ToastContainer extends React.Component<EmptyObject, IState> {
+    public constructor(props: EmptyObject) {
         super(props);
         this.state = {
             toasts: ToastStore.sharedInstance().getToasts(),

src/components/structures/auth/header/AuthHeaderProvider.tsx

@@ -24,7 +24,7 @@ interface AuthHeaderAction {
 
 export type AuthHeaderReducer = Reducer<ComponentProps<typeof AuthHeaderModifier>[], AuthHeaderAction>;
 
-export function AuthHeaderProvider({ children }: PropsWithChildren<{}>): JSX.Element {
+export function AuthHeaderProvider({ children }: PropsWithChildren): JSX.Element {
     const [state, dispatch] = useReducer<AuthHeaderReducer>(
         (state: ComponentProps<typeof AuthHeaderModifier>[], action: AuthHeaderAction) => {
             switch (action.type) {

src/components/views/audio_messages/Waveform.tsx

@@ -18,8 +18,6 @@ interface IProps {
     progress: number; // percent complete, 0-1, default 100%
 }
 
-interface IState {}
-
 /**
  * A simple waveform component. This renders bars (centered vertically) for each
  * height provided in the component properties. Updating the properties will update
@@ -28,7 +26,7 @@ interface IState {}
  * For CSS purposes, a mx_Waveform_bar_100pct class is added when the bar should be
  * "filled", as a demonstration of the progress property.
  */
-export default class Waveform extends React.PureComponent<IProps, IState> {
+export default class Waveform extends React.PureComponent<IProps> {
     public static defaultProps = {
         progress: 1,
     };

src/components/views/auth/InteractiveAuthEntryComponents.tsx

@@ -894,7 +894,7 @@ export class SSOAuthEntry extends React.Component<ISSOAuthEntryProps, ISSOAuthEn
     }
 }
 
-export class FallbackAuthEntry<T = {}> extends React.Component<IAuthEntryProps & T> {
+export class FallbackAuthEntry<T extends object> extends React.Component<IAuthEntryProps & T> {
     protected popupWindow: Window | null;
     protected fallbackButton = createRef<HTMLDivElement>();
 

src/components/views/auth/Welcome.tsx

@@ -7,6 +7,7 @@ Please see LICENSE files in the repository root for full details.
 
 import React from "react";
 import classNames from "classnames";
+import { EmptyObject } from "matrix-js-sdk/src/matrix";
 
 import SdkConfig from "../../../SdkConfig";
 import AuthPage from "./AuthPage";
@@ -16,9 +17,7 @@ import LanguageSelector from "./LanguageSelector";
 import EmbeddedPage from "../../structures/EmbeddedPage";
 import { MATRIX_LOGO_HTML } from "../../structures/static-page-vars";
 
-interface IProps {}
-
-export default class Welcome extends React.PureComponent<IProps> {
+export default class Welcome extends React.PureComponent<EmptyObject> {
     public render(): React.ReactNode {
         const pagesConfig = SdkConfig.getObject("embedded_pages");
         let pageUrl: string | undefined;

src/components/views/elements/EditableItemList.tsx

@@ -101,7 +101,7 @@ interface IProps {
     onNewItemChanged?(item: string): void;
 }
 
-export default class EditableItemList<P = {}> extends React.PureComponent<IProps & P> {
+export default class EditableItemList<P extends object> extends React.PureComponent<IProps & P> {
     protected onItemAdded = (e: ButtonEvent): void => {
         e.stopPropagation();
         e.preventDefault();

src/components/views/elements/StyledCheckbox.tsx

@@ -21,9 +21,7 @@ interface IProps extends React.InputHTMLAttributes<HTMLInputElement> {
     id?: string;
 }
 
-interface IState {}
-
-export default class StyledCheckbox extends React.PureComponent<IProps, IState> {
+export default class StyledCheckbox extends React.PureComponent<IProps> {
     private id: string;
 
     public static readonly defaultProps = {

src/components/views/elements/StyledRadioButton.tsx

@@ -18,9 +18,7 @@ interface IProps extends React.InputHTMLAttributes<HTMLInputElement> {
     childrenInLabel?: boolean;
 }
 
-interface IState {}
-
-export default class StyledRadioButton extends React.PureComponent<IProps, IState> {
+export default class StyledRadioButton extends React.PureComponent<IProps> {
     public static readonly defaultProps = {
         className: "",
         childrenInLabel: true,

src/components/views/right_panel/UserInfo.tsx

@@ -85,6 +85,7 @@ import { asyncSome } from "../../../utils/arrays";
 import { Flex } from "../../utils/Flex";
 import CopyableText from "../elements/CopyableText";
 import { useUserTimezone } from "../../../hooks/useUserTimezone";
+
 export interface IDevice extends Device {
     ambiguous?: boolean;
 }
@@ -580,8 +581,10 @@ export const warnSelfDemote = async (isSpace: boolean): Promise<boolean> => {
 
 const Container: React.FC<{
     children: ReactNode;
-}> = ({ children }) => {
-    return <div className="mx_UserInfo_container">{children}</div>;
+    className?: string;
+}> = ({ children, className }) => {
+    const classes = classNames("mx_UserInfo_container", className);
+    return <div className={classes}>{children}</div>;
 };
 
 interface IPowerLevelsContent {
@@ -1707,10 +1710,10 @@ export const UserInfoHeader: React.FC<{
                 </div>
             </div>
 
-            <Container>
+            <Container className="mx_UserInfo_header">
                 <Flex direction="column" align="center" className="mx_UserInfo_profile">
                     <Heading size="sm" weight="semibold" as="h1" dir="auto">
-                        <Flex direction="row-reverse" align="center">
+                        <Flex className="mx_UserInfo_profile_name" direction="row-reverse" align="center">
                             {displayName}
                             {e2eIcon}
                         </Flex>
@@ -1718,11 +1721,11 @@ export const UserInfoHeader: React.FC<{
                     {presenceLabel}
                     {timezoneInfo && (
                         <Tooltip label={timezoneInfo?.timezone ?? ""}>
-                            <span className="mx_UserInfo_timezone">
+                            <Flex align="center" className="mx_UserInfo_timezone">
                                 <Text size="sm" weight="regular">
                                     {timezoneInfo?.friendly ?? ""}
                                 </Text>
-                            </span>
+                            </Flex>
                         </Tooltip>
                     )}
                     <Text size="sm" weight="semibold" className="mx_UserInfo_profile_mxid">

src/components/views/room_settings/RoomProfileSettings.tsx

@@ -7,7 +7,7 @@ Please see LICENSE files in the repository root for full details.
 
 import React, { createRef } from "react";
 import classNames from "classnames";
-import { EventType } from "matrix-js-sdk/src/matrix";
+import { ContentHelpers, EventType } from "matrix-js-sdk/src/matrix";
 
 import { _t } from "../../../languageHandler";
 import { MatrixClientPeg } from "../../../MatrixClientPeg";
@@ -51,7 +51,7 @@ export default class RoomProfileSettings extends React.Component<IProps, IState>
         const avatarUrl = avatarEvent?.getContent()["url"] ?? null;
 
         const topicEvent = room.currentState.getStateEvents(EventType.RoomTopic, "");
-        const topic = topicEvent && topicEvent.getContent() ? topicEvent.getContent()["topic"] : "";
+        const topic = (topicEvent && ContentHelpers.parseTopicContent(topicEvent.getContent()).text) || "";
 
         const nameEvent = room.currentState.getStateEvents(EventType.RoomName, "");
         const name = nameEvent && nameEvent.getContent() ? nameEvent.getContent()["name"] : "";
@@ -145,6 +145,8 @@ export default class RoomProfileSettings extends React.Component<IProps, IState>
 
         if (this.state.originalTopic !== this.state.topic) {
             const html = htmlSerializeFromMdIfNeeded(this.state.topic, { forceHTML: false });
+            // XXX: Note that we deliberately send an empty string on an empty topic rather
+            // than a clearer `undefined` value. Synapse still requires a string in a topic.
             await client.setRoomTopic(this.props.roomId, this.state.topic, html);
             newState.originalTopic = this.state.topic;
         }

src/components/views/rooms/Autocomplete.tsx

@@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Com
 Please see LICENSE files in the repository root for full details.
 */
 
-import React, { createRef, KeyboardEvent, RefObject } from "react";
+import React, { createRef, RefObject } from "react";
 import classNames from "classnames";
 import { flatMap } from "lodash";
 import { Room } from "matrix-js-sdk/src/matrix";
@@ -206,7 +206,7 @@ export default class Autocomplete extends React.PureComponent<IProps, IState> {
         this.setSelection(1 + index);
     }
 
-    public onEscape(e: KeyboardEvent): boolean | undefined {
+    public onEscape(e: KeyboardEvent | React.KeyboardEvent): boolean | undefined {
         const completionCount = this.countCompletions();
         if (completionCount === 0) {
             // autocomplete is already empty, so don't preventDefault

src/components/views/rooms/RoomBreadcrumbs.tsx

@@ -7,7 +7,7 @@ Please see LICENSE files in the repository root for full details.
 */
 
 import React, { createRef } from "react";
-import { Room } from "matrix-js-sdk/src/matrix";
+import { EmptyObject, Room } from "matrix-js-sdk/src/matrix";
 import { CSSTransition } from "react-transition-group";
 
 import { BreadcrumbsStore } from "../../../stores/BreadcrumbsStore";
@@ -21,8 +21,6 @@ import { Action } from "../../../dispatcher/actions";
 import { ViewRoomPayload } from "../../../dispatcher/payloads/ViewRoomPayload";
 import AccessibleButton, { ButtonEvent } from "../elements/AccessibleButton";
 
-interface IProps {}
-
 interface IState {
     // Both of these control the animation for the breadcrumbs. For details on the
     // actual animation, see the CSS.
@@ -59,11 +57,11 @@ const RoomBreadcrumbTile: React.FC<{ room: Room; onClick: (ev: ButtonEvent) => v
     );
 };
 
-export default class RoomBreadcrumbs extends React.PureComponent<IProps, IState> {
+export default class RoomBreadcrumbs extends React.PureComponent<EmptyObject, IState> {
     private unmounted = false;
     private toolbar = createRef<HTMLDivElement>();
 
-    public constructor(props: IProps) {
+    public constructor(props: EmptyObject) {
         super(props);
 
         this.state = {

src/components/views/rooms/wysiwyg_composer/hooks/utils.ts

@@ -92,7 +92,7 @@ export function handleEventWithAutocomplete(
                 handled = true;
                 break;
             case KeyBindingAction.CancelAutocomplete:
-                autocompleteRef.current.onEscape(event as {} as React.KeyboardEvent);
+                autocompleteRef.current.onEscape(event);
                 handled = true;
                 break;
             default:

src/components/views/settings/CrossSigningPanel.tsx

@@ -7,7 +7,7 @@ Please see LICENSE files in the repository root for full details.
 */
 
 import React from "react";
-import { ClientEvent, MatrixEvent } from "matrix-js-sdk/src/matrix";
+import { ClientEvent, EmptyObject, MatrixEvent } from "matrix-js-sdk/src/matrix";
 import { logger } from "matrix-js-sdk/src/logger";
 import { CryptoEvent } from "matrix-js-sdk/src/crypto-api";
 
@@ -33,10 +33,10 @@ interface IState {
     crossSigningReady?: boolean;
 }
 
-export default class CrossSigningPanel extends React.PureComponent<{}, IState> {
+export default class CrossSigningPanel extends React.PureComponent<EmptyObject, IState> {
     private unmounted = false;
 
-    public constructor(props: {}) {
+    public constructor(props: EmptyObject) {
         super(props);
 
         this.state = {

src/components/views/settings/CryptographyPanel.tsx

@@ -8,6 +8,7 @@ Please see LICENSE files in the repository root for full details.
 
 import React, { lazy } from "react";
 import { logger } from "matrix-js-sdk/src/logger";
+import { EmptyObject } from "matrix-js-sdk/src/matrix";
 
 import { _t } from "../../../languageHandler";
 import Modal from "../../../Modal";
@@ -19,8 +20,6 @@ import { SettingLevel } from "../../../settings/SettingLevel";
 import { SettingsSubsection, SettingsSubsectionText } from "./shared/SettingsSubsection";
 import MatrixClientContext from "../../../contexts/MatrixClientContext";
 
-interface IProps {}
-
 interface IState {
     /** The device's base64-encoded Ed25519 identity key, or:
      *
@@ -30,11 +29,11 @@ interface IState {
     deviceIdentityKey: string | undefined | null;
 }
 
-export default class CryptographyPanel extends React.Component<IProps, IState> {
+export default class CryptographyPanel extends React.Component<EmptyObject, IState> {
     public static contextType = MatrixClientContext;
     declare public context: React.ContextType<typeof MatrixClientContext>;
 
-    public constructor(props: IProps, context: React.ContextType<typeof MatrixClientContext>) {
+    public constructor(props: EmptyObject, context: React.ContextType<typeof MatrixClientContext>) {
         super(props);
 
         if (!context.getCrypto()) {

src/components/views/settings/EventIndexPanel.tsx

@@ -7,6 +7,7 @@ Please see LICENSE files in the repository root for full details.
 */
 
 import React, { lazy } from "react";
+import { EmptyObject } from "matrix-js-sdk/src/matrix";
 
 import { _t } from "../../../languageHandler";
 import SdkConfig from "../../../SdkConfig";
@@ -28,8 +29,8 @@ interface IState {
     eventIndexingEnabled: boolean;
 }
 
-export default class EventIndexPanel extends React.Component<{}, IState> {
-    public constructor(props: {}) {
+export default class EventIndexPanel extends React.Component<EmptyObject, IState> {
+    public constructor(props: EmptyObject) {
         super(props);
 
         this.state = {

src/components/views/settings/FontScalingPanel.tsx

@@ -7,6 +7,7 @@ Please see LICENSE files in the repository root for full details.
 */
 
 import React from "react";
+import { EmptyObject } from "matrix-js-sdk/src/matrix";
 
 import EventTilePreview from "../elements/EventTilePreview";
 import SettingsStore from "../../../settings/SettingsStore";
@@ -18,8 +19,6 @@ import { SettingsSubsection } from "./shared/SettingsSubsection";
 import Field from "../elements/Field";
 import { FontWatcher } from "../../../settings/watchers/FontWatcher";
 
-interface IProps {}
-
 interface IState {
     browserFontSize: number;
     // String displaying the current selected fontSize.
@@ -34,7 +33,7 @@ interface IState {
     avatarUrl?: string;
 }
 
-export default class FontScalingPanel extends React.Component<IProps, IState> {
+export default class FontScalingPanel extends React.Component<EmptyObject, IState> {
     private readonly MESSAGE_PREVIEW_TEXT = _t("common|preview_message");
     /**
      * Font sizes available (in px)
@@ -43,7 +42,7 @@ export default class FontScalingPanel extends React.Component<IProps, IState> {
     private layoutWatcherRef?: string;
     private unmounted = false;
 
-    public constructor(props: IProps) {
+    public constructor(props: EmptyObject) {
         super(props);
 
         this.state = {

src/components/views/settings/ImageSizePanel.tsx

@@ -7,6 +7,7 @@ Please see LICENSE files in the repository root for full details.
 */
 
 import React from "react";
+import { EmptyObject } from "matrix-js-sdk/src/matrix";
 
 import SettingsStore from "../../../settings/SettingsStore";
 import StyledRadioButton from "../elements/StyledRadioButton";
@@ -15,16 +16,12 @@ import { SettingLevel } from "../../../settings/SettingLevel";
 import { ImageSize } from "../../../settings/enums/ImageSize";
 import { SettingsSubsection } from "./shared/SettingsSubsection";
 
-interface IProps {
-    // none
-}
-
 interface IState {
     size: ImageSize;
 }
 
-export default class ImageSizePanel extends React.Component<IProps, IState> {
-    public constructor(props: IProps) {
+export default class ImageSizePanel extends React.Component<EmptyObject, IState> {
+    public constructor(props: EmptyObject) {
         super(props);
 
         this.state = {

src/components/views/settings/Notifications.tsx

@@ -16,6 +16,7 @@ import {
     IThreepid,
     ThreepidMedium,
     LocalNotificationSettings,
+    EmptyObject,
 } from "matrix-js-sdk/src/matrix";
 import { logger } from "matrix-js-sdk/src/logger";
 
@@ -108,8 +109,6 @@ interface IVectorPushRule {
     syncedVectorState?: VectorState;
 }
 
-interface IProps {}
-
 interface IState {
     phase: Phase;
 
@@ -205,10 +204,10 @@ const NotificationActivitySettings = (): JSX.Element => {
 /**
  * The old, deprecated notifications tab view, only displayed if the user has the labs flag disabled.
  */
-export default class Notifications extends React.PureComponent<IProps, IState> {
+export default class Notifications extends React.PureComponent<EmptyObject, IState> {
     private settingWatchers: string[] = [];
 
-    public constructor(props: IProps) {
+    public constructor(props: EmptyObject) {
         super(props);
 
         this.state = {
@@ -255,7 +254,7 @@ export default class Notifications extends React.PureComponent<IProps, IState> {
         this.settingWatchers.forEach((watcher) => SettingsStore.unwatchSetting(watcher));
     }
 
-    public componentDidUpdate(prevProps: Readonly<IProps>, prevState: Readonly<IState>): void {
+    public componentDidUpdate(prevProps: Readonly<EmptyObject>, prevState: Readonly<IState>): void {
         if (this.state.deviceNotificationsEnabled !== prevState.deviceNotificationsEnabled) {
             this.persistLocalNotificationSettings(this.state.deviceNotificationsEnabled);
         }
@@ -291,7 +290,7 @@ export default class Notifications extends React.PureComponent<IProps, IState> {
         }
     }
 
-    private persistLocalNotificationSettings(enabled: boolean): Promise<{}> {
+    private persistLocalNotificationSettings(enabled: boolean): Promise<EmptyObject> {
         const cli = MatrixClientPeg.safeGet();
         return cli.setAccountData(getLocalNotificationAccountDataEventType(cli.deviceId), {
             is_silenced: !enabled,

src/components/views/settings/SecureBackupPanel.tsx

@@ -10,6 +10,7 @@ Please see LICENSE files in the repository root for full details.
 import React, { lazy, ReactNode } from "react";
 import { CryptoEvent, BackupTrustInfo, KeyBackupInfo } from "matrix-js-sdk/src/crypto-api";
 import { logger } from "matrix-js-sdk/src/logger";
+import { EmptyObject } from "matrix-js-sdk/src/matrix";
 
 import { MatrixClientPeg } from "../../../MatrixClientPeg";
 import { _t } from "../../../languageHandler";
@@ -60,10 +61,10 @@ interface IState {
     sessionsRemaining: number | null;
 }
 
-export default class SecureBackupPanel extends React.PureComponent<{}, IState> {
+export default class SecureBackupPanel extends React.PureComponent<EmptyObject, IState> {
     private unmounted = false;
 
-    public constructor(props: {}) {
+    public constructor(props: EmptyObject) {
         super(props);
 
         this.state = {

src/components/views/settings/SetIntegrationManager.tsx

@@ -8,6 +8,7 @@ Please see LICENSE files in the repository root for full details.
 
 import React from "react";
 import { logger } from "matrix-js-sdk/src/logger";
+import { EmptyObject } from "matrix-js-sdk/src/matrix";
 
 import { _t } from "../../../languageHandler";
 import { IntegrationManagers } from "../../../integrations/IntegrationManagers";
@@ -19,15 +20,13 @@ import Heading from "../typography/Heading";
 import { SettingsSubsectionText } from "./shared/SettingsSubsection";
 import { UIFeature } from "../../../settings/UIFeature";
 
-interface IProps {}
-
 interface IState {
     currentManager: IntegrationManagerInstance | null;
     provisioningEnabled: boolean;
 }
 
-export default class SetIntegrationManager extends React.Component<IProps, IState> {
-    public constructor(props: IProps) {
+export default class SetIntegrationManager extends React.Component<EmptyObject, IState> {
+    public constructor(props: EmptyObject) {
         super(props);
 
         const currentManager = IntegrationManagers.sharedInstance().getPrimaryManager();

src/components/views/settings/tabs/user/AppearanceUserSettingsTab.tsx

@@ -8,6 +8,7 @@ Please see LICENSE files in the repository root for full details.
 */
 
 import React, { ChangeEvent, ReactNode } from "react";
+import { EmptyObject } from "matrix-js-sdk/src/matrix";
 
 import { _t } from "../../../../../languageHandler";
 import SdkConfig from "../../../../../SdkConfig";
@@ -25,8 +26,6 @@ import SettingsTab from "../SettingsTab";
 import { SettingsSection } from "../../shared/SettingsSection";
 import { SettingsSubsection } from "../../shared/SettingsSubsection";
 
-interface IProps {}
-
 interface IState {
     useBundledEmojiFont: boolean;
     useSystemFont: boolean;
@@ -34,8 +33,8 @@ interface IState {
     showAdvanced: boolean;
 }
 
-export default class AppearanceUserSettingsTab extends React.Component<IProps, IState> {
-    public constructor(props: IProps) {
+export default class AppearanceUserSettingsTab extends React.Component<EmptyObject, IState> {
+    public constructor(props: EmptyObject) {
         super(props);
 
         this.state = {

src/components/views/settings/tabs/user/HelpUserSettingsTab.tsx

@@ -8,6 +8,7 @@ Please see LICENSE files in the repository root for full details.
 
 import React, { ReactNode } from "react";
 import { logger } from "matrix-js-sdk/src/logger";
+import { EmptyObject } from "matrix-js-sdk/src/matrix";
 
 import AccessibleButton from "../../../elements/AccessibleButton";
 import { _t } from "../../../../../languageHandler";
@@ -23,18 +24,16 @@ import { SettingsSubsection, SettingsSubsectionText } from "../../shared/Setting
 import ExternalLink from "../../../elements/ExternalLink";
 import MatrixClientContext from "../../../../../contexts/MatrixClientContext";
 
-interface IProps {}
-
 interface IState {
     appVersion: string | null;
     canUpdate: boolean;
 }
 
-export default class HelpUserSettingsTab extends React.Component<IProps, IState> {
+export default class HelpUserSettingsTab extends React.Component<EmptyObject, IState> {
     public static contextType = MatrixClientContext;
     declare public context: React.ContextType<typeof MatrixClientContext>;
 
-    public constructor(props: IProps, context: React.ContextType<typeof MatrixClientContext>) {
+    public constructor(props: EmptyObject, context: React.ContextType<typeof MatrixClientContext>) {
         super(props, context);
 
         this.state = {

src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx

@@ -7,6 +7,7 @@ Please see LICENSE files in the repository root for full details.
 
 import React from "react";
 import { sortBy } from "lodash";
+import { EmptyObject } from "matrix-js-sdk/src/matrix";
 
 import { _t } from "../../../../../languageHandler";
 import SettingsStore from "../../../../../settings/SettingsStore";
@@ -24,11 +25,11 @@ export const showLabsFlags = (): boolean => {
     return SdkConfig.get("show_labs_settings") || SettingsStore.getValue("developerMode");
 };
 
-export default class LabsUserSettingsTab extends React.Component<{}> {
+export default class LabsUserSettingsTab extends React.Component<EmptyObject> {
     private readonly labs: FeatureSettingKey[];
     private readonly betas: FeatureSettingKey[];
 
-    public constructor(props: {}) {
+    public constructor(props: EmptyObject) {
         super(props);
 
         const features = SettingsStore.getFeatureSettingNames();

src/components/views/settings/tabs/user/MjolnirUserSettingsTab.tsx

@@ -8,6 +8,7 @@ Please see LICENSE files in the repository root for full details.
 
 import React, { ChangeEvent, SyntheticEvent } from "react";
 import { logger } from "matrix-js-sdk/src/logger";
+import { EmptyObject } from "matrix-js-sdk/src/matrix";
 
 import { _t } from "../../../../../languageHandler";
 import SdkConfig from "../../../../../SdkConfig";
@@ -30,8 +31,8 @@ interface IState {
     newList: string;
 }
 
-export default class MjolnirUserSettingsTab extends React.Component<{}, IState> {
-    public constructor(props: {}) {
+export default class MjolnirUserSettingsTab extends React.Component<EmptyObject, IState> {
+    public constructor(props: EmptyObject) {
         super(props);
 
         this.state = {

src/components/views/settings/tabs/user/VoiceUserSettingsTab.tsx

@@ -10,6 +10,7 @@ Please see LICENSE files in the repository root for full details.
 import React, { ReactNode } from "react";
 import { logger } from "matrix-js-sdk/src/logger";
 import { FALLBACK_ICE_SERVER } from "matrix-js-sdk/src/webrtc/call";
+import { EmptyObject } from "matrix-js-sdk/src/matrix";
 
 import { _t } from "../../../../../languageHandler";
 import MediaDeviceHandler, { IMediaDevices, MediaDeviceKindEnum } from "../../../../../MediaDeviceHandler";
@@ -49,11 +50,11 @@ const mapDeviceKindToHandlerValue = (deviceKind: MediaDeviceKindEnum): string |
     }
 };
 
-export default class VoiceUserSettingsTab extends React.Component<{}, IState> {
+export default class VoiceUserSettingsTab extends React.Component<EmptyObject, IState> {
     public static contextType = MatrixClientContext;
     declare public context: React.ContextType<typeof MatrixClientContext>;
 
-    public constructor(props: {}, context: React.ContextType<typeof MatrixClientContext>) {
+    public constructor(props: EmptyObject, context: React.ContextType<typeof MatrixClientContext>) {
         super(props, context);
 
         this.state = {

src/contexts/MatrixClientContext.tsx

@@ -24,7 +24,7 @@ export function useMatrixClientContext(): MatrixClient {
     return useContext(MatrixClientContext);
 }
 
-const matrixHOC = <ComposedComponentProps extends {}>(
+const matrixHOC = <ComposedComponentProps extends object>(
     ComposedComponent: ComponentClass<ComposedComponentProps>,
 ): ((
     props: Omit<ComposedComponentProps, "mxClient"> & React.RefAttributes<InstanceType<typeof ComposedComponent>>,

src/editor/autocomplete.ts

@@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Com
 Please see LICENSE files in the repository root for full details.
 */
 
-import { KeyboardEvent } from "react";
+import React from "react";
 
 import { Part, CommandPartCreator, PartCreator } from "./parts";
 import DocumentPosition from "./position";
@@ -33,7 +33,7 @@ export default class AutocompleteWrapperModel {
         private partCreator: PartCreator | CommandPartCreator,
     ) {}
 
-    public onEscape(e: KeyboardEvent): void {
+    public onEscape(e: KeyboardEvent | React.KeyboardEvent): void {
         this.getAutocompleterComponent()?.onEscape(e);
     }
 

src/hooks/useAccountData.ts

@@ -11,10 +11,10 @@ import { AccountDataEvents, ClientEvent, MatrixClient, MatrixEvent } from "matri
 
 import { useTypedEventEmitter } from "./useEventEmitter";
 
-const tryGetContent = <T extends {}>(ev?: MatrixEvent): T | undefined => ev?.getContent<T>();
+const tryGetContent = <T extends object>(ev?: MatrixEvent): T | undefined => ev?.getContent<T>();
 
 // Hook to simplify listening to Matrix account data
-export const useAccountData = <T extends {}>(cli: MatrixClient, eventType: keyof AccountDataEvents): T => {
+export const useAccountData = <T extends object>(cli: MatrixClient, eventType: keyof AccountDataEvents): T => {
     const [value, setValue] = useState<T | undefined>(() => tryGetContent<T>(cli.getAccountData(eventType)));
 
     const handler = useCallback(

src/i18n/strings/en_EN.json

@@ -3493,7 +3493,10 @@
             "sent": "%(senderName)s sent an invitation to %(targetDisplayName)s to join the room."
         },
         "m.room.tombstone": "%(senderDisplayName)s upgraded this room.",
-        "m.room.topic": "%(senderDisplayName)s changed the topic to \"%(topic)s\".",
+        "m.room.topic": {
+            "changed": "%(senderDisplayName)s changed the topic to \"%(topic)s\".",
+            "removed": "%(senderDisplayName)s removed the topic."
+        },
         "m.sticker": "%(senderDisplayName)s sent a sticker.",
         "m.video": {
             "error_decrypting": "Error decrypting video"

src/stores/CallStore.ts

@@ -10,7 +10,7 @@ import { logger } from "matrix-js-sdk/src/logger";
 import { GroupCallEventHandlerEvent } from "matrix-js-sdk/src/webrtc/groupCallEventHandler";
 import { MatrixRTCSession, MatrixRTCSessionManagerEvents } from "matrix-js-sdk/src/matrixrtc";
 
-import type { GroupCall, Room } from "matrix-js-sdk/src/matrix";
+import type { EmptyObject, GroupCall, Room } from "matrix-js-sdk/src/matrix";
 import defaultDispatcher from "../dispatcher/dispatcher";
 import { UPDATE_EVENT } from "./AsyncStore";
 import { AsyncStoreWithClient } from "./AsyncStoreWithClient";
@@ -26,7 +26,7 @@ export enum CallStoreEvent {
     ConnectedCalls = "connected_calls",
 }
 
-export class CallStore extends AsyncStoreWithClient<{}> {
+export class CallStore extends AsyncStoreWithClient<EmptyObject> {
     private static _instance: CallStore;
     public static get instance(): CallStore {
         if (!this._instance) {

src/stores/WidgetStore.ts

@@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Com
 Please see LICENSE files in the repository root for full details.
 */
 
-import { Room, RoomStateEvent, MatrixEvent, ClientEvent } from "matrix-js-sdk/src/matrix";
+import { Room, RoomStateEvent, MatrixEvent, ClientEvent, EmptyObject } from "matrix-js-sdk/src/matrix";
 import { IWidget } from "matrix-widget-api";
 import { logger } from "matrix-js-sdk/src/logger";
 
@@ -19,8 +19,6 @@ import WidgetUtils from "../utils/WidgetUtils";
 import { UPDATE_EVENT } from "./AsyncStore";
 import { IApp } from "../utils/WidgetUtils-types";
 
-interface IState {}
-
 export type { IApp };
 
 export function isAppWidget(widget: IWidget | IApp): widget is IApp {
@@ -36,7 +34,7 @@ interface IRoomWidgets {
 
 // TODO consolidate WidgetEchoStore into this
 // TODO consolidate ActiveWidgetStore into this
-export default class WidgetStore extends AsyncStoreWithClient<IState> {
+export default class WidgetStore extends AsyncStoreWithClient<EmptyObject> {
     private static readonly internalInstance = (() => {
         const instance = new WidgetStore();
         instance.start();

src/stores/notifications/RoomNotificationStateStore.ts

@@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Com
 Please see LICENSE files in the repository root for full details.
 */
 
-import { Room, ClientEvent, SyncState } from "matrix-js-sdk/src/matrix";
+import { Room, ClientEvent, SyncState, EmptyObject } from "matrix-js-sdk/src/matrix";
 
 import { ActionPayload } from "../../dispatcher/payloads";
 import { AsyncStoreWithClient } from "../AsyncStoreWithClient";
@@ -19,11 +19,9 @@ import { VisibilityProvider } from "../room-list/filters/VisibilityProvider";
 import { PosthogAnalytics } from "../../PosthogAnalytics";
 import SettingsStore from "../../settings/SettingsStore";
 
-interface IState {}
-
 export const UPDATE_STATUS_INDICATOR = Symbol("update-status-indicator");
 
-export class RoomNotificationStateStore extends AsyncStoreWithClient<IState> {
+export class RoomNotificationStateStore extends AsyncStoreWithClient<EmptyObject> {
     private static readonly internalInstance = (() => {
         const instance = new RoomNotificationStateStore();
         instance.start();

src/stores/room-list/MessagePreviewStore.ts

@@ -6,7 +6,15 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Com
 Please see LICENSE files in the repository root for full details.
 */
 
-import { Room, RelationType, MatrixEvent, Thread, M_POLL_START, RoomEvent } from "matrix-js-sdk/src/matrix";
+import {
+    Room,
+    RelationType,
+    MatrixEvent,
+    Thread,
+    M_POLL_START,
+    RoomEvent,
+    EmptyObject,
+} from "matrix-js-sdk/src/matrix";
 import { isNullOrUndefined } from "matrix-js-sdk/src/utils";
 
 import { ActionPayload } from "../../dispatcher/payloads";
@@ -76,10 +84,6 @@ const MAX_EVENTS_BACKWARDS = 50;
 type TAG_ANY = "im.vector.any"; // eslint-disable-line @typescript-eslint/naming-convention
 const TAG_ANY: TAG_ANY = "im.vector.any";
 
-interface IState {
-    // Empty because we don't actually use the state
-}
-
 export interface MessagePreview {
     event: MatrixEvent;
     isThreadReply: boolean;
@@ -117,7 +121,7 @@ const mkMessagePreview = (text: string, event: MatrixEvent): MessagePreview => {
     };
 };
 
-export class MessagePreviewStore extends AsyncStoreWithClient<IState> {
+export class MessagePreviewStore extends AsyncStoreWithClient<EmptyObject> {
     private static readonly internalInstance = (() => {
         const instance = new MessagePreviewStore();
         instance.start();

src/stores/room-list/RoomListLayoutStore.ts

@@ -7,6 +7,7 @@ Please see LICENSE files in the repository root for full details.
 */
 
 import { logger } from "matrix-js-sdk/src/logger";
+import { EmptyObject } from "matrix-js-sdk/src/matrix";
 
 import { TagID } from "./models";
 import { ListLayout } from "./ListLayout";
@@ -14,9 +15,7 @@ import { AsyncStoreWithClient } from "../AsyncStoreWithClient";
 import defaultDispatcher from "../../dispatcher/dispatcher";
 import { ActionPayload } from "../../dispatcher/payloads";
 
-interface IState {}
-
-export default class RoomListLayoutStore extends AsyncStoreWithClient<IState> {
+export default class RoomListLayoutStore extends AsyncStoreWithClient<EmptyObject> {
     private static internalInstance: RoomListLayoutStore;
 
     private readonly layoutMap = new Map<TagID, ListLayout>();

src/stores/room-list/RoomListStore.ts

@@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Com
 Please see LICENSE files in the repository root for full details.
 */
 
-import { MatrixClient, Room, RoomState, EventType } from "matrix-js-sdk/src/matrix";
+import { MatrixClient, Room, RoomState, EventType, EmptyObject } from "matrix-js-sdk/src/matrix";
 import { KnownMembership } from "matrix-js-sdk/src/types";
 import { logger } from "matrix-js-sdk/src/logger";
 
@@ -32,14 +32,10 @@ import { UPDATE_EVENT } from "../AsyncStore";
 import { SdkContextClass } from "../../contexts/SDKContext";
 import { getChangedOverrideRoomMutePushRules } from "./utils/roomMute";
 
-interface IState {
-    // state is tracked in underlying classes
-}
-
 export const LISTS_UPDATE_EVENT = RoomListStoreEvent.ListsUpdate;
 export const LISTS_LOADING_EVENT = RoomListStoreEvent.ListsLoading; // unused; used by SlidingRoomListStore
 
-export class RoomListStoreClass extends AsyncStoreWithClient<IState> implements Interface {
+export class RoomListStoreClass extends AsyncStoreWithClient<EmptyObject> implements Interface {
     /**
      * Set to true if you're running tests on the store. Should not be touched in
      * any other environment.

src/stores/room-list/SlidingRoomListStore.ts

@@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Com
 Please see LICENSE files in the repository root for full details.
 */
 
-import { Room } from "matrix-js-sdk/src/matrix";
+import { EmptyObject, Room } from "matrix-js-sdk/src/matrix";
 import { logger } from "matrix-js-sdk/src/logger";
 import { MSC3575Filter, SlidingSyncEvent } from "matrix-js-sdk/src/sliding-sync";
 import { Optional } from "matrix-events-sdk";
@@ -23,10 +23,6 @@ import { LISTS_LOADING_EVENT } from "./RoomListStore";
 import { UPDATE_EVENT } from "../AsyncStore";
 import { SdkContextClass } from "../../contexts/SDKContext";
 
-interface IState {
-    // state is tracked in underlying classes
-}
-
 export const SlidingSyncSortToFilter: Record<SortAlgorithm, string[]> = {
     [SortAlgorithm.Alphabetic]: ["by_name", "by_recency"],
     [SortAlgorithm.Recent]: ["by_notification_level", "by_recency"],
@@ -66,7 +62,7 @@ const filterConditions: Record<TagID, MSC3575Filter> = {
 
 export const LISTS_UPDATE_EVENT = RoomListStoreEvent.ListsUpdate;
 
-export class SlidingRoomListStoreClass extends AsyncStoreWithClient<IState> implements Interface {
+export class SlidingRoomListStoreClass extends AsyncStoreWithClient<EmptyObject> implements Interface {
     private tagIdToSortAlgo: Record<TagID, SortAlgorithm> = {};
     private tagMap: ITagMap = {};
     private counts: Record<TagID, number> = {};

src/stores/spaces/SpaceStore.ts

@@ -17,6 +17,7 @@ import {
     MatrixEvent,
     ClientEvent,
     ISendEventResponse,
+    EmptyObject,
 } from "matrix-js-sdk/src/matrix";
 import { KnownMembership } from "matrix-js-sdk/src/types";
 import { logger } from "matrix-js-sdk/src/logger";
@@ -63,8 +64,6 @@ import { SwitchSpacePayload } from "../../dispatcher/payloads/SwitchSpacePayload
 import { AfterLeaveRoomPayload } from "../../dispatcher/payloads/AfterLeaveRoomPayload";
 import { SdkContextClass } from "../../contexts/SDKContext";
 
-interface IState {}
-
 const ACTIVE_SPACE_LS_KEY = "mx_active_space";
 
 const metaSpaceOrder: MetaSpace[] = [
@@ -123,7 +122,7 @@ type SpaceStoreActions =
     | SwitchSpacePayload
     | AfterLeaveRoomPayload;
 
-export class SpaceStoreClass extends AsyncStoreWithClient<IState> {
+export class SpaceStoreClass extends AsyncStoreWithClient<EmptyObject> {
     // The spaces representing the roots of the various tree-like hierarchies
     private rootSpaces: Room[] = [];
     // Map from room/space ID to set of spaces which list it as a child

src/stores/widgets/WidgetMessagingStore.ts

@@ -7,6 +7,7 @@
  */
 
 import { ClientWidgetApi, Widget } from "matrix-widget-api";
+import { EmptyObject } from "matrix-js-sdk/src/matrix";
 
 import { AsyncStoreWithClient } from "../AsyncStoreWithClient";
 import defaultDispatcher from "../../dispatcher/dispatcher";
@@ -24,7 +25,7 @@ export enum WidgetMessagingStoreEvent {
  * going to be merged with a more complete WidgetStore, but for now it's
  * easiest to split this into a single place.
  */
-export class WidgetMessagingStore extends AsyncStoreWithClient<{}> {
+export class WidgetMessagingStore extends AsyncStoreWithClient<EmptyObject> {
     private static readonly internalInstance = (() => {
         const instance = new WidgetMessagingStore();
         instance.start();

src/utils/MultiInviter.ts

@@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Com
 Please see LICENSE files in the repository root for full details.
 */
 
-import { MatrixError, MatrixClient, EventType } from "matrix-js-sdk/src/matrix";
+import { MatrixError, MatrixClient, EventType, EmptyObject } from "matrix-js-sdk/src/matrix";
 import { KnownMembership } from "matrix-js-sdk/src/types";
 import { defer, IDeferred } from "matrix-js-sdk/src/utils";
 import { logger } from "matrix-js-sdk/src/logger";
@@ -117,7 +117,7 @@ export default class MultiInviter {
         return this.errors[addr]?.errorText ?? null;
     }
 
-    private async inviteToRoom(roomId: string, addr: string, ignoreProfile = false): Promise<{}> {
+    private async inviteToRoom(roomId: string, addr: string, ignoreProfile = false): Promise<EmptyObject> {
         const addrType = getAddressType(addr);
 
         if (addrType === AddressType.Email) {

src/utils/PinningUtils.ts

@@ -6,7 +6,15 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Com
 Please see LICENSE files in the repository root for full details.
 */
 
-import { MatrixEvent, EventType, M_POLL_START, MatrixClient, EventTimeline, Room } from "matrix-js-sdk/src/matrix";
+import {
+    MatrixEvent,
+    EventType,
+    M_POLL_START,
+    MatrixClient,
+    EventTimeline,
+    Room,
+    EmptyObject,
+} from "matrix-js-sdk/src/matrix";
 
 import { isContentActionable } from "./EventUtils";
 import { ReadPinsEventId } from "../components/views/right_panel/types";
@@ -123,7 +131,7 @@ export default class PinningUtils {
                 ?.getStateEvents(EventType.RoomPinnedEvents, "")
                 ?.getContent().pinned || [];
 
-        let roomAccountDataPromise: Promise<{} | void> = Promise.resolve();
+        let roomAccountDataPromise: Promise<EmptyObject | void> = Promise.resolve();
         // If the event is already pinned, unpin it
         if (pinnedIds.includes(eventId)) {
             pinnedIds.splice(pinnedIds.indexOf(eventId), 1);

src/utils/notifications.ts

@@ -14,6 +14,7 @@ import {
     LocalNotificationSettings,
     ReceiptType,
     IMarkedUnreadEvent,
+    EmptyObject,
 } from "matrix-js-sdk/src/matrix";
 import { IndicatorIcon } from "@vector-im/compound-web";
 
@@ -80,7 +81,7 @@ export function localNotificationsAreSilenced(cli: MatrixClient): boolean {
  * @param client
  * @returns a promise that resolves when the room has been marked as read
  */
-export async function clearRoomNotification(room: Room, client: MatrixClient): Promise<{} | undefined> {
+export async function clearRoomNotification(room: Room, client: MatrixClient): Promise<EmptyObject | undefined> {
     const lastEvent = room.getLastLiveEvent();
 
     await setMarkedUnreadState(room, client, false);
@@ -115,15 +116,17 @@ export async function clearRoomNotification(room: Room, client: MatrixClient): P
  * @param client The matrix client
  * @returns a promise that resolves when all rooms have been marked as read
  */
-export function clearAllNotifications(client: MatrixClient): Promise<Array<{} | undefined>> {
-    const receiptPromises = client.getRooms().reduce((promises: Array<Promise<{} | undefined>>, room: Room) => {
-        if (doesRoomHaveUnreadMessages(room, true)) {
-            const promise = clearRoomNotification(room, client);
-            promises.push(promise);
-        }
+export function clearAllNotifications(client: MatrixClient): Promise<Array<EmptyObject | undefined>> {
+    const receiptPromises = client
+        .getRooms()
+        .reduce((promises: Array<Promise<EmptyObject | undefined>>, room: Room) => {
+            if (doesRoomHaveUnreadMessages(room, true)) {
+                const promise = clearRoomNotification(room, client);
+                promises.push(promise);
+            }
 
-        return promises;
-    }, []);
+            return promises;
+        }, []);
 
     return Promise.all(receiptPromises);
 }

src/utils/objects.ts

@@ -8,7 +8,7 @@ Please see LICENSE files in the repository root for full details.
 
 import { arrayDiff, arrayUnion, arrayIntersection } from "./arrays";
 
-type ObjectExcluding<O extends {}, P extends (keyof O)[]> = { [k in Exclude<keyof O, P[number]>]: O[k] };
+type ObjectExcluding<O extends object, P extends (keyof O)[]> = { [k in Exclude<keyof O, P[number]>]: O[k] };
 
 /**
  * Gets a new object which represents the provided object, excluding some properties.
@@ -16,7 +16,7 @@ type ObjectExcluding<O extends {}, P extends (keyof O)[]> = { [k in Exclude<keyo
  * @param props The property names to remove.
  * @returns The new object without the provided properties.
  */
-export function objectExcluding<O extends {}, P extends Array<keyof O>>(a: O, props: P): ObjectExcluding<O, P> {
+export function objectExcluding<O extends object, P extends Array<keyof O>>(a: O, props: P): ObjectExcluding<O, P> {
     // We use a Map to avoid hammering the `delete` keyword, which is slow and painful.
     const tempMap = new Map<keyof O, any>(Object.entries(a) as [keyof O, any][]);
     for (const prop of props) {
@@ -37,7 +37,7 @@ export function objectExcluding<O extends {}, P extends Array<keyof O>>(a: O, pr
  * @param props The property names to keep.
  * @returns The new object with only the provided properties.
  */
-export function objectWithOnly<O extends {}, P extends Array<keyof O>>(a: O, props: P): { [k in P[number]]: O[k] } {
+export function objectWithOnly<O extends object, P extends Array<keyof O>>(a: O, props: P): { [k in P[number]]: O[k] } {
     const existingProps = Object.keys(a) as (keyof O)[];
     const diff = arrayDiff(existingProps, props);
     if (diff.removed.length === 0) {
@@ -58,7 +58,7 @@ export function objectWithOnly<O extends {}, P extends Array<keyof O>>(a: O, pro
  * First argument is the property key with the second being the current value.
  * @returns A cloned object.
  */
-export function objectShallowClone<O extends {}>(a: O, propertyCloner?: (k: keyof O, v: O[keyof O]) => any): O {
+export function objectShallowClone<O extends object>(a: O, propertyCloner?: (k: keyof O, v: O[keyof O]) => any): O {
     const newObj = {} as O;
     for (const [k, v] of Object.entries(a) as [keyof O, O[keyof O]][]) {
         newObj[k] = v;
@@ -77,7 +77,7 @@ export function objectShallowClone<O extends {}>(a: O, propertyCloner?: (k: keyo
  * @param b The second object. Must be defined.
  * @returns True if there's a difference between the objects, false otherwise
  */
-export function objectHasDiff<O extends {}>(a: O, b: O): boolean {
+export function objectHasDiff<O extends object>(a: O, b: O): boolean {
     if (a === b) return false;
     const aKeys = Object.keys(a);
     const bKeys = Object.keys(b);
@@ -99,7 +99,7 @@ type Diff<K> = { changed: K[]; added: K[]; removed: K[] };
  * @param b The second object. Must be defined.
  * @returns The difference between the keys of each object.
  */
-export function objectDiff<O extends {}>(a: O, b: O): Diff<keyof O> {
+export function objectDiff<O extends object>(a: O, b: O): Diff<keyof O> {
     const aKeys = Object.keys(a) as (keyof O)[];
     const bKeys = Object.keys(b) as (keyof O)[];
     const keyDiff = arrayDiff(aKeys, bKeys);
@@ -118,7 +118,7 @@ export function objectDiff<O extends {}>(a: O, b: O): Diff<keyof O> {
  * @returns The keys which have been added, removed, or changed between the
  * two objects.
  */
-export function objectKeyChanges<O extends {}>(a: O, b: O): (keyof O)[] {
+export function objectKeyChanges<O extends object>(a: O, b: O): (keyof O)[] {
     const diff = objectDiff(a, b);
     return arrayUnion(diff.removed, diff.added, diff.changed);
 }
@@ -130,7 +130,7 @@ export function objectKeyChanges<O extends {}>(a: O, b: O): (keyof O)[] {
  * @param obj The object to clone.
  * @returns The cloned object
  */
-export function objectClone<O extends {}>(obj: O): O {
+export function objectClone<O extends object>(obj: O): O {
     return JSON.parse(JSON.stringify(obj));
 }
 

src/vector/app.tsx

@@ -17,6 +17,7 @@ import { logger } from "matrix-js-sdk/src/logger";
 import { createClient, AutoDiscovery, ClientConfig } from "matrix-js-sdk/src/matrix";
 import { WrapperLifecycle, WrapperOpts } from "@matrix-org/react-sdk-module-api/lib/lifecycles/WrapperLifecycle";
 
+import type { QueryDict } from "matrix-js-sdk/src/utils";
 import PlatformPeg from "../PlatformPeg";
 import AutoDiscoveryUtils from "../utils/AutoDiscoveryUtils";
 import * as Lifecycle from "../Lifecycle";
@@ -54,7 +55,7 @@ function onTokenLoginCompleted(): void {
     window.history.replaceState(null, "", url.href);
 }
 
-export async function loadApp(fragParams: {}, matrixChatRef: React.Ref<MatrixChat>): Promise<ReactElement> {
+export async function loadApp(fragParams: QueryDict, matrixChatRef: React.Ref<MatrixChat>): Promise<ReactElement> {
     initRouting();
     const platform = PlatformPeg.get();
 

src/vector/init.tsx

@@ -12,6 +12,7 @@ import { createRoot } from "react-dom/client";
 import React, { StrictMode } from "react";
 import { logger } from "matrix-js-sdk/src/logger";
 
+import type { QueryDict } from "matrix-js-sdk/src/utils";
 import * as languageHandler from "../languageHandler";
 import SettingsStore from "../settings/SettingsStore";
 import PlatformPeg from "../PlatformPeg";
@@ -83,7 +84,7 @@ export async function loadTheme(): Promise<void> {
     return setTheme();
 }
 
-export async function loadApp(fragParams: {}): Promise<void> {
+export async function loadApp(fragParams: QueryDict): Promise<void> {
     // load app.js async so that its code is not executed immediately and we can catch any exceptions
     const module = await import(
         /* webpackChunkName: "element-web-app" */

src/vector/platform/IPCManager.ts

@@ -40,7 +40,7 @@ export class IPCManager {
         return deferred.promise;
     }
 
-    private onIpcReply = (_ev: {}, payload: IPCPayload): void => {
+    private onIpcReply = (_ev: Event, payload: IPCPayload): void => {
         if (payload.id === undefined) {
             logger.warn("Ignoring IPC reply with no ID");
             return;

test/unit-tests/TextForEvent-test.ts

@@ -12,6 +12,7 @@ import {
     JoinRule,
     MatrixClient,
     MatrixEvent,
+    MRoomTopicEventContent,
     Room,
     RoomMember,
 } from "matrix-js-sdk/src/matrix";
@@ -613,4 +614,47 @@ describe("TextForEvent", () => {
             },
         );
     });
+
+    describe("textForTopicEvent()", () => {
+        type TestCase = [string, MRoomTopicEventContent, { result: string }];
+        const testCases: TestCase[] = [
+            ["the legacy key", { topic: "My topic" }, { result: '@a changed the topic to "My topic".' }],
+            [
+                "the legacy key with an empty m.topic key",
+                { "topic": "My topic", "m.topic": [] },
+                { result: '@a changed the topic to "My topic".' },
+            ],
+            [
+                "the m.topic key",
+                { "topic": "Ignore this", "m.topic": [{ mimetype: "text/plain", body: "My topic" }] },
+                { result: '@a changed the topic to "My topic".' },
+            ],
+            [
+                "the m.topic key and the legacy key undefined",
+                { "topic": undefined, "m.topic": [{ mimetype: "text/plain", body: "My topic" }] },
+                { result: '@a changed the topic to "My topic".' },
+            ],
+            ["the legacy key undefined", { topic: undefined }, { result: "@a removed the topic." }],
+            ["the legacy key empty string", { topic: "" }, { result: "@a removed the topic." }],
+            [
+                "both the legacy and new keys removed",
+                { "topic": undefined, "m.topic": [] },
+                { result: "@a removed the topic." },
+            ],
+        ];
+
+        it.each(testCases)("returns correct message for topic event with %s", (_caseName, content, { result }) => {
+            expect(
+                textForEvent(
+                    new MatrixEvent({
+                        type: "m.room.topic",
+                        sender: "@a",
+                        content: content,
+                        state_key: "",
+                    }),
+                    mockClient,
+                ),
+            ).toEqual(result);
+        });
+    });
 });

test/unit-tests/components/views/right_panel/__snapshots__/UserInfo-test.tsx.snap

@@ -142,7 +142,7 @@ exports[`<UserInfo /> with crypto enabled renders <BasicUserInfo /> 1`] = `
         </div>
       </div>
       <div
-        class="mx_UserInfo_container"
+        class="mx_UserInfo_container mx_UserInfo_header"
       >
         <div
           class="mx_Flex mx_UserInfo_profile"
@@ -153,7 +153,7 @@ exports[`<UserInfo /> with crypto enabled renders <BasicUserInfo /> 1`] = `
             dir="auto"
           >
             <div
-              class="mx_Flex"
+              class="mx_Flex mx_UserInfo_profile_name"
               style="--mx-flex-display: flex; --mx-flex-direction: row-reverse; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: 0;"
             >
               @user:example.com
@@ -456,7 +456,7 @@ exports[`<UserInfo /> with crypto enabled should render a deactivate button for
         </div>
       </div>
       <div
-        class="mx_UserInfo_container"
+        class="mx_UserInfo_container mx_UserInfo_header"
       >
         <div
           class="mx_Flex mx_UserInfo_profile"
@@ -467,7 +467,7 @@ exports[`<UserInfo /> with crypto enabled should render a deactivate button for
             dir="auto"
           >
             <div
-              class="mx_Flex"
+              class="mx_Flex mx_UserInfo_profile_name"
               style="--mx-flex-display: flex; --mx-flex-direction: row-reverse; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: 0;"
             >
               @user:example.com

test/unit-tests/components/views/settings/tabs/user/LabsUserSettingsTab-test.tsx

@@ -14,10 +14,7 @@ import SettingsStore from "../../../../../../../src/settings/SettingsStore";
 import SdkConfig from "../../../../../../../src/SdkConfig";
 
 describe("<LabsUserSettingsTab />", () => {
-    const defaultProps = {
-        closeSettingsFn: jest.fn(),
-    };
-    const getComponent = () => <LabsUserSettingsTab {...defaultProps} />;
+    const getComponent = () => <LabsUserSettingsTab />;
 
     const settingsValueSpy = jest.spyOn(SettingsStore, "getValue");
 

test/unit-tests/components/views/settings/tabs/user/SessionManagerTab-test.tsx

@@ -1104,8 +1104,9 @@ describe("<SessionManagerTab />", () => {
                 // because promise flushing after the confirm modal is resolving this too
                 // and we want to test the loading state here
                 const resolveDeleteRequest = defer<IAuthData>();
-                mockClient.deleteMultipleDevices.mockImplementation(() => {
-                    return resolveDeleteRequest.promise;
+                mockClient.deleteMultipleDevices.mockImplementation(async () => {
+                    await resolveDeleteRequest.promise;
+                    return {};
                 });
 
                 const { getByTestId } = render(getComponent());

test/unit-tests/hooks/useProfileInfo-test.tsx

@@ -7,7 +7,7 @@ Please see LICENSE files in the repository root for full details.
 */
 
 import { waitFor, renderHook, act } from "jest-matrix-react";
-import { MatrixClient } from "matrix-js-sdk/src/matrix";
+import { EmptyObject, MatrixClient } from "matrix-js-sdk/src/matrix";
 
 import { useProfileInfo } from "../../../src/hooks/useProfileInfo";
 import { MatrixClientPeg } from "../../../src/MatrixClientPeg";
@@ -93,7 +93,7 @@ describe("useProfileInfo", () => {
     });
 
     it("should be able to handle an empty result", async () => {
-        cli.getProfileInfo = () => null as unknown as Promise<{}>;
+        cli.getProfileInfo = () => null as unknown as Promise<EmptyObject>;
         const query = "@user:home.server";
 
         const { result } = render();