Conform more of the codebase to strictNullChecks (#10573)

* Conform more of the codebase to `strictNullChecks`

* Iterate

Author: t3chguy

src/ImageUtils.ts

@@ -28,9 +28,16 @@ limitations under the License.
  * consume in the timeline, when performing scroll offset calculations
  * (e.g. scroll locking)
  */
+export function thumbHeight(fullWidth: number, fullHeight: number, thumbWidth: number, thumbHeight: number): number;
 export function thumbHeight(
-    fullWidth: number,
-    fullHeight: number,
+    fullWidth: number | undefined,
+    fullHeight: number | undefined,
+    thumbWidth: number,
+    thumbHeight: number,
+): null;
+export function thumbHeight(
+    fullWidth: number | undefined,
+    fullHeight: number | undefined,
     thumbWidth: number,
     thumbHeight: number,
 ): number | null {

src/components/structures/AutoHideScrollbar.tsx

@@ -23,7 +23,7 @@ type DynamicHtmlElementProps<T extends keyof JSX.IntrinsicElements> =
 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"> & {
-    element?: T;
+    element: T;
     className?: string;
     onScroll?: (event: Event) => void;
     onWheel?: (event: WheelEvent) => void;

src/components/structures/IndicatorScrollbar.tsx

@@ -19,7 +19,8 @@ import React, { createRef } from "react";
 import AutoHideScrollbar, { IProps as AutoHideScrollbarProps } from "./AutoHideScrollbar";
 import UIStore, { UI_EVENTS } from "../../stores/UIStore";
 
-export type IProps<T extends keyof JSX.IntrinsicElements> = Omit<AutoHideScrollbarProps<T>, "onWheel"> & {
+export type IProps<T extends keyof JSX.IntrinsicElements> = Omit<AutoHideScrollbarProps<T>, "onWheel" | "element"> & {
+    element?: T;
     // If true, the scrollbar will append mx_IndicatorScrollbar_leftOverflowIndicator
     // and mx_IndicatorScrollbar_rightOverflowIndicator elements to the list for positioning
     // by the parent element.

src/components/structures/LeftPanel.tsx

@@ -90,11 +90,13 @@ export default class LeftPanel extends React.Component<IProps, IState> {
     }
 
     public componentDidMount(): void {
-        UIStore.instance.trackElementDimensions("ListContainer", this.listContainerRef.current);
+        if (this.listContainerRef.current) {
+            UIStore.instance.trackElementDimensions("ListContainer", this.listContainerRef.current);
+            // Using the passive option to not block the main thread
+            // https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#improving_scrolling_performance_with_passive_listeners
+            this.listContainerRef.current.addEventListener("scroll", this.onScroll, { passive: true });
+        }
         UIStore.instance.on("ListContainer", this.refreshStickyHeaders);
-        // Using the passive option to not block the main thread
-        // https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#improving_scrolling_performance_with_passive_listeners
-        this.listContainerRef.current?.addEventListener("scroll", this.onScroll, { passive: true });
     }
 
     public componentWillUnmount(): void {

src/components/structures/LegacyCallEventGrouper.ts

@@ -177,9 +177,9 @@ export default class LegacyCallEventGrouper extends EventEmitter {
     }
 
     private setState = (): void => {
-        if (CONNECTING_STATES.includes(this.call?.state)) {
+        if (this.call && CONNECTING_STATES.includes(this.call.state)) {
             this.state = CallState.Connecting;
-        } else if (SUPPORTED_STATES.includes(this.call?.state)) {
+        } else if (this.call && SUPPORTED_STATES.includes(this.call.state)) {
             this.state = this.call.state;
         } else {
             if (this.callWasMissed) this.state = CustomCallState.Missed;

src/components/structures/MatrixChat.tsx

@@ -471,11 +471,9 @@ export default class MatrixChat extends React.PureComponent<IProps, IState> {
         );
     }, 1000);
 
-    private getFallbackHsUrl(): string | null {
+    private getFallbackHsUrl(): string | undefined {
         if (this.props.serverConfig?.isDefault) {
-            return this.props.config.fallback_hs_url ?? null;
-        } else {
-            return null;
+            return this.props.config.fallback_hs_url;
         }
     }
 
@@ -577,7 +575,7 @@ export default class MatrixChat extends React.PureComponent<IProps, IState> {
                 if (payload.event_type === "m.identity_server") {
                     const fullUrl = payload.event_content ? payload.event_content["base_url"] : null;
                     if (!fullUrl) {
-                        MatrixClientPeg.get().setIdentityServerUrl(null);
+                        MatrixClientPeg.get().setIdentityServerUrl(undefined);
                         localStorage.removeItem("mx_is_access_token");
                         localStorage.removeItem("mx_is_url");
                     } else {
@@ -1229,6 +1227,10 @@ export default class MatrixChat extends React.PureComponent<IProps, IState> {
      * @returns {string} The room ID of the new room, or null if no room was created
      */
     private async startWelcomeUserChat(): Promise<string | null> {
+        const snakedConfig = new SnakedObject<IConfigOptions>(this.props.config);
+        const welcomeUserId = snakedConfig.get("welcome_user_id");
+        if (!welcomeUserId) return null;
+
         // We can end up with multiple tabs post-registration where the user
         // might then end up with a session and we don't want them all making
         // a chat with the welcome user: try to de-dupe.
@@ -1242,8 +1244,7 @@ export default class MatrixChat extends React.PureComponent<IProps, IState> {
         }
         await waitFor;
 
-        const snakedConfig = new SnakedObject<IConfigOptions>(this.props.config);
-        const welcomeUserRooms = DMRoomMap.shared().getDMRoomsForUserId(snakedConfig.get("welcome_user_id"));
+        const welcomeUserRooms = DMRoomMap.shared().getDMRoomsForUserId(welcomeUserId);
         if (welcomeUserRooms.length === 0) {
             const roomId = await createRoom({
                 dmUserId: snakedConfig.get("welcome_user_id"),
@@ -1260,7 +1261,7 @@ export default class MatrixChat extends React.PureComponent<IProps, IState> {
             // user room (it doesn't wait for new data from the server, just
             // the saved sync to be loaded).
             const saveWelcomeUser = (ev: MatrixEvent): void => {
-                if (ev.getType() === EventType.Direct && ev.getContent()[snakedConfig.get("welcome_user_id")]) {
+                if (ev.getType() === EventType.Direct && ev.getContent()[welcomeUserId]) {
                     MatrixClientPeg.get().store.save(true);
                     MatrixClientPeg.get().removeListener(ClientEvent.AccountData, saveWelcomeUser);
                 }

src/components/structures/MessagePanel.tsx

@@ -869,7 +869,7 @@ export default class MessagePanel extends React.Component<IProps, IState> {
         const receiptsByEvent: Map<string, IReadReceiptProps[]> = new Map();
         const receiptsByUserId: Map<string, IReadReceiptForUser> = new Map();
 
-        let lastShownEventId: string;
+        let lastShownEventId: string | undefined;
         for (const event of this.props.events) {
             if (this.shouldShowEvent(event)) {
                 lastShownEventId = event.getId();
@@ -1018,11 +1018,7 @@ export default class MessagePanel extends React.Component<IProps, IState> {
         let ircResizer: JSX.Element | undefined;
         if (this.props.layout == Layout.IRC) {
             ircResizer = (
-                <IRCTimelineProfileResizer
-                    minWidth={20}
-                    maxWidth={600}
-                    roomId={this.props.room ? this.props.room.roomId : null}
-                />
+                <IRCTimelineProfileResizer minWidth={20} maxWidth={600} roomId={this.props.room?.roomId ?? null} />
             );
         }
 
@@ -1206,7 +1202,7 @@ class CreationGrouper extends BaseGrouper {
         let summaryText: string;
         const roomId = ev.getRoomId();
         const creator = ev.sender?.name ?? ev.getSender();
-        if (DMRoomMap.shared().getUserIdForRoomId(roomId)) {
+        if (roomId && DMRoomMap.shared().getUserIdForRoomId(roomId)) {
             summaryText = _t("%(creator)s created this DM.", { creator });
         } else {
             summaryText = _t("%(creator)s created and configured the room.", { creator });

src/components/structures/RightPanel.tsx

@@ -141,7 +141,7 @@ export default class RightPanel extends React.Component<IProps, IState> {
             // When the user clicks close on the encryption panel cancel the pending request first if any
             this.state.cardState.verificationRequest.cancel();
         } else {
-            RightPanelStore.instance.togglePanel(this.props.room?.roomId);
+            RightPanelStore.instance.togglePanel(this.props.room?.roomId ?? null);
         }
     };
 

src/components/structures/RoomView.tsx

@@ -1597,6 +1597,7 @@ export class RoomView extends React.Component<IRoomProps, IRoomState> {
     };
 
     private injectSticker(url: string, info: object, text: string, threadId: string | null): void {
+        if (!this.context.client) return;
         if (this.context.client.isGuest()) {
             dis.dispatch({ action: "require_registration" });
             return;

src/components/structures/ScrollPanel.tsx

@@ -189,7 +189,7 @@ export default class ScrollPanel extends React.Component<IProps> {
     // Is that next fill request scheduled because of a props update?
     private pendingFillDueToPropsUpdate: boolean;
     private scrollState: IScrollState;
-    private preventShrinkingState: IPreventShrinkingState;
+    private preventShrinkingState: IPreventShrinkingState | null;
     private unfillDebouncer: number | null;
     private bottomGrowth: number;
     private minListHeight: number;
@@ -676,7 +676,7 @@ export default class ScrollPanel extends React.Component<IProps> {
             debuglog("unable to save scroll state: found no children in the viewport");
             return;
         }
-        const scrollToken = node!.dataset.scrollTokens.split(",")[0];
+        const scrollToken = node!.dataset.scrollTokens?.split(",")[0];
         debuglog("saving anchored scroll state to message", scrollToken);
         const bottomOffset = this.topFromBottom(node);
         this.scrollState = {