From 702cef6565f73ea2911271bd36aa01d17f93211a Mon Sep 17 00:00:00 2001
From: William Grant <willmgrant@gmail.com>
Date: Fri, 14 Oct 2022 15:08:46 +1100
Subject: [PATCH] fix: pr review - use isDarkTheme everywhere

---
 ts/components/conversation/SessionEmojiPanel.tsx |  5 +++--
 ts/components/leftpane/ActionsPanel.tsx          | 12 ++++++------
 2 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/ts/components/conversation/SessionEmojiPanel.tsx b/ts/components/conversation/SessionEmojiPanel.tsx
index 607592063..57cc44063 100644
--- a/ts/components/conversation/SessionEmojiPanel.tsx
+++ b/ts/components/conversation/SessionEmojiPanel.tsx
@@ -4,7 +4,7 @@ import styled from 'styled-components';
 // @ts-ignore
 import Picker from '@emoji-mart/react';
 import { useSelector } from 'react-redux';
-import { getTheme } from '../../state/selectors/theme';
+import { getTheme, isDarkTheme } from '../../state/selectors/theme';
 import { FixedBaseEmoji, FixedPickerProps } from '../../types/Reaction';
 import {
   ColorsType,
@@ -101,6 +101,7 @@ export const SessionEmojiPanel = forwardRef<HTMLDivElement, Props>((props: Props
   const { onEmojiClicked, show, isModal = false, onKeyDown } = props;
   const primaryColor = useSelector(getPrimaryColor);
   const theme = useSelector(getTheme);
+  const isDarkMode = useSelector(isDarkTheme);
 
   const [panelBackgroundRGB, setPanelBackgroundRGB] = useState('');
   const [panelTextRGB, setPanelTextRGB] = useState('');
@@ -139,7 +140,7 @@ export const SessionEmojiPanel = forwardRef<HTMLDivElement, Props>((props: Props
       ref={ref}
     >
       <Picker
-        theme={theme.includes('light') ? 'light' : 'dark'}
+        theme={isDarkMode ? 'dark' : 'light'}
         i18n={i18nEmojiData}
         onEmojiSelect={onEmojiClicked}
         onKeyDown={onKeyDown}
diff --git a/ts/components/leftpane/ActionsPanel.tsx b/ts/components/leftpane/ActionsPanel.tsx
index f016404f4..08a22e20e 100644
--- a/ts/components/leftpane/ActionsPanel.tsx
+++ b/ts/components/leftpane/ActionsPanel.tsx
@@ -47,7 +47,7 @@ import { UserUtils } from '../../session/utils';
 import { getLatestReleaseFromFileServer } from '../../session/apis/file_server_api/FileServerApi';
 import { switchThemeTo } from '../../themes/switchTheme';
 import { ThemeStateType } from '../../themes/constants/colors';
-import { getTheme } from '../../state/selectors/theme';
+import { isDarkTheme } from '../../state/selectors/theme';
 
 const Section = (props: { type: SectionType }) => {
   const ourNumber = useSelector(getOurNumber);
@@ -55,7 +55,7 @@ const Section = (props: { type: SectionType }) => {
   const dispatch = useDispatch();
   const { type } = props;
 
-  const theme = useSelector(getTheme);
+  const isDarkMode = useSelector(isDarkTheme);
   const focusedSection = useSelector(getFocusedSection);
   const isSelected = focusedSection === props.type;
 
@@ -65,9 +65,9 @@ const Section = (props: { type: SectionType }) => {
       dispatch(editProfileModal({}));
     } else if (type === SectionType.ColorMode) {
       const currentTheme = String(window.Events.getThemeSetting());
-      const newTheme = (currentTheme.includes('light')
-        ? currentTheme.replace('light', 'dark')
-        : currentTheme.replace('dark', 'light')) as ThemeStateType;
+      const newTheme = (isDarkMode
+        ? currentTheme.replace('dark', 'light')
+        : currentTheme.replace('light', 'dark')) as ThemeStateType;
 
       // We want to persist the primary color when using the color mode button
       await switchThemeTo({
@@ -137,7 +137,7 @@ const Section = (props: { type: SectionType }) => {
       return (
         <SessionIconButton
           iconSize="medium"
-          iconType={theme.includes('light') ? 'sun' : 'moon'}
+          iconType={isDarkMode ? 'moon' : 'sun'}
           dataTestId="theme-section"
           notificationCount={unreadToShow}
           onClick={handleClick}