Update typescript-eslint monorepo to v8 (major)

.eslintrc.js

@@ -198,6 +198,8 @@ 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",
             },
         },
         // temporary override for offending icon require files

package.json

@@ -186,6 +186,7 @@
         "@playwright/test": "^1.40.1",
         "@principalstudio/html-webpack-inject-preload": "^1.2.7",
         "@sentry/webpack-plugin": "^2.7.1",
+        "@stylistic/eslint-plugin": "^2.9.0",
         "@svgr/webpack": "^8.0.0",
         "@testing-library/dom": "^9.0.0",
         "@testing-library/jest-dom": "^6.0.0",
@@ -223,8 +224,8 @@
         "@types/tar-js": "^0.3.5",
         "@types/ua-parser-js": "^0.7.36",
         "@types/uuid": "^10.0.0",
-        "@typescript-eslint/eslint-plugin": "^7.0.0",
-        "@typescript-eslint/parser": "^7.0.0",
+        "@typescript-eslint/eslint-plugin": "^8.0.0",
+        "@typescript-eslint/parser": "^8.0.0",
         "axe-core": "4.10.0",
         "babel-jest": "^29.0.0",
         "babel-loader": "^9.0.0",
@@ -246,7 +247,7 @@
         "eslint-plugin-import": "^2.25.4",
         "eslint-plugin-jest": "^28.0.0",
         "eslint-plugin-jsx-a11y": "^6.5.1",
-        "eslint-plugin-matrix-org": "1.2.1",
+        "eslint-plugin-matrix-org": "^2.0.2",
         "eslint-plugin-react": "^7.28.0",
         "eslint-plugin-react-hooks": "^4.3.0",
         "eslint-plugin-unicorn": "^56.0.0",

playwright/e2e/read-receipts/index.ts

@@ -69,7 +69,7 @@ export class MessageBuilder {
     /**
      * Map of message content -> event.
      */
-    messages = new Map<String, Promise<JSHandle<MatrixEvent>>>();
+    messages = new Map<string, Promise<JSHandle<MatrixEvent>>>();
 
     /**
      * Utility to find a MatrixEvent by its body content

playwright/e2e/spaces/threads-activity-centre/index.ts

@@ -70,7 +70,7 @@ export class MessageBuilder {
     /**
      * Map of message content -> event.
      */
-    messages = new Map<String, Promise<JSHandle<MatrixEvent>>>();
+    messages = new Map<string, Promise<JSHandle<MatrixEvent>>>();
 
     /**
      * Utility to find a MatrixEvent by its body content

src/@types/common.ts

@@ -35,13 +35,15 @@ export type Defaultize<P, D> = P extends any
               Partial<Pick<D, Exclude<keyof D, keyof P>>>
     : never;
 
+/* eslint-disable @typescript-eslint/no-unsafe-function-type */
 export type DeepReadonly<T> = T extends (infer R)[]
     ? DeepReadonlyArray<R>
     : T extends Function
       ? T
       : T extends object
         ? DeepReadonlyObject<T>
         : T;
+/* eslint-enable @typescript-eslint/no-unsafe-function-type */
 
 interface DeepReadonlyArray<T> extends ReadonlyArray<DeepReadonly<T>> {}
 

src/BasePlatform.ts

@@ -129,7 +129,7 @@ export default abstract class BasePlatform {
         try {
             const [version, deferUntil] = JSON.parse(localStorage.getItem(UPDATE_DEFER_KEY)!);
             return newVersion !== version || Date.now() > deferUntil;
-        } catch (e) {
+        } catch {
             return true;
         }
     }
@@ -380,7 +380,7 @@ export default abstract class BasePlatform {
 
         try {
             await idbSave("pickleKey", [userId, deviceId], data);
-        } catch (e) {
+        } catch {
             return null;
         }
         return encodeUnpaddedBase64(randomArray);

src/DraftCleaner.ts

@@ -48,7 +48,7 @@ function shouldCleanupDrafts(): boolean {
             return true;
         }
         return Date.now() > parsedTimestamp + DRAFT_CLEANUP_PERIOD;
-    } catch (error) {
+    } catch {
         return true;
     }
 }

src/HtmlUtils.tsx

@@ -52,7 +52,7 @@ export const EMOJI_REGEX = (() => {
         // want the app to completely crash on older platforms. We use the
         // constructor here to avoid a syntax error on such platforms.
         return new RegExp("\\p{RGI_Emoji}(?!\\uFE0E)(?:(?<!\\uFE0F)\\uFE0F)?|[\\u{1f1e6}-\\u{1f1ff}]", "v");
-    } catch (_e) {
+    } catch {
         // v mode not supported; fall back to matching nothing
         return /(?!)/;
     }
@@ -61,7 +61,7 @@ export const EMOJI_REGEX = (() => {
 const BIGEMOJI_REGEX = (() => {
     try {
         return new RegExp(`^(${EMOJI_REGEX.source})+$`, "iv");
-    } catch (_e) {
+    } catch {
         // Fall back, just like for EMOJI_REGEX
         return /(?!)/;
     }
@@ -120,7 +120,7 @@ export function isUrlPermitted(inputUrl: string): boolean {
     try {
         // URL parser protocol includes the trailing colon
         return PERMITTED_URL_SCHEMES.includes(new URL(inputUrl).protocol.slice(0, -1));
-    } catch (e) {
+    } catch {
         return false;
     }
 }

src/LegacyCallHandler.tsx

@@ -827,7 +827,7 @@ export default class LegacyCallHandler extends EventEmitter {
 
         try {
             this.addCallForRoom(roomId, call);
-        } catch (e) {
+        } catch {
             Modal.createDialog(ErrorDialog, {
                 title: _t("voip|already_in_call"),
                 description: _t("voip|already_in_call_person"),

src/MatrixClientPeg.ts

@@ -211,7 +211,7 @@ class MatrixClientPegClass implements IMatrixClientPeg {
             const registrationTime = parseInt(window.localStorage.getItem("mx_registration_time")!, 10);
             const diff = Date.now() - registrationTime;
             return diff / 36e5 <= hours;
-        } catch (e) {
+        } catch {
             return false;
         }
     }
@@ -220,7 +220,7 @@ class MatrixClientPegClass implements IMatrixClientPeg {
         try {
             const registrationTime = parseInt(window.localStorage.getItem("mx_registration_time")!, 10);
             return timestamp.getTime() <= registrationTime;
-        } catch (e) {
+        } catch {
             return false;
         }
     }

src/PosthogAnalytics.ts

@@ -236,7 +236,7 @@ export class PosthogAnalytics {
         let appVersion: string | undefined;
         try {
             appVersion = await platform?.getAppVersion();
-        } catch (e) {
+        } catch {
             // this happens if no version is set i.e. in dev
             appVersion = "unknown";
         }

src/Presence.ts

@@ -36,7 +36,7 @@ class Presence {
             try {
                 await this.unavailableTimer.finished();
                 this.setState(SetPresence.Unavailable);
-            } catch (e) {
+            } catch {
                 /* aborted, stop got called */
             }
         }

src/RoomNotifs.ts

@@ -44,7 +44,7 @@ export function getRoomNotifsState(client: MatrixClient, roomId: string): RoomNo
     let roomRule: IPushRule | undefined;
     try {
         roomRule = client.getRoomPushRule("global", roomId);
-    } catch (err) {
+    } catch {
         // Possible that the client doesn't have pushRules yet. If so, it
         // hasn't started either, so indicate that this room is not notifying.
         return null;

src/ScalarMessaging.ts

@@ -855,14 +855,14 @@ const onMessage = function (event: MessageEvent<any>): void {
     try {
         if (!openManagerUrl) openManagerUrl = IntegrationManagers.sharedInstance().getPrimaryManager()?.uiUrl;
         configUrl = new URL(openManagerUrl!);
-    } catch (e) {
+    } catch {
         // No integrations UI URL, ignore silently.
         return;
     }
     let eventOriginUrl: URL;
     try {
         eventOriginUrl = new URL(event.origin);
-    } catch (e) {
+    } catch {
         return;
     }
     // TODO -- Scalar postMessage API should be namespaced with event.data.api field

src/SdkConfig.ts

@@ -42,6 +42,7 @@ export const DEFAULTS: DeepReadonly<IConfigOptions> = {
     // be preferred over their config.
     desktopBuilds: {
         available: true,
+        // eslint-disable-next-line @typescript-eslint/no-require-imports
         logo: require("../res/img/element-desktop-logo.svg").default,
         url: "https://element.io/get-started",
     },

src/SlidingSyncManager.ts

@@ -252,7 +252,7 @@ export class SlidingSyncManager {
         try {
             // wait until the next sync before returning as RoomView may need to know the current state
             await p;
-        } catch (err) {
+        } catch {
             logger.warn("SlidingSync setRoomVisible:", roomId, visible, "failed to confirm transaction");
         }
         return roomId;
@@ -305,7 +305,7 @@ export class SlidingSyncManager {
                 } else {
                     await this.slidingSync!.setListRanges(SlidingSyncManager.ListSearch, ranges);
                 }
-            } catch (err) {
+            } catch {
                 // do nothing, as we reject only when we get interrupted but that's fine as the next
                 // request will include our data
             } finally {
@@ -357,7 +357,7 @@ export class SlidingSyncManager {
             }
             const clientWellKnown = await AutoDiscovery.findClientConfig(clientDomain);
             proxyUrl = clientWellKnown?.["org.matrix.msc3575.proxy"]?.url;
-        } catch (e) {
+        } catch {
             // Either client.getDomain() is null so we've shorted out, or is invalid so `AutoDiscovery.findClientConfig` has thrown
         }
 

src/UserActivity.ts

@@ -213,7 +213,7 @@ export default class UserActivity {
         attachedTimers.forEach((t) => t.start());
         try {
             await timeout.finished();
-        } catch (_e) {
+        } catch {
             /* aborted */
         }
         attachedTimers.forEach((t) => t.abort());

src/components/structures/FileDropTarget.tsx

@@ -9,6 +9,7 @@ Please see LICENSE files in the repository root for full details.
 import React, { useEffect, useState } from "react";
 
 import { _t } from "../../languageHandler";
+import UploadBigSvg from "../../../res/img/upload-big.svg";
 
 interface IProps {
     parent: HTMLElement | null;
@@ -106,11 +107,7 @@ const FileDropTarget: React.FC<IProps> = ({ parent, onFileDrop }) => {
     if (state.dragging) {
         return (
             <div className="mx_FileDropTarget">
-                <img
-                    src={require("../../../res/img/upload-big.svg").default}
-                    className="mx_FileDropTarget_image"
-                    alt=""
-                />
+                <img src={UploadBigSvg} className="mx_FileDropTarget_image" alt="" />
                 {_t("room|drop_file_prompt")}
             </div>
         );

src/components/structures/LegacyCallEventGrouper.ts

@@ -161,9 +161,11 @@ export default class LegacyCallEventGrouper extends EventEmitter {
 
     public toggleSilenced = (): void => {
         const silenced = LegacyCallHandler.instance.isCallSilenced(this.callId);
-        silenced
-            ? LegacyCallHandler.instance.unSilenceCall(this.callId)
-            : LegacyCallHandler.instance.silenceCall(this.callId);
+        if (silenced) {
+            LegacyCallHandler.instance.unSilenceCall(this.callId);
+        } else {
+            LegacyCallHandler.instance.silenceCall(this.callId);
+        }
     };
 
     private setCallListeners(): void {

src/components/structures/MatrixChat.tsx

@@ -982,7 +982,7 @@ export default class MatrixChat extends React.PureComponent<IProps, IState> {
             try {
                 const config = await AutoDiscoveryUtils.validateServerConfigWithStaticUrls(params.hs_url);
                 newState.serverConfig = config;
-            } catch (err) {
+            } catch {
                 logger.warn("Failed to load hs_url param:", params.hs_url);
             }
         } else if (params.client_secret && params.session_id && params.hs_url && params.is_url && params.sid) {

src/components/structures/SpaceHierarchy.tsx

@@ -691,7 +691,7 @@ const ManageButtons: React.FC<IManageButtonsProps> = ({ hierarchy, selected, set
 
                             hierarchy.removeRelation(parentId, childId);
                         }
-                    } catch (e) {
+                    } catch {
                         setError(_t("space|failed_remove_rooms"));
                     }
                     setRemoving(false);
@@ -724,7 +724,7 @@ const ManageButtons: React.FC<IManageButtonsProps> = ({ hierarchy, selected, set
                             // mutate the local state to save us having to refetch the world
                             existingContent.suggested = content.suggested;
                         }
-                    } catch (e) {
+                    } catch {
                         setError("Failed to update some suggestions. Try again later");
                     }
                     setSaving(false);

src/components/structures/TimelinePanel.tsx

@@ -973,7 +973,7 @@ class TimelinePanel extends React.Component<IProps, IState> {
             UserActivity.sharedInstance().timeWhileActiveRecently(this.readMarkerActivityTimer);
             try {
                 await this.readMarkerActivityTimer.finished();
-            } catch (e) {
+            } catch {
                 continue; /* aborted */
             }
             // outside of try/catch to not swallow errors
@@ -988,7 +988,7 @@ class TimelinePanel extends React.Component<IProps, IState> {
             UserActivity.sharedInstance().timeWhileActiveNow(this.readReceiptActivityTimer);
             try {
                 await this.readReceiptActivityTimer.finished();
-            } catch (e) {
+            } catch {
                 continue; /* aborted */
             }
             // outside of try/catch to not swallow errors

src/components/structures/UserMenu.tsx

@@ -44,6 +44,7 @@ import { Icon as LiveIcon } from "../../../res/img/compound/live-8px.svg";
 import { VoiceBroadcastRecording, VoiceBroadcastRecordingsStoreEvent } from "../../voice-broadcast";
 import { SDKContext } from "../../contexts/SDKContext";
 import { shouldShowFeedback } from "../../utils/Feedback";
+import DarkLightModeSvg from "../../../res/img/element-icons/roomlist/dark-light-mode.svg";
 
 interface IProps {
     isPanelCollapsed: boolean;
@@ -414,12 +415,7 @@ export default class UserMenu extends React.Component<IProps, IState> {
                                 : _t("user_menu|switch_theme_dark")
                         }
                     >
-                        <img
-                            src={require("../../../res/img/element-icons/roomlist/dark-light-mode.svg").default}
-                            role="presentation"
-                            alt=""
-                            width={16}
-                        />
+                        <img src={DarkLightModeSvg} role="presentation" alt="" width={16} />
                     </RovingAccessibleButton>
                 </div>
                 {topSection}

src/components/structures/auth/ForgotPassword.tsx

@@ -274,7 +274,7 @@ export default class ForgotPassword extends React.Component<Props, State> {
                 await this.reset.setNewPassword(this.state.password);
                 this.setState({ phase: Phase.Done });
                 modal.close();
-            } catch (e) {
+            } catch {
                 // Email not confirmed, yet. Retry after a while.
                 await sleep(emailCheckInterval);
             }

src/components/structures/static-page-vars.ts

@@ -7,7 +7,7 @@ Please see LICENSE files in the repository root for full details.
 */
 
 // We're importing via require specifically so the svg becomes a URI rather than a DOM element.
-// eslint-disable-next-line @typescript-eslint/no-var-requires
+// eslint-disable-next-line @typescript-eslint/no-require-imports
 const matrixSvg = require("../../../res/img/matrix.svg").default;
 
 /**

src/components/views/avatars/WidgetAvatar.tsx

@@ -20,6 +20,7 @@ interface IProps extends Omit<ComponentProps<BaseAvatarType>, "name" | "url" | "
 }
 
 const WidgetAvatar: React.FC<IProps> = ({ app, className, size = "20px", ...props }) => {
+    /* eslint-disable @typescript-eslint/no-require-imports */
     let iconUrls = [require("../../../../res/img/element-icons/room/default_app.svg").default];
     // heuristics for some better icons until Widgets support their own icons
     if (app.type.includes("jitsi")) {
@@ -31,6 +32,7 @@ const WidgetAvatar: React.FC<IProps> = ({ app, className, size = "20px", ...prop
     } else if (app.type.includes("clock")) {
         iconUrls = [require("../../../../res/img/element-icons/room/default_clock.svg").default];
     }
+    /* eslint-enable @typescript-eslint/no-require-imports */
 
     return (
         <BaseAvatar

src/components/views/dialogs/AddExistingToSpaceDialog.tsx

@@ -34,6 +34,7 @@ import LazyRenderList from "../elements/LazyRenderList";
 import { useSettingValue } from "../../../hooks/useSettings";
 import { filterBoolean } from "../../../utils/arrays";
 import { NonEmptyArray } from "../../../@types/common";
+import WarningBadgeSvg from "../../../../res/img/element-icons/warning-badge.svg";
 
 // These values match CSS
 const ROW_HEIGHT = 32 + 12;
@@ -228,12 +229,7 @@ export const AddExistingToSpace: React.FC<IAddExistingToSpaceProps> = ({
     if (error) {
         footer = (
             <>
-                <img
-                    src={require("../../../../res/img/element-icons/warning-badge.svg").default}
-                    height="24"
-                    width="24"
-                    alt=""
-                />
+                <img src={WarningBadgeSvg} height="24" width="24" alt="" />
 
                 <span className="mx_AddExistingToSpaceDialog_error">
                     <div className="mx_AddExistingToSpaceDialog_errorHeading">