Apply lint rule @typescript-eslint/no-empty-object-type (#29159)

* Apply lint rule @typescript-eslint/no-empty-object-type

To avoid the footgun that is https://www.totaltypescript.com/the-empty-object-type-in-typescript

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

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/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 = {