fix: more lint issues

ts/components/buttons/PanelRadioButton.tsx

@@ -62,7 +62,7 @@ export const PanelRadioButton = (props: PanelRadioButtonProps) => {
       disabled={disabled}
       noBackgroundColor={noBackgroundColor}
       onClick={() => {
-        isSelected ? onUnselect?.('bye') : onSelect?.('hi');
+        return isSelected ? onUnselect?.('bye') : onSelect?.('hi');
       }}
       dataTestId={dataTestId}
     >

ts/components/conversation/TimerNotification.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 
+import styled from 'styled-components';
 import { PropsForExpirationTimer } from '../../state/ducks/conversations';
 import { assertUnreachable } from '../../types/sqlSharedTypes';
 
@@ -7,7 +8,6 @@ import { ExpirableReadableMessage } from './message/message-item/ExpirableReadab
 import { SessionIcon } from '../icon';
 import { SpacerSM, Text } from '../basic/Text';
 import { Flex } from '../basic/Flex';
-import styled from 'styled-components';
 
 const StyledTimerNotification = styled(Flex)`
   text-align: center;

ts/components/conversation/header/ConversationHeaderSubtitle.tsx

@@ -7,9 +7,9 @@ import { SubtitleStrings, SubtitleStringsType } from './ConversationHeaderTitle'
 function loadDataTestId(currentSubtitle: SubtitleStringsType) {
   if (currentSubtitle === 'disappearingMessages') {
     return 'disappear-messages-type-and-time';
-  } else {
-    return 'conversation-header-subtitle';
   }
+
+  return 'conversation-header-subtitle';
 }
 
 export const StyledSubtitleContainer = styled.div`

ts/components/conversation/header/ConversationHeaderTitle.tsx

@@ -1,5 +1,5 @@
 import { isNumber } from 'lodash';
-import React, { useEffect, useState } from 'react';
+import React, { useEffect, useState, useMemo } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import { useConversationUsername } from '../../../hooks/useParamSelector';
 import { closeRightPanel, openRightPanel } from '../../../state/ducks/conversations';
@@ -52,15 +52,13 @@ export const ConversationHeaderTitle = () => {
 
   const [visibleSubtitle, setVisibleSubtitle] = useState<SubtitleStringsType>('notifications');
 
-  if (!selectedConvoKey) {
+  const subtitleStrings: SubtitleStrings = {};
-    return null;
+  const subtitleArray: Array<SubtitleStringsType> = useMemo(() => {
-  }
+    return [];
+  }, []);
 
   const { i18n } = window;
 
-  const subtitleStrings: SubtitleStrings = {};
-  const subtitleArray: Array<SubtitleStringsType> = [];
-
   const notificationSubtitle = notificationSetting
     ? i18n('notificationSubtitle', [notificationSetting])
     : null;
@@ -69,6 +67,20 @@ export const ConversationHeaderTitle = () => {
     subtitleArray.push('notifications');
   }
 
+  useEffect(() => {
+    setVisibleSubtitle('notifications');
+  }, [convoName]);
+
+  useEffect(() => {
+    if (subtitleArray.indexOf(visibleSubtitle) < 0) {
+      setVisibleSubtitle('notifications');
+    }
+  }, [subtitleArray, visibleSubtitle]);
+
+  if (!selectedConvoKey) {
+    return null;
+  }
+
   let memberCount = 0;
   if (isGroup) {
     if (isPublic) {
@@ -125,16 +137,6 @@ export const ConversationHeaderTitle = () => {
     }
   };
 
-  useEffect(() => {
-    setVisibleSubtitle('notifications');
-  }, [convoName]);
-
-  useEffect(() => {
-    if (subtitleArray.indexOf(visibleSubtitle) < 0) {
-      setVisibleSubtitle('notifications');
-    }
-  }, [subtitleArray, visibleSubtitle]);
-
   return (
     <div className="module-conversation-header__title-container">
       <div className="module-conversation-header__title-flex">

ts/components/conversation/message/message-item/ExpirableReadableMessage.tsx

@@ -13,10 +13,17 @@ import { useMessageExpirationPropsById } from '../../../../hooks/useParamSelecto
 
 const EXPIRATION_CHECK_MINIMUM = 2000;
 
-function useIsExpired(props: PropsForExpiringMessage) {
+// TODO Check that this isn't broken
+function useIsExpired(
+  props: Omit<PropsForExpiringMessage, 'messageId' | 'direction'> & {
+    messageId: string | undefined;
+    direction: MessageModelType | undefined;
+  }
+) {
   const {
     convoId,
     messageId,
+    direction,
     expirationLength,
     expirationTimestamp,
     isExpired: isExpiredProps,
@@ -29,7 +36,7 @@ function useIsExpired(props: PropsForExpiringMessage) {
   const checkExpired = useCallback(async () => {
     const now = Date.now();
 
-    if (!expirationTimestamp || !expirationLength) {
+    if (!messageId || !direction || !expirationTimestamp || !expirationLength) {
       return;
     }
 
@@ -48,7 +55,7 @@ function useIsExpired(props: PropsForExpiringMessage) {
         convo?.updateLastMessage();
       }
     }
-  }, [expirationTimestamp, expirationLength, isExpired, messageId, convoId]);
+  }, [messageId, direction, expirationTimestamp, expirationLength, isExpired, convoId, dispatch]);
 
   let checkFrequency: number | null = null;
   if (expirationLength) {
@@ -58,7 +65,7 @@ function useIsExpired(props: PropsForExpiringMessage) {
 
   useEffect(() => {
     void checkExpired();
-  }, []); // check on mount
+  }, [checkExpired]); // check on mount
 
   useInterval(checkExpired, checkFrequency); // check every 2sec or sooner if needed
 
@@ -87,44 +94,29 @@ export interface ExpirableReadableMessageProps
 export const ExpirableReadableMessage = (props: ExpirableReadableMessageProps) => {
   const selected = useMessageExpirationPropsById(props.messageId);
 
-  if (!selected) {
-    return null;
-  }
-
   const {
-    direction: overrideDirection,
+    direction,
     isCentered,
     marginInlineStart = '6px',
     marginInlineEnd = '6px',
     dataTestId,
   } = props;
 
-  const {
-    convoId,
-    messageId,
-    direction: selectedDirection,
-    receivedAt,
-    isUnread,
-    expirationLength,
-    expirationTimestamp,
-    isExpired: _isExpired,
-  } = selected;
-
-  const direction = overrideDirection || selectedDirection;
-
   const { isExpired } = useIsExpired({
-    convoId,
+    convoId: selected?.convoId,
-    messageId,
+    messageId: selected?.messageId,
-    direction,
+    direction: direction || selected?.direction,
-    expirationTimestamp,
+    expirationTimestamp: selected?.expirationTimestamp,
-    expirationLength,
+    expirationLength: selected?.expirationLength,
-    isExpired: _isExpired,
+    isExpired: selected?.isExpired,
   });
 
-  if (isExpired) {
+  if (!selected || isExpired) {
     return null;
   }
 
+  const { messageId, receivedAt, isUnread, expirationLength, expirationTimestamp } = selected;
+
   const isIncoming = direction === 'incoming';
 
   return (