fix: pr review - create selectors for isDarkTheme and isLight Theme

ts/components/conversation/SessionLastSeenIndicator.tsx

@@ -2,7 +2,7 @@ import React, { useContext, useLayoutEffect } from 'react';
 import { useSelector } from 'react-redux';
 import styled from 'styled-components';
 import { getQuotedMessageToAnimate } from '../../state/selectors/conversations';
-import { getTheme } from '../../state/selectors/theme';
+import { isDarkTheme } from '../../state/selectors/theme';
 import { ScrollToLoadedMessageContext } from './SessionMessagesListContainer';
 
 const LastSeenBar = styled.div`
@@ -48,7 +48,7 @@ export const SessionLastSeenIndicator = (props: {
   didScroll: boolean;
   setDidScroll: (scroll: boolean) => void;
 }) => {
-  const darkMode = useSelector(getTheme).includes('dark');
+  const darkMode = useSelector(isDarkTheme);
   // if this unread-indicator is not unique it's going to cause issues
   const quotedMessageToAnimate = useSelector(getQuotedMessageToAnimate);
   const scrollToLoadedMessage = useContext(ScrollToLoadedMessageContext);

ts/components/conversation/message/reactions/ReactionPopup.tsx

@@ -3,7 +3,7 @@ import { useSelector } from 'react-redux';
 import styled from 'styled-components';
 import { Data } from '../../../../data/data';
 import { PubKey } from '../../../../session/types/PubKey';
-import { getTheme } from '../../../../state/selectors/theme';
+import { isDarkTheme } from '../../../../state/selectors/theme';
 import { nativeEmojiData } from '../../../../util/emoji';
 
 export type TipPosition = 'center' | 'left' | 'right';
@@ -96,7 +96,7 @@ const generateContactsString = async (
 };
 
 const Contacts = (contacts: Array<string>, count: number) => {
-  const darkMode = useSelector(getTheme).includes('dark');
+  const darkMode = useSelector(isDarkTheme);
 
   if (!Boolean(contacts?.length > 0)) {
     return;

ts/components/dialog/BanOrUnbanUserDialog.tsx

@@ -17,7 +17,7 @@ import {
   sogsV3UnbanUser,
 } from '../../session/apis/open_group_api/sogsv3/sogsV3BanUnban';
 import { SessionHeaderSearchInput } from '../SessionHeaderSearchInput';
-import { getTheme } from '../../state/selectors/theme';
+import { isDarkTheme } from '../../state/selectors/theme';
 
 // tslint:disable: use-simple-attributes
 
@@ -67,7 +67,7 @@ export const BanOrUnBanUserDialog = (props: {
   const { i18n } = window;
   const isBan = banType === 'ban';
   const dispatch = useDispatch();
-  const darkMode = useSelector(getTheme).includes('dark');
+  const darkMode = useSelector(isDarkTheme);
   const convo = getConversationController().get(conversationId);
   const inputRef = useRef(null);
 

ts/components/dialog/ModeratorsAddDialog.tsx

@@ -10,7 +10,7 @@ import { SessionSpinner } from '../basic/SessionSpinner';
 import { SessionWrapperModal } from '../SessionWrapperModal';
 import { sogsV3AddAdmin } from '../../session/apis/open_group_api/sogsv3/sogsV3AddRemoveMods';
 import { SessionHeaderSearchInput } from '../SessionHeaderSearchInput';
-import { getTheme } from '../../state/selectors/theme';
+import { isDarkTheme } from '../../state/selectors/theme';
 
 type Props = {
   conversationId: string;
@@ -20,7 +20,7 @@ export const AddModeratorsDialog = (props: Props) => {
   const { conversationId } = props;
 
   const dispatch = useDispatch();
-  const darkMode = useSelector(getTheme).includes('dark');
+  const darkMode = useSelector(isDarkTheme);
   const convo = getConversationController().get(conversationId);
 
   const [inputBoxValue, setInputBoxValue] = useState('');

ts/state/selectors/theme.ts

@@ -2,3 +2,7 @@ import { ThemeStateType } from '../../themes/constants/colors';
 import { StateType } from '../reducer';
 
 export const getTheme = (state: StateType): ThemeStateType => state.theme;
+
+export const isDarkTheme = (state: StateType): boolean => state.theme.includes('dark');
+
+export const isLightTheme = (state: StateType): boolean => state.theme.includes('light');