Merge pull request #3071 from Bilb/fix-password-window-crash

Fix password window crash

ts/components/SessionScrollButton.tsx

@@ -5,6 +5,7 @@ import { getShowScrollButton } from '../state/selectors/conversations';
 
 import { useSelectedUnreadCount } from '../state/selectors/selectedConversation';
 import { SessionIconButton } from './icon';
+import { SessionUnreadCount } from './icon/SessionNotificationCount';
 
 const SessionScrollButtonDiv = styled.div`
   position: fixed;
@@ -30,8 +31,9 @@ export const SessionScrollButton = (props: { onClickScrollBottom: () => void })
         isHidden={!show}
         onClick={props.onClickScrollBottom}
         dataTestId="scroll-to-bottom-button"
-        unreadCount={unreadCount}
-      />
+      >
+        {Boolean(unreadCount) && <SessionUnreadCount count={unreadCount} />}
+      </SessionIconButton>
     </SessionScrollButtonDiv>
   );
 };

ts/components/icon/SessionIconButton.tsx

@@ -2,12 +2,10 @@ import classNames from 'classnames';
 import _ from 'lodash';
 import React, { KeyboardEvent } from 'react';
 import styled from 'styled-components';
-import { SessionIcon, SessionIconProps } from '.';
-import { SessionNotificationCount, SessionUnreadCount } from './SessionNotificationCount';
+import { SessionIcon, SessionIconProps } from './SessionIcon';
 
 interface SProps extends SessionIconProps {
   onClick?: (e?: React.MouseEvent<HTMLButtonElement>) => void;
-  notificationCount?: number;
   isSelected?: boolean;
   isHidden?: boolean;
   margin?: string;
@@ -16,6 +14,7 @@ interface SProps extends SessionIconProps {
   id?: string;
   style?: object;
   tabIndex?: number;
+  children?: React.ReactNode;
 }
 
 const StyledSessionIconButton = styled.button<{ color?: string; isSelected?: boolean }>`
@@ -46,7 +45,6 @@ const SessionIconButtonInner = React.forwardRef<HTMLButtonElement, SProps>((prop
     iconColor,
     iconRotation,
     isSelected,
-    notificationCount,
     glowDuration,
     glowStartDelay,
     noScale,
@@ -60,7 +58,7 @@ const SessionIconButtonInner = React.forwardRef<HTMLButtonElement, SProps>((prop
     dataTestIdIcon,
     style,
     tabIndex,
-    unreadCount,
+    children,
   } = props;
   const clickHandler = (e: React.MouseEvent<HTMLButtonElement>) => {
     if (props.onClick) {
@@ -101,8 +99,7 @@ const SessionIconButtonInner = React.forwardRef<HTMLButtonElement, SProps>((prop
         iconPadding={iconPadding}
         dataTestId={dataTestIdIcon}
       />
-      {Boolean(notificationCount) && <SessionNotificationCount count={notificationCount} />}
-      {Boolean(unreadCount) && <SessionUnreadCount count={unreadCount} />}
+      {children}
     </StyledSessionIconButton>
   );
 });

ts/components/leftpane/ActionsPanel.tsx

@@ -33,7 +33,7 @@ import { getSwarmPollingInstance } from '../../session/apis/snode_api';
 import { UserUtils } from '../../session/utils';
 import { Avatar, AvatarSize } from '../avatar/Avatar';
 import { ActionPanelOnionStatusLight } from '../dialog/OnionStatusPathDialog';
-import { SessionIconButton } from '../icon';
+import { SessionIconButton } from '../icon/SessionIconButton';
 import { LeftPaneSectionContainer } from './LeftPaneSectionContainer';
 
 import { SettingsKey } from '../../data/settings-key';
@@ -48,6 +48,7 @@ import { ensureThemeConsistency } from '../../themes/SessionTheme';
 import { switchThemeTo } from '../../themes/switchTheme';
 import { ReleasedFeatures } from '../../util/releaseFeature';
 import { getOppositeTheme } from '../../util/theme';
+import { SessionNotificationCount } from '../icon/SessionNotificationCount';
 
 const Section = (props: { type: SectionType }) => {
   const ourNumber = useSelector(getOurNumber);
@@ -103,10 +104,11 @@ const Section = (props: { type: SectionType }) => {
           iconSize="medium"
           dataTestId="message-section"
           iconType={'chatBubble'}
-          notificationCount={unreadToShow}
           onClick={handleClick}
           isSelected={isSelected}
-        />
+        >
+          {Boolean(unreadToShow) && <SessionNotificationCount count={unreadToShow} />}
+        </SessionIconButton>
       );
     case SectionType.Settings:
       return (

ts/session/utils/Toast.tsx

@@ -1,7 +1,6 @@
 import React from 'react';
 import { toast } from 'react-toastify';
 import { SessionToast, SessionToastType } from '../../components/basic/SessionToast';
-import { SessionIconType } from '../../components/icon';
 import { SessionSettingCategory } from '../../components/settings/SessionSettings';
 import { SectionType, showLeftPaneSection, showSettingsSection } from '../../state/ducks/section';
 
@@ -38,19 +37,9 @@ export function pushToastInfo(
   );
 }
 
-export function pushToastSuccess(
-  id: string,
-  title: string,
-  description?: string,
-  icon?: SessionIconType
-) {
+export function pushToastSuccess(id: string, title: string, description?: string) {
   toast.success(
-    <SessionToast
-      title={title}
-      description={description}
-      type={SessionToastType.Success}
-      icon={icon}
-    />,
+    <SessionToast title={title} description={description} type={SessionToastType.Success} />,
     { toastId: id, updateId: id }
   );
 }
@@ -210,12 +199,7 @@ export function someDeletionsFailed() {
 }
 
 export function pushDeleted(messageCount: number) {
-  pushToastSuccess(
-    'deleted',
-    window.i18n('deleted', [messageCount.toString()]),
-    undefined,
-    'check'
-  );
+  pushToastSuccess('deleted', window.i18n('deleted', [messageCount.toString()]), undefined);
 }
 
 export function pushCannotRemoveCreatorFromGroup() {