Enable noImplicitOverride TypeScript compiler option

ts/components/ContactListItem.tsx

@@ -69,7 +69,7 @@ export class ContactListItem extends React.Component<Props> {
     );
   }
 
-  public render(): JSX.Element {
+  public override render(): JSX.Element {
     const { about, i18n, isAdmin, isMe, name, onClick, title, type } =
       this.props;
 

ts/components/Countdown.tsx

@@ -26,15 +26,15 @@ export class Countdown extends React.Component<Props, State> {
     this.state = { ratio };
   }
 
-  public componentDidMount(): void {
+  public override componentDidMount(): void {
     this.startLoop();
   }
 
-  public componentDidUpdate(): void {
+  public override componentDidUpdate(): void {
     this.startLoop();
   }
 
-  public componentWillUnmount(): void {
+  public override componentWillUnmount(): void {
     this.stopLoop();
   }
 
@@ -70,7 +70,7 @@ export class Countdown extends React.Component<Props, State> {
     }
   };
 
-  public render(): JSX.Element {
+  public override render(): JSX.Element {
     const { ratio } = this.state;
     const strokeDashoffset = ratio * CIRCUMFERENCE;
 

ts/components/Intl.tsx

@@ -67,7 +67,7 @@ export class Intl extends React.Component<Props> {
   }
 
   // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
-  public render() {
+  public override render() {
     const { components, id, i18n, renderText } = this.props;
 
     const text = i18n(id);

ts/components/MainHeader.tsx

@@ -65,7 +65,7 @@ export class MainHeader extends React.Component<PropsType, StateType> {
     };
   }
 
-  public componentDidUpdate(prevProps: PropsType): void {
+  public override componentDidUpdate(prevProps: PropsType): void {
     const { searchConversation, startSearchCounter } = this.props;
 
     // When user chooses to search in a given conversation we focus the field for them
@@ -119,11 +119,11 @@ export class MainHeader extends React.Component<PropsType, StateType> {
     }
   };
 
-  public componentDidMount(): void {
+  public override componentDidMount(): void {
     document.addEventListener('keydown', this.handleGlobalKeyDown);
   }
 
-  public componentWillUnmount(): void {
+  public override componentWillUnmount(): void {
     const { popperRoot } = this.state;
 
     document.removeEventListener('click', this.handleOutsideClick);
@@ -191,7 +191,7 @@ export class MainHeader extends React.Component<PropsType, StateType> {
     }
   };
 
-  public render(): JSX.Element {
+  public override render(): JSX.Element {
     const {
       avatarPath,
       badge,

ts/components/conversation/AddNewLines.tsx

@@ -1,4 +1,4 @@
-// Copyright 2018-2020 Signal Messenger, LLC
+// Copyright 2018-2021 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
 
 import React from 'react';
@@ -16,7 +16,7 @@ export class AddNewLines extends React.Component<Props> {
     renderNonNewLine: ({ text }) => text,
   };
 
-  public render():
+  public override render():
     | JSX.Element
     | string
     | null

ts/components/conversation/ContactDetail.tsx

@@ -214,7 +214,7 @@ export class ContactDetail extends React.Component<Props> {
     });
   }
 
-  public render(): JSX.Element {
+  public override render(): JSX.Element {
     const { contact, hasSignalAccount, i18n, onSendMessage } = this.props;
     const isIncoming = false;
     const module = 'contact-detail';

ts/components/conversation/ConversationHeader.tsx

@@ -587,7 +587,7 @@ export class ConversationHeader extends React.Component<PropsType, StateType> {
     );
   }
 
-  public render(): ReactNode {
+  public override render(): ReactNode {
     const { id, isSMSOnly, i18n, onSetDisappearingMessages, expireTimer } =
       this.props;
     const { isNarrow, modalState } = this.state;

ts/components/conversation/Emojify.tsx

@@ -1,4 +1,4 @@
-// Copyright 2018-2020 Signal Messenger, LLC
+// Copyright 2018-2021 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
 
 import React from 'react';
@@ -54,7 +54,7 @@ export class Emojify extends React.Component<Props> {
     renderNonEmoji: ({ text }) => text,
   };
 
-  public render(): null | Array<JSX.Element | string | null> {
+  public override render(): null | Array<JSX.Element | string | null> {
     const { text, sizeClass, renderNonEmoji } = this.props;
 
     // We have to do this, because renderNonEmoji is not required in our Props object,

ts/components/conversation/ErrorBoundary.tsx

@@ -36,7 +36,7 @@ export class ErrorBoundary extends React.PureComponent<Props, State> {
     return { error };
   }
 
-  public render(): ReactNode {
+  public override render(): ReactNode {
     const { error } = this.state;
     const { i18n, children } = this.props;
 

ts/components/conversation/ExpireTimer.tsx

@@ -1,4 +1,4 @@
-// Copyright 2018-2020 Signal Messenger, LLC
+// Copyright 2018-2021 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
 
 import React from 'react';
@@ -24,7 +24,7 @@ export class ExpireTimer extends React.Component<Props> {
     this.interval = null;
   }
 
-  public componentDidMount(): void {
+  public override componentDidMount(): void {
     const { expirationLength } = this.props;
     const increment = getIncrement(expirationLength);
     const updateFrequency = Math.max(increment, 500);
@@ -39,13 +39,13 @@ export class ExpireTimer extends React.Component<Props> {
     this.interval = setInterval(update, updateFrequency);
   }
 
-  public componentWillUnmount(): void {
+  public override componentWillUnmount(): void {
     if (this.interval) {
       clearInterval(this.interval);
     }
   }
 
-  public render(): JSX.Element {
+  public override render(): JSX.Element {
     const {
       direction,
       expirationLength,

ts/components/conversation/GroupNotification.tsx

@@ -120,7 +120,7 @@ export class GroupNotification extends React.Component<Props> {
     }
   }
 
-  public render(): JSX.Element {
+  public override render(): JSX.Element {
     const { changes: rawChanges, i18n, from } = this.props;
 
     // This check is just to be extra careful, and can probably be removed.

ts/components/conversation/Image.tsx

@@ -132,7 +132,7 @@ export class Image extends React.Component<Props> {
     );
   };
 
-  public render(): JSX.Element {
+  public override render(): JSX.Element {
     const {
       alt,
       attachment,

ts/components/conversation/InlineNotificationWrapper.tsx

@@ -1,4 +1,4 @@
-// Copyright 2019-2020 Signal Messenger, LLC
+// Copyright 2019-2021 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
 
 import React from 'react';
@@ -37,14 +37,14 @@ export class InlineNotificationWrapper extends React.Component<PropsType> {
     }
   };
 
-  public componentDidMount(): void {
+  public override componentDidMount(): void {
     const { isSelected } = this.props;
     if (isSelected) {
       this.setFocus();
     }
   }
 
-  public componentDidUpdate(prevProps: PropsType): void {
+  public override componentDidUpdate(prevProps: PropsType): void {
     const { isSelected } = this.props;
 
     if (!prevProps.isSelected && isSelected) {
@@ -52,7 +52,7 @@ export class InlineNotificationWrapper extends React.Component<PropsType> {
     }
   }
 
-  public render(): JSX.Element {
+  public override render(): JSX.Element {
     const { children } = this.props;
 
     return (

ts/components/conversation/Linkify.tsx

@@ -1,4 +1,4 @@
-// Copyright 2018-2020 Signal Messenger, LLC
+// Copyright 2018-2021 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
 
 import React from 'react';
@@ -326,7 +326,7 @@ export class Linkify extends React.Component<Props> {
     renderNonLink: ({ text }) => text,
   };
 
-  public render():
+  public override render():
     | JSX.Element
     | string
     | null

ts/components/conversation/Message.tsx

@@ -418,7 +418,7 @@ export class Message extends React.PureComponent<Props, State> {
     }
   };
 
-  public componentDidMount(): void {
+  public override componentDidMount(): void {
     this.startSelectedTimer();
     this.startDeleteForEveryoneTimer();
 
@@ -445,7 +445,7 @@ export class Message extends React.PureComponent<Props, State> {
     }
   }
 
-  public componentWillUnmount(): void {
+  public override componentWillUnmount(): void {
     if (this.selectedTimeout) {
       clearTimeout(this.selectedTimeout);
     }
@@ -462,7 +462,7 @@ export class Message extends React.PureComponent<Props, State> {
     this.toggleReactionPicker(true);
   }
 
-  public componentDidUpdate(prevProps: Props): void {
+  public override componentDidUpdate(prevProps: Props): void {
     const { canDeleteForEveryone, isSelected, status, timestamp } = this.props;
 
     this.startSelectedTimer();
@@ -2414,7 +2414,7 @@ export class Message extends React.PureComponent<Props, State> {
     );
   }
 
-  public render(): JSX.Element | null {
+  public override render(): JSX.Element | null {
     const { author, attachments, direction, id, isSticker, timestamp } =
       this.props;
     const { expired, expiring, imageBroken, isSelected } = this.state;

ts/components/conversation/MessageDetail.tsx

@@ -105,7 +105,7 @@ export class MessageDetail extends React.Component<Props> {
 
   private readonly messageContainerRef = React.createRef<HTMLDivElement>();
 
-  public componentDidMount(): void {
+  public override componentDidMount(): void {
     // When this component is created, it's initially not part of the DOM, and then it's
     //   added off-screen and animated in. This ensures that the focus takes.
     setTimeout(() => {
@@ -257,7 +257,7 @@ export class MessageDetail extends React.Component<Props> {
     );
   }
 
-  public render(): JSX.Element {
+  public override render(): JSX.Element {
     const {
       errors,
       message,

ts/components/conversation/Quote.tsx

@@ -126,7 +126,7 @@ export class Quote extends React.Component<Props, State> {
     };
   }
 
-  componentDidMount(): void {
+  override componentDidMount(): void {
     const { doubleCheckMissingQuoteReference, referencedMessageNotFound } =
       this.props;
 
@@ -427,7 +427,7 @@ export class Quote extends React.Component<Props, State> {
     );
   }
 
-  public render(): JSX.Element | null {
+  public override render(): JSX.Element | null {
     const {
       conversationColor,
       customColor,

ts/components/conversation/Timeline.tsx

@@ -1005,20 +1005,20 @@ export class Timeline extends React.PureComponent<PropsType, StateType> {
     }
   };
 
-  public componentDidMount(): void {
+  public override componentDidMount(): void {
     this.updateWithVisibleRows();
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
     // @ts-ignore
     window.registerForActive(this.updateWithVisibleRows);
   }
 
-  public componentWillUnmount(): void {
+  public override componentWillUnmount(): void {
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
     // @ts-ignore
     window.unregisterForActive(this.updateWithVisibleRows);
   }
 
-  public componentDidUpdate(
+  public override componentDidUpdate(
     prevProps: Readonly<PropsType>,
     prevState: Readonly<StateType>
   ): void {
@@ -1311,7 +1311,7 @@ export class Timeline extends React.PureComponent<PropsType, StateType> {
     }
   };
 
-  public render(): JSX.Element | null {
+  public override render(): JSX.Element | null {
     const {
       acknowledgeGroupMemberNameCollisions,
       areWeAdmin,

ts/components/conversation/TimelineItem.tsx

@@ -171,7 +171,7 @@ export type PropsType = PropsLocalType &
   >;
 
 export class TimelineItem extends React.PureComponent<PropsType> {
-  public render(): JSX.Element | null {
+  public override render(): JSX.Element | null {
     const {
       containerElementRef,
       conversationId,

ts/components/conversation/TimelineLoadingRow.tsx

@@ -1,4 +1,4 @@
-// Copyright 2019-2020 Signal Messenger, LLC
+// Copyright 2019-2021 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
 
 import React from 'react';
@@ -40,7 +40,7 @@ export class TimelineLoadingRow extends React.PureComponent<Props> {
     return <Spinner size="24" svgSize="small" direction="on-background" />;
   }
 
-  public render(): JSX.Element {
+  public override render(): JSX.Element {
     return (
       <div className="module-timeline-loading-row">{this.renderContents()}</div>
     );

ts/components/conversation/Timestamp.tsx

@@ -31,7 +31,7 @@ export class Timestamp extends React.Component<Props> {
     this.interval = null;
   }
 
-  public componentDidMount(): void {
+  public override componentDidMount(): void {
     const update = () => {
       this.setState({
         // Used to trigger renders
@@ -42,13 +42,13 @@ export class Timestamp extends React.Component<Props> {
     this.interval = setInterval(update, UPDATE_FREQUENCY);
   }
 
-  public componentWillUnmount(): void {
+  public override componentWillUnmount(): void {
     if (this.interval) {
       clearInterval(this.interval);
     }
   }
 
-  public render(): JSX.Element | null {
+  public override render(): JSX.Element | null {
     const {
       direction,
       i18n,

ts/components/conversation/TypingBubble.tsx

@@ -66,7 +66,7 @@ export class TypingBubble extends React.PureComponent<Props> {
     );
   }
 
-  public render(): JSX.Element {
+  public override render(): JSX.Element {
     const { i18n, conversationType } = this.props;
     const isGroup = conversationType === 'group';
 

ts/components/conversation/VerificationNotification.tsx

@@ -61,7 +61,7 @@ export class VerificationNotification extends React.Component<Props> {
     );
   }
 
-  public render(): JSX.Element {
+  public override render(): JSX.Element {
     const { type } = this.props;
     const icon = type === 'markVerified' ? 'verified' : 'verified-not';
 

ts/components/conversation/media-gallery/AttachmentSection.tsx

@@ -1,4 +1,4 @@
-// Copyright 2018-2020 Signal Messenger, LLC
+// Copyright 2018-2021 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
 
 import React from 'react';
@@ -20,7 +20,7 @@ export type Props = {
 };
 
 export class AttachmentSection extends React.Component<Props> {
-  public render(): JSX.Element {
+  public override render(): JSX.Element {
     const { header } = this.props;
 
     return (

ts/components/conversation/media-gallery/DocumentListItem.tsx

@@ -1,4 +1,4 @@
-// Copyright 2018-2020 Signal Messenger, LLC
+// Copyright 2018-2021 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
 
 import React from 'react';
@@ -23,7 +23,7 @@ export class DocumentListItem extends React.Component<Props> {
     shouldShowSeparator: true,
   };
 
-  public render(): JSX.Element {
+  public override render(): JSX.Element {
     const { shouldShowSeparator } = this.props;
 
     return (

ts/components/conversation/media-gallery/MediaGallery.tsx

@@ -1,4 +1,4 @@
-// Copyright 2018-2020 Signal Messenger, LLC
+// Copyright 2018-2021 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
 
 import React from 'react';
@@ -78,7 +78,7 @@ export class MediaGallery extends React.Component<Props, State> {
     };
   }
 
-  public componentDidMount(): void {
+  public override componentDidMount(): void {
     // When this component is created, it's initially not part of the DOM, and then it's
     //   added off-screen and animated in. This ensures that the focus takes.
     setTimeout(() => {
@@ -88,7 +88,7 @@ export class MediaGallery extends React.Component<Props, State> {
     });
   }
 
-  public render(): JSX.Element {
+  public override render(): JSX.Element {
     const { selectedTab } = this.state;
 
     return (

ts/components/conversation/media-gallery/MediaGridItem.tsx

@@ -1,4 +1,4 @@
-// Copyright 2018-2020 Signal Messenger, LLC
+// Copyright 2018-2021 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
 
 import React from 'react';
@@ -111,7 +111,7 @@ export class MediaGridItem extends React.Component<Props, State> {
     );
   }
 
-  public render(): JSX.Element {
+  public override render(): JSX.Element {
     const { onClick } = this.props;
 
     return (

ts/components/conversationList/MessageBodyHighlight.tsx

@@ -137,7 +137,7 @@ export class MessageBodyHighlight extends React.Component<Props> {
     return results;
   }
 
-  public render(): ReactNode {
+  public override render(): ReactNode {
     return <div className={CLASS_NAME}>{this.renderContents()}</div>;
   }
 }

ts/components/leftPane/LeftPaneArchiveHelper.tsx

@@ -48,7 +48,7 @@ export class LeftPaneArchiveHelper extends LeftPaneHelper<LeftPaneArchivePropsTy
     }
   }
 
-  getHeaderContents({
+  override getHeaderContents({
     clearSearch,
     i18n,
     showInbox,
@@ -92,11 +92,11 @@ export class LeftPaneArchiveHelper extends LeftPaneHelper<LeftPaneArchivePropsTy
     );
   }
 
-  getBackAction({ showInbox }: { showInbox: () => void }): () => void {
+  override getBackAction({ showInbox }: { showInbox: () => void }): () => void {
     return showInbox;
   }
 
-  getPreRowsNode({
+  override getPreRowsNode({
     i18n,
   }: Readonly<{ i18n: LocalizerType }>): ReactChild | null {
     if (this.searchHelper) {
@@ -130,7 +130,7 @@ export class LeftPaneArchiveHelper extends LeftPaneHelper<LeftPaneArchivePropsTy
       : undefined;
   }
 
-  getRowIndexToScrollTo(
+  override getRowIndexToScrollTo(
     selectedConversationId: undefined | string
   ): undefined | number {
     if (this.searchHelper) {
@@ -194,7 +194,7 @@ export class LeftPaneArchiveHelper extends LeftPaneHelper<LeftPaneArchivePropsTy
     return false;
   }
 
-  onKeyDown(
+  override onKeyDown(
     event: KeyboardEvent,
     {
       searchInConversation,

ts/components/leftPane/LeftPaneChooseGroupMembersHelper.tsx

@@ -72,7 +72,7 @@ export class LeftPaneChooseGroupMembersHelper extends LeftPaneHelper<LeftPaneCho
     );
   }
 
-  getHeaderContents({
+  override getHeaderContents({
     i18n,
     startComposing,
   }: Readonly<{
@@ -97,7 +97,7 @@ export class LeftPaneChooseGroupMembersHelper extends LeftPaneHelper<LeftPaneCho
     );
   }
 
-  getBackAction({
+  override getBackAction({
     startComposing,
   }: {
     startComposing: () => void;
@@ -105,7 +105,7 @@ export class LeftPaneChooseGroupMembersHelper extends LeftPaneHelper<LeftPaneCho
     return startComposing;
   }
 
-  getPreRowsNode({
+  override getPreRowsNode({
     closeCantAddContactToGroupModal,
     closeMaximumGroupSizeModal,
     closeRecommendedGroupSizeModal,
@@ -196,7 +196,7 @@ export class LeftPaneChooseGroupMembersHelper extends LeftPaneHelper<LeftPaneCho
     );
   }
 
-  getFooterContents({
+  override getFooterContents({
     i18n,
     startSettingGroupMetadata,
   }: Readonly<{

ts/components/leftPane/LeftPaneComposeHelper.tsx

@@ -67,7 +67,7 @@ export class LeftPaneComposeHelper extends LeftPaneHelper<LeftPaneComposePropsTy
     this.isUsernamesEnabled = isUsernamesEnabled;
   }
 
-  getHeaderContents({
+  override getHeaderContents({
     i18n,
     showInbox,
   }: Readonly<{
@@ -90,11 +90,11 @@ export class LeftPaneComposeHelper extends LeftPaneHelper<LeftPaneComposePropsTy
     );
   }
 
-  getBackAction({ showInbox }: { showInbox: () => void }): () => void {
+  override getBackAction({ showInbox }: { showInbox: () => void }): () => void {
     return showInbox;
   }
 
-  getPreRowsNode({
+  override getPreRowsNode({
     i18n,
     onChangeComposeSearchTerm,
   }: Readonly<{

ts/components/leftPane/LeftPaneInboxHelper.tsx

@@ -61,7 +61,7 @@ export class LeftPaneInboxHelper extends LeftPaneHelper<LeftPaneInboxPropsType>
     );
   }
 
-  getPreRowsNode({
+  override getPreRowsNode({
     i18n,
   }: Readonly<{ i18n: LocalizerType }>): null | ReactChild {
     if (this.getRowCount() === 0) {
@@ -156,7 +156,7 @@ export class LeftPaneInboxHelper extends LeftPaneHelper<LeftPaneInboxPropsType>
     return undefined;
   }
 
-  getRowIndexToScrollTo(
+  override getRowIndexToScrollTo(
     selectedConversationId: undefined | string
   ): undefined | number {
     if (!selectedConversationId) {
@@ -188,7 +188,7 @@ export class LeftPaneInboxHelper extends LeftPaneHelper<LeftPaneInboxPropsType>
     return undefined;
   }
 
-  requiresFullWidth(): boolean {
+  override requiresFullWidth(): boolean {
     const hasNoConversations =
       !this.conversations.length &&
       !this.pinnedConversations.length &&
@@ -228,7 +228,7 @@ export class LeftPaneInboxHelper extends LeftPaneHelper<LeftPaneInboxPropsType>
     );
   }
 
-  onKeyDown(
+  override onKeyDown(
     event: KeyboardEvent,
     options: Readonly<{
       searchInConversation: (conversationId: string) => unknown;

ts/components/leftPane/LeftPaneSearchHelper.tsx

@@ -77,7 +77,7 @@ export class LeftPaneSearchHelper extends LeftPaneHelper<LeftPaneSearchPropsType
     this.searchTerm = searchTerm;
   }
 
-  getPreRowsNode({
+  override getPreRowsNode({
     i18n,
   }: Readonly<{ i18n: LocalizerType }>): null | ReactChild {
     const mightHaveSearchResults = this.allResults().some(
@@ -142,7 +142,7 @@ export class LeftPaneSearchHelper extends LeftPaneHelper<LeftPaneSearchPropsType
   }
 
   // This is currently unimplemented. See DESKTOP-1170.
-  getRowIndexToScrollTo(
+  override getRowIndexToScrollTo(
     _selectedConversationId: undefined | string
   ): undefined | number {
     return undefined;
@@ -231,7 +231,7 @@ export class LeftPaneSearchHelper extends LeftPaneHelper<LeftPaneSearchPropsType
       : undefined;
   }
 
-  isScrollable(): boolean {
+  override isScrollable(): boolean {
     return !this.isLoading();
   }
 
@@ -267,7 +267,7 @@ export class LeftPaneSearchHelper extends LeftPaneHelper<LeftPaneSearchPropsType
     return undefined;
   }
 
-  onKeyDown(
+  override onKeyDown(
     event: KeyboardEvent,
     options: Readonly<{
       searchInConversation: (conversationId: string) => unknown;

ts/components/leftPane/LeftPaneSetGroupMetadataHelper.tsx

@@ -75,7 +75,7 @@ export class LeftPaneSetGroupMetadataHelper extends LeftPaneHelper<LeftPaneSetGr
     this.userAvatarData = userAvatarData;
   }
 
-  getHeaderContents({
+  override getHeaderContents({
     i18n,
     showChooseGroupMembers,
   }: Readonly<{
@@ -101,7 +101,7 @@ export class LeftPaneSetGroupMetadataHelper extends LeftPaneHelper<LeftPaneSetGr
     );
   }
 
-  getBackAction({
+  override getBackAction({
     showChooseGroupMembers,
   }: {
     showChooseGroupMembers: () => void;
@@ -109,7 +109,7 @@ export class LeftPaneSetGroupMetadataHelper extends LeftPaneHelper<LeftPaneSetGr
     return this.isCreating ? undefined : showChooseGroupMembers;
   }
 
-  getPreRowsNode({
+  override getPreRowsNode({
     clearGroupCreationError,
     composeDeleteAvatarFromDisk,
     composeReplaceAvatar,
@@ -219,7 +219,7 @@ export class LeftPaneSetGroupMetadataHelper extends LeftPaneHelper<LeftPaneSetGr
     );
   }
 
-  getFooterContents({
+  override getFooterContents({
     createGroup,
     i18n,
   }: Readonly<{