Improve quality of Typescript types (#10742)

src/components/views/auth/PasswordLogin.tsx

@@ -67,9 +67,9 @@ const enum LoginField {
  * The email/username/phone fields are fully-controlled, the password field is not.
  */
 export default class PasswordLogin extends React.PureComponent<IProps, IState> {
-    private [LoginField.Email]: Field | null;
-    private [LoginField.Phone]: Field | null;
-    private [LoginField.MatrixId]: Field | null;
+    private [LoginField.Email]: Field | null = null;
+    private [LoginField.Phone]: Field | null = null;
+    private [LoginField.MatrixId]: Field | null = null;
 
     public static defaultProps = {
         onUsernameChanged: function () {},

src/components/views/auth/RegistrationForm.tsx

@@ -95,11 +95,11 @@ interface IState {
  * A pure UI component which displays a registration form.
  */
 export default class RegistrationForm extends React.PureComponent<IProps, IState> {
-    private [RegistrationField.Email]: Field | null;
-    private [RegistrationField.Password]: Field | null;
-    private [RegistrationField.PasswordConfirm]: Field | null;
-    private [RegistrationField.Username]: Field | null;
-    private [RegistrationField.PhoneNumber]: Field | null;
+    private [RegistrationField.Email]: Field | null = null;
+    private [RegistrationField.Password]: Field | null = null;
+    private [RegistrationField.PasswordConfirm]: Field | null = null;
+    private [RegistrationField.Username]: Field | null = null;
+    private [RegistrationField.PhoneNumber]: Field | null = null;
 
     public static defaultProps = {
         onValidationChange: logger.error,

src/components/views/avatars/DecoratedRoomAvatar.tsx

@@ -78,7 +78,7 @@ function tooltipText(variant: Icon): string | undefined {
 }
 
 export default class DecoratedRoomAvatar extends React.PureComponent<IProps, IState> {
-    private _dmUser: User | null;
+    private _dmUser: User | null = null;
     private isUnmounted = false;
     private isWatchingTimeline = false;
 

src/components/views/rooms/Autocomplete.tsx

@@ -50,9 +50,9 @@ interface IState {
 }
 
 export default class Autocomplete extends React.PureComponent<IProps, IState> {
-    public autocompleter: Autocompleter;
-    public queryRequested: string;
-    public debounceCompletionsRequest: number;
+    public autocompleter?: Autocompleter;
+    public queryRequested?: string;
+    public debounceCompletionsRequest?: number;
     private containerRef = createRef<HTMLDivElement>();
 
     public static contextType = RoomContext;
@@ -86,7 +86,7 @@ export default class Autocomplete extends React.PureComponent<IProps, IState> {
 
     private applyNewProps(oldQuery?: string, oldRoom?: Room): void {
         if (oldRoom && this.props.room.roomId !== oldRoom.roomId) {
-            this.autocompleter.destroy();
+            this.autocompleter?.destroy();
             this.autocompleter = new Autocompleter(this.props.room);
         }
 
@@ -99,7 +99,7 @@ export default class Autocomplete extends React.PureComponent<IProps, IState> {
     }
 
     public componentWillUnmount(): void {
-        this.autocompleter.destroy();
+        this.autocompleter?.destroy();
     }
 
     private complete(query: string, selection: ISelectionRange): Promise<void> {

src/components/views/rooms/BasicMessageComposer.tsx

@@ -132,7 +132,7 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
 
     private _isCaretAtEnd: boolean;
     private lastCaret: DocumentOffset;
-    private lastSelection: ReturnType<typeof cloneSelection> | null;
+    private lastSelection: ReturnType<typeof cloneSelection> | null = null;
 
     private readonly useMarkdownHandle: string;
     private readonly emoticonSettingHandle: string;

src/components/views/rooms/Stickerpicker.tsx

@@ -64,9 +64,9 @@ export default class Stickerpicker extends React.PureComponent<IProps, IState> {
 
     public static currentWidget?: IWidgetEvent;
 
-    private dispatcherRef: string;
+    private dispatcherRef?: string;
 
-    private prevSentVisibility: boolean;
+    private prevSentVisibility?: boolean;
 
     private popoverWidth = 300;
     private popoverHeight = 300;

src/components/views/settings/ThemeChoicePanel.tsx

@@ -49,7 +49,7 @@ interface IState extends IThemeState {
 }
 
 export default class ThemeChoicePanel extends React.Component<IProps, IState> {
-    private themeTimer: number;
+    private themeTimer?: number;
 
     public constructor(props: IProps) {
         super(props);

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

@@ -87,7 +87,7 @@ interface IState {
 }
 
 export default class SecurityUserSettingsTab extends React.Component<IProps, IState> {
-    private dispatcherRef: string;
+    private dispatcherRef?: string;
 
     public constructor(props: IProps) {
         super(props);
@@ -124,7 +124,7 @@ export default class SecurityUserSettingsTab extends React.Component<IProps, ISt
     }
 
     public componentWillUnmount(): void {
-        dis.unregister(this.dispatcherRef);
+        if (this.dispatcherRef) dis.unregister(this.dispatcherRef);
         MatrixClientPeg.get().removeListener(RoomEvent.MyMembership, this.onMyMembership);
     }
 

src/components/views/toasts/VerificationRequestToast.tsx

@@ -47,7 +47,7 @@ interface IState {
 }
 
 export default class VerificationRequestToast extends React.PureComponent<IProps, IState> {
-    private intervalHandle: number;
+    private intervalHandle?: number;
 
     public constructor(props: IProps) {
         super(props);

src/components/views/voip/LegacyCallView.tsx

@@ -100,7 +100,7 @@ function exitFullscreen(): void {
 }
 
 export default class LegacyCallView extends React.Component<IProps, IState> {
-    private dispatcherRef: string;
+    private dispatcherRef?: string;
     private contentWrapperRef = createRef<HTMLDivElement>();
     private buttonsRef = createRef<LegacyCallViewButtons>();
 
@@ -137,7 +137,7 @@ export default class LegacyCallView extends React.Component<IProps, IState> {
 
         document.removeEventListener("keydown", this.onNativeKeyDown);
         this.updateCallListeners(this.props.call, null);
-        dis.unregister(this.dispatcherRef);
+        if (this.dispatcherRef) dis.unregister(this.dispatcherRef);
     }
 
     public static getDerivedStateFromProps(props: IProps): Partial<IState> {

src/components/views/voip/VideoFeed.tsx

@@ -52,7 +52,7 @@ interface IState {
 }
 
 export default class VideoFeed extends React.PureComponent<IProps, IState> {
-    private element: HTMLVideoElement;
+    private element?: HTMLVideoElement;
 
     public constructor(props: IProps) {
         super(props);