Migrate to stylistic

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

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">

src/components/views/dialogs/ForwardDialog.tsx

@@ -23,6 +23,8 @@ import {
     TimelineEvents,
 } from "matrix-js-sdk/src/matrix";
 import { KnownMembership } from "matrix-js-sdk/src/types";
+// eslint-disable-next-line no-restricted-imports
+import OverflowHorizontalSvg from "@vector-im/compound-design-tokens/icons/overflow-horizontal.svg";
 
 import { _t } from "../../../languageHandler";
 import dis from "../../../dispatcher/dispatcher";
@@ -104,7 +106,7 @@ const Entry: React.FC<IEntryProps<any>> = ({ room, type, content, matrixClient:
         try {
             await cli.sendEvent(room.roomId, type, content);
             setSendState(SendState.Sent);
-        } catch (e) {
+        } catch {
             setSendState(SendState.Failed);
         }
     };
@@ -278,13 +280,7 @@ const ForwardDialog: React.FC<IProps> = ({ matrixClient: cli, event, permalinkCr
         return (
             <EntityTile
                 className="mx_EntityTile_ellipsis"
-                avatarJsx={
-                    <BaseAvatar
-                        url={require("@vector-im/compound-design-tokens/icons/overflow-horizontal.svg").default}
-                        name="..."
-                        size="36px"
-                    />
-                }
+                avatarJsx={<BaseAvatar url={OverflowHorizontalSvg} name="..." size="36px" />}
                 name={text}
                 showPresence={false}
                 onClick={() => setTruncateAt(totalCount)}

src/components/views/dialogs/ModalWidgetDialog.tsx

@@ -33,6 +33,7 @@ import { arrayFastClone } from "../../../utils/arrays";
 import { ElementWidget } from "../../../stores/widgets/StopGapWidget";
 import { ELEMENT_CLIENT_ID } from "../../../identifiers";
 import SettingsStore from "../../../settings/SettingsStore";
+import WarningBadgeSvg from "../../../../res/img/element-icons/warning-badge.svg";
 
 interface IProps {
     widgetDefinition: IModalWidgetOpenRequestData;
@@ -185,12 +186,7 @@ export default class ModalWidgetDialog extends React.PureComponent<IProps, IStat
                 onFinished={this.props.onFinished}
             >
                 <div className="mx_ModalWidgetDialog_warning">
-                    <img
-                        src={require("../../../../res/img/element-icons/warning-badge.svg").default}
-                        height="16"
-                        width="16"
-                        alt=""
-                    />
+                    <img src={WarningBadgeSvg} height="16" width="16" alt="" />
                     {_t("widget|modal_data_warning", {
                         widgetDomain: parsed.hostname,
                     })}

src/components/views/dialogs/ShareDialog.tsx

@@ -21,11 +21,12 @@ import BaseDialog from "./BaseDialog";
 import CopyableText from "../elements/CopyableText";
 import { XOR } from "../../../@types/common";
 
+/* eslint-disable @typescript-eslint/no-require-imports */
 const socials = [
     {
         name: "Facebook",
         img: require("../../../../res/img/social/facebook.png"),
-        url: (url: String) => `https://www.facebook.com/sharer/sharer.php?u=${url}`,
+        url: (url: string) => `https://www.facebook.com/sharer/sharer.php?u=${url}`,
     },
     {
         name: "Twitter",
@@ -52,6 +53,7 @@ const socials = [
         url: (url: string) => `mailto:?body=${url}`,
     },
 ];
+/* eslint-enable @typescript-eslint/no-require-imports */
 
 interface BaseProps {
     /**

src/components/views/dialogs/security/AccessSecretStorageDialog.tsx

@@ -107,7 +107,7 @@ export default class AccessSecretStorageDialog extends React.PureComponent<IProp
                 recoveryKeyValid: true,
                 recoveryKeyCorrect: correct,
             });
-        } catch (e) {
+        } catch {
             this.setState({
                 recoveryKeyValid: false,
                 recoveryKeyCorrect: false,

src/components/views/dialogs/security/RestoreKeyBackupDialog.tsx

@@ -127,7 +127,7 @@ export default class RestoreKeyBackupDialog extends React.PureComponent<IProps,
         try {
             decodeRecoveryKey(recoveryKey);
             return true;
-        } catch (e) {
+        } catch {
             return false;
         }
     }

src/components/views/dialogs/security/SetupEncryptionDialog.tsx

@@ -15,8 +15,10 @@ import { SetupEncryptionStore, Phase } from "../../../../stores/SetupEncryptionS
 
 function iconFromPhase(phase?: Phase): string {
     if (phase === Phase.Done) {
+        // eslint-disable-next-line @typescript-eslint/no-require-imports
         return require("../../../../../res/img/e2e/verified-deprecated.svg").default;
     } else {
+        // eslint-disable-next-line @typescript-eslint/no-require-imports
         return require("../../../../../res/img/e2e/warning-deprecated.svg").default;
     }
 }

src/components/views/elements/AppWarning.tsx

@@ -8,6 +8,8 @@ Please see LICENSE files in the repository root for full details.
 
 import React from "react";
 
+import WarningSvg from "../../../../res/img/warning.svg";
+
 interface IProps {
     errorMsg?: string;
 }
@@ -16,7 +18,7 @@ const AppWarning: React.FC<IProps> = (props) => {
     return (
         <div className="mx_AppWarning">
             <div>
-                <img src={require("../../../../res/img/warning.svg").default} alt="" />
+                <img src={WarningSvg} alt="" />
             </div>
             <div>
                 <span>{props.errorMsg || "Error"}</span>

src/components/views/elements/ReplyChain.tsx

@@ -140,7 +140,7 @@ export default class ReplyChain extends React.Component<IProps, IState> {
             const inReplyToEventId = getParentEventId(ev);
             if (!inReplyToEventId) return null;
             return await this.getEvent(inReplyToEventId);
-        } catch (e) {
+        } catch {
             return null;
         }
     }
@@ -154,7 +154,7 @@ export default class ReplyChain extends React.Component<IProps, IState> {
             // ask the client to fetch the event we want using the context API, only interface to do so is to ask
             // for a timeline with that event, but once it is loaded we can use findEventById to look up the ev map
             await this.matrixClient.getEventTimeline(this.room.getUnfilteredTimelineSet(), eventId);
-        } catch (e) {
+        } catch {
             // if it fails catch the error and return early, there's no point trying to find the event in this case.
             // Return null as it is falsy and thus should be treated as an error (as the event cannot be resolved).
             return null;

src/components/views/elements/SSOButtons.tsx

@@ -33,6 +33,7 @@ interface ISSOButtonProps extends IProps {
 
 const getIcon = (brand: IdentityProviderBrand | string): string | null => {
     switch (brand) {
+        /* eslint-disable @typescript-eslint/no-require-imports */
         case IdentityProviderBrand.Apple:
             return require(`../../../../res/img/element-icons/brands/apple.svg`).default;
         case IdentityProviderBrand.Facebook:
@@ -47,6 +48,7 @@ const getIcon = (brand: IdentityProviderBrand | string): string | null => {
             return require(`../../../../res/img/element-icons/brands/twitter.svg`).default;
         default:
             return null;
+        /* eslint-enable @typescript-eslint/no-require-imports */
     }
 };
 

src/components/views/location/Map.tsx

@@ -66,8 +66,8 @@ const useMapWithStyle = ({
                     throw new Error("Invalid geo URI");
                 }
                 map.setCenter({ lon: coords.longitude, lat: coords.latitude });
-            } catch (_error) {
-                logger.error("Could not set map center");
+            } catch (e) {
+                logger.error("Could not set map center", e);
             }
         }
     }, [map, centerGeoUri]);
@@ -80,8 +80,8 @@ const useMapWithStyle = ({
                     [bounds.east, bounds.north],
                 );
                 map.fitBounds(lngLatBounds, { padding: 100, maxZoom: 15 });
-            } catch (_error) {
-                logger.error("Invalid map bounds");
+            } catch (e) {
+                logger.error("Invalid map bounds", e);
             }
         }
     }, [map, bounds]);
@@ -170,7 +170,7 @@ const MapComponent: React.FC<MapProps> = ({
             return;
         }
 
-        onClick && onClick();
+        onClick?.();
     };
 
     return (

src/components/views/messages/LegacyCallEvent.tsx

@@ -55,7 +55,7 @@ export default class LegacyCallEvent extends React.PureComponent<IProps, IState>
         this.props.callEventGrouper.addListener(LegacyCallEventGrouperEvent.LengthChanged, this.onLengthChanged);
 
         this.resizeObserver = new ResizeObserver(this.resizeObserverCallback);
-        this.wrapperElement.current && this.resizeObserver.observe(this.wrapperElement.current);
+        if (this.wrapperElement.current) this.resizeObserver.observe(this.wrapperElement.current);
     }
 
     public componentWillUnmount(): void {

src/components/views/messages/MFileBody.tsx

@@ -27,7 +27,7 @@ export let DOWNLOAD_ICON_URL: string; // cached copy of the download.svg asset f
 
 async function cacheDownloadIcon(): Promise<void> {
     if (DOWNLOAD_ICON_URL) return; // cached already
-    // eslint-disable-next-line @typescript-eslint/no-var-requires
+    // eslint-disable-next-line @typescript-eslint/no-require-imports
     const svg = await fetch(require("@vector-im/compound-design-tokens/icons/download.svg").default).then((r) =>
         r.text(),
     );

src/components/views/messages/MStickerBody.tsx

@@ -11,6 +11,7 @@ import { MediaEventContent } from "matrix-js-sdk/src/types";
 
 import MImageBody from "./MImageBody";
 import { BLURHASH_FIELD } from "../../../utils/image-media";
+import IconsShowStickersSvg from "../../../../res/img/icons-show-stickers.svg";
 
 export default class MStickerBody extends MImageBody {
     // Mostly empty to prevent default behaviour of MImageBody
@@ -44,7 +45,7 @@ export default class MStickerBody extends MImageBody {
                 aria-hidden
                 alt=""
                 className="mx_MStickerBody_placeholder"
-                src={require("../../../../res/img/icons-show-stickers.svg").default}
+                src={IconsShowStickersSvg}
                 width="80"
                 height="80"
                 onMouseEnter={this.onImageEnter}

src/components/views/right_panel/EncryptionPanel.tsx

@@ -21,6 +21,8 @@ import { RightPanelPhases } from "../../../stores/right-panel/RightPanelStorePha
 import RightPanelStore from "../../../stores/right-panel/RightPanelStore";
 import ErrorDialog from "../dialogs/ErrorDialog";
 import { useMatrixClientContext } from "../../../contexts/MatrixClientContext";
+import WarningDeprecatedSvg from "../../../../res/img/e2e/warning-deprecated.svg";
+import WarningSvg from "../../../../res/img/e2e/warning.svg";
 
 // cancellation codes which constitute a key mismatch
 const MISMATCHES = ["m.key_mismatch", "m.user_error", "m.mismatched_sas"];
@@ -79,7 +81,7 @@ const EncryptionPanel: React.FC<IProps> = (props: IProps) => {
         ) {
             isShowingMismatchModal.current = true;
             Modal.createDialog(ErrorDialog, {
-                headerImage: require("../../../../res/img/e2e/warning-deprecated.svg").default,
+                headerImage: WarningDeprecatedSvg,
                 title: _t("encryption|messages_not_secure|title"),
                 description: (
                     <div>
@@ -118,7 +120,7 @@ const EncryptionPanel: React.FC<IProps> = (props: IProps) => {
             setRequesting(false);
 
             Modal.createDialog(ErrorDialog, {
-                headerImage: require("../../../../res/img/e2e/warning.svg").default,
+                headerImage: WarningSvg,
                 title: _t("encryption|verification|error_starting_title"),
                 description: _t("encryption|verification|error_starting_description"),
             });

src/components/views/right_panel/UserInfo.tsx

@@ -1356,7 +1356,7 @@ export const useDevices = (userId: string): IDevice[] | undefined | null => {
 
                 disambiguateDevices(devices);
                 setDevices(devices);
-            } catch (err) {
+            } catch {
                 setDevices(null);
             }
         }

src/components/views/rooms/MemberList.tsx

@@ -27,6 +27,8 @@ import { KnownMembership } from "matrix-js-sdk/src/types";
 import { throttle } from "lodash";
 import { Button, Tooltip } from "@vector-im/compound-web";
 import UserAddIcon from "@vector-im/compound-design-tokens/assets/web/icons/user-add-solid";
+// eslint-disable-next-line no-restricted-imports
+import OverflowHorizontalSvg from "@vector-im/compound-design-tokens/icons/overflow-horizontal.svg";
 
 import { _t } from "../../../languageHandler";
 import dis from "../../../dispatcher/dispatcher";
@@ -237,13 +239,7 @@ export default class MemberList extends React.Component<IProps, IState> {
         return (
             <EntityTile
                 className="mx_EntityTile_ellipsis"
-                avatarJsx={
-                    <BaseAvatar
-                        url={require("@vector-im/compound-design-tokens/icons/overflow-horizontal.svg").default}
-                        name="..."
-                        size="36px"
-                    />
-                }
+                avatarJsx={<BaseAvatar url={OverflowHorizontalSvg} name="..." size="36px" />}
                 name={text}
                 showPresence={false}
                 onClick={onClick}

src/components/views/rooms/MessageComposer.tsx

@@ -57,6 +57,7 @@ import { VoiceBroadcastInfoState } from "../../../voice-broadcast";
 import { createCantStartVoiceMessageBroadcastDialog } from "../dialogs/CantStartVoiceMessageBroadcastDialog";
 import { UIFeature } from "../../../settings/UIFeature";
 import { formatTimeLeft } from "../../../DateUtils";
+import RoomReplacedSvg from "../../../../res/img/room_replaced.svg";
 
 // The prefix used when persisting editor drafts to localstorage.
 export const WYSIWYG_EDITOR_STATE_STORAGE_PREFIX = "mx_wysiwyg_state_";
@@ -619,7 +620,7 @@ export class MessageComposer extends React.Component<IProps, IState> {
                             aria-hidden
                             alt=""
                             className="mx_MessageComposer_roomReplaced_icon"
-                            src={require("../../../../res/img/room_replaced.svg").default}
+                            src={RoomReplacedSvg}
                         />
                         <span className="mx_MessageComposer_roomReplaced_header">
                             {_t("composer|room_upgraded_notice")}

src/components/views/rooms/RoomInfoLine.tsx

@@ -29,7 +29,7 @@ const RoomInfoLine: FC<IProps> = ({ room }) => {
         if (room.getMyMembership() !== KnownMembership.Invite) return null;
         try {
             return await room.client.getRoomSummary(room.roomId);
-        } catch (e) {
+        } catch {
             return null;
         }
     }, [room]);

src/components/views/rooms/Stickerpicker.tsx

@@ -26,6 +26,7 @@ import ScalarAuthClient from "../../../ScalarAuthClient";
 import GenericElementContextMenu from "../context_menus/GenericElementContextMenu";
 import RightPanelStore from "../../../stores/right-panel/RightPanelStore";
 import { UPDATE_EVENT } from "../../../stores/AsyncStore";
+import StickerpackPlaceholderSvg from "../../../../res/img/stickerpack-placeholder.png";
 
 // This should be below the dialog level (4000), but above the rest of the UI (1000-2000).
 // We sit in a context menu, so this should be given to the context menu.
@@ -206,7 +207,7 @@ export default class Stickerpicker extends React.PureComponent<IProps, IState> {
             <AccessibleButton onClick={this.launchManageIntegrations} className="mx_Stickers_contentPlaceholder">
                 <p>{_t("stickers|empty")}</p>
                 <p className="mx_Stickers_addLink">{_t("stickers|empty_add_prompt")}</p>
-                <img src={require("../../../../res/img/stickerpack-placeholder.png")} alt="" />
+                <img src={StickerpackPlaceholderSvg} alt="" />
             </AccessibleButton>
         );
     }

src/components/views/settings/AddPrivilegedUsers.tsx

@@ -57,7 +57,7 @@ export const AddPrivilegedUsers: React.FC<AddPrivilegedUsersProps> = ({ room, de
             await client.setPowerLevel(room.roomId, userIds, powerLevel);
             setSelectedUsers([]);
             setPowerLevel(defaultUserLevel);
-        } catch (error) {
+        } catch {
             Modal.createDialog(ErrorDialog, {
                 title: _t("common|error"),
                 description: _t("error|update_power_level"),

src/components/views/settings/SetIdServer.tsx

@@ -52,7 +52,7 @@ async function checkIdentityServerUrl(u: string): Promise<string | null> {
         } else {
             return _t("identity_server|error_connection");
         }
-    } catch (e) {
+    } catch {
         return _t("identity_server|error_connection");
     }
 }

src/components/views/settings/UserPersonalInfoSettings.tsx

@@ -61,7 +61,7 @@ export const UserPersonalInfoSettings: React.FC<UserPersonalInfoSettingsProps> =
             setEmails(threepids.threepids.filter((a) => a.medium === ThreepidMedium.Email));
             setPhoneNumbers(threepids.threepids.filter((a) => a.medium === ThreepidMedium.Phone));
             setLoadingState("loaded");
-        } catch (e) {
+        } catch {
             setLoadingState("error");
         }
     }, [client]);

src/components/views/settings/UserProfileSettings.tsx

@@ -156,7 +156,7 @@ const UserProfileSettings: React.FC<UserProfileSettingsProps> = ({
                 const { content_uri: uri } = await client.uploadContent(avatarFile);
                 await client.setAvatarUrl(uri);
                 setAvatarURL(uri);
-            } catch (e) {
+            } catch {
                 setAvatarError(true);
             } finally {
                 removeToast();

src/components/views/settings/devices/DeviceDetailHeading.tsx

@@ -40,7 +40,7 @@ const DeviceNameEditor: React.FC<Props & { stopEditing: () => void }> = ({ devic
         try {
             await saveDeviceName(deviceName);
             stopEditing();
-        } catch (error) {
+        } catch {
             setError(_t("settings|sessions|error_set_name"));
             setIsLoading(false);
         }

src/components/views/settings/discovery/DiscoverySettings.tsx

@@ -126,7 +126,7 @@ export const DiscoverySettings: React.FC = () => {
                     );
                     logger.warn(e);
                 }
-            } catch (e) {}
+            } catch {}
         })();
     }, [client, getThreepidState]);
 

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

@@ -101,7 +101,7 @@ export default class VoiceUserSettingsTab extends React.Component<{}, IState> {
         this.setState<any>({ [kind]: deviceId });
         try {
             await MediaDeviceHandler.instance.setDevice(deviceId, kind);
-        } catch (error) {
+        } catch {
             logger.error(`Failed to set device ${kind}: ${deviceId}`);
             // reset state to current value
             this.setState<any>({ [kind]: mapDeviceKindToHandlerValue(kind) });

src/components/views/spaces/QuickThemeSwitcher.tsx

@@ -63,7 +63,7 @@ const QuickThemeSwitcher: React.FC<Props> = ({ requestClose }) => {
                     SettingsStore.setValue("use_system_theme", null, SettingLevel.DEVICE, false),
                 ]);
             }
-        } catch (_error) {
+        } catch {
             dis.dispatch<RecheckThemePayload>({ action: Action.RecheckTheme });
         }
 

src/components/views/spaces/SpaceTreeLevel.tsx

@@ -176,7 +176,7 @@ interface IItemProps extends InputHTMLAttributes<HTMLLIElement> {
     activeSpaces: SpaceKey[];
     isNested?: boolean;
     isPanelCollapsed?: boolean;
-    onExpand?: Function;
+    onExpand?: () => void;
     parents?: Set<string>;
     innerRef?: LegacyRef<HTMLLIElement>;
     dragHandleProps?: DraggableProvidedDragHandleProps | null;

src/components/views/user-onboarding/UserOnboardingHeader.tsx

@@ -34,6 +34,7 @@ export function UserOnboardingHeader({ useCase }: Props): JSX.Element {
     let actionLabel: string;
 
     switch (useCase) {
+        /* eslint-disable @typescript-eslint/no-require-imports */
         case UseCase.PersonalMessaging:
             title = _t("onboarding|personal_messaging_title");
             image = require("../../../../res/img/user-onboarding/PersonalMessaging.png");
@@ -60,6 +61,7 @@ export function UserOnboardingHeader({ useCase }: Props): JSX.Element {
             image = require("../../../../res/img/user-onboarding/PersonalMessaging.png");
             actionLabel = _t("onboarding|personal_messaging_action");
             break;
+        /* eslint-enable @typescript-eslint/no-require-imports */
     }
 
     return (