Skip to content

Commit 5f41099

Browse files
BilbBilb
committed
chore: remove Message section and link back buttons in leftpane
1 parent b3cc370 commit 5f41099

File tree

12 files changed

+46
-110
lines changed

12 files changed

+46
-110
lines changed

‎ts/components/buttons/avatar/GearAvatarButton.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ export const GearAvatarButton = () => {
1010
<LucideIcon
1111
unicode={LUCIDE_ICONS_UNICODE.SETTINGS}
1212
iconSize={'small'}
13-
iconColor="var(--modal-background-content-color)"
13+
iconColor="var(--black-color)"
1414
dataTestId="invalid-data-testid"
1515
style={{
1616
position: 'absolute',

‎ts/components/dialog/user-settings/pages/EditPasswordSettingsPage.tsx‎

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@ function StrengthCriteria(opts: { isMet: boolean } & WithTrArgs) {
4141
<Localizer {...opts.tr} />
4242
<LucideIcon
4343
iconColor={opts.isMet ? criteriaMetColor : 'var(--danger-color)'}
44-
unicode={LUCIDE_ICONS_UNICODE.CIRCLE_CHECK}
44+
unicode={opts.isMet ? LUCIDE_ICONS_UNICODE.CIRCLE_CHECK : LUCIDE_ICONS_UNICODE.CIRCLE_X}
4545
iconSize="small"
4646
/>
4747
</Flex>
@@ -268,7 +268,14 @@ export function EditPasswordSettingsPage(modalState: {
268268
buttonType={SessionButtonType.Outline}
269269
onClick={doChange}
270270
buttonColor={isRemove ? SessionButtonColor.Danger : SessionButtonColor.Primary}
271-
disabled={!firstPassword}
271+
disabled={
272+
// to set a password, we need both passwords (new & confirm)
273+
(isSet && (!firstPassword || !secondPassword)) ||
274+
// to change a password, we need all 3 passwords (current, new & confirm )
275+
(isChange && (!firstPassword || !secondPassword || !thirdPassword)) ||
276+
// to remove a password, we need the current password
277+
(isRemove && !firstPassword)
278+
}
272279
/>
273280
</ModalActionsContainer>
274281
}

‎ts/components/icon/lucide.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ export enum LUCIDE_ICONS_UNICODE {
1414
CIRCLE_ELLIPSES = '',
1515
CIRCLE_HELP = '',
1616
CIRCLE_PLUS = '',
17+
CIRCLE_X = '',
1718
CLAPERBOARD = '',
1819
COPY = '',
1920
DOWNLOAD = '',

‎ts/components/leftpane/ActionsPanel.tsx‎

Lines changed: 2 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,6 @@ import {
1616
getOurPrimaryConversation,
1717
useGlobalUnreadMessageCount,
1818
} from '../../state/selectors/conversations';
19-
import { getFocusedSection } from '../../state/selectors/section';
2019
import { getOurNumber } from '../../state/selectors/user';
2120

2221
import { DecryptedAttachmentsManager } from '../../session/crypto/DecryptedAttachmentsManager';
@@ -46,7 +45,6 @@ import { useHotkey } from '../../hooks/useHotkey';
4645
import { useIsDarkTheme } from '../../state/theme/selectors/theme';
4746
import { switchThemeTo } from '../../themes/switchTheme';
4847
import { getOppositeTheme } from '../../util/theme';
49-
import { SessionNotificationCount } from '../icon/SessionNotificationCount';
5048
import { getIsModalVisible } from '../../state/selectors/modal';
5149

5250
import { MessageQueue } from '../../session/sending';
@@ -89,14 +87,11 @@ function handleThemeSwitch() {
8987

9088
const Section = (props: { type: SectionType }) => {
9189
const ourNumber = useSelector(getOurNumber);
92-
const globalUnreadMessageCount = useGlobalUnreadMessageCount();
9390
const dispatch = useDispatch();
9491
const { type } = props;
9592

9693
const isModalVisible = useSelector(getIsModalVisible);
9794
const isDarkTheme = useIsDarkTheme();
98-
const focusedSection = useSelector(getFocusedSection);
99-
const isSelected = focusedSection === type;
10095

10196
const handleClick = () => {
10297
if (type === SectionType.DebugMenu) {
@@ -114,14 +109,12 @@ const Section = (props: { type: SectionType }) => {
114109
}
115110
// message section
116111
dispatch(searchActions.clearSearch());
117-
dispatch(sectionActions.showLeftPaneSection(type));
118112
dispatch(sectionActions.resetLeftOverlayMode());
119113
};
120114

121115
useHotkey('Escape', () => {
122116
if (!isModalVisible) {
123117
dispatch(searchActions.clearSearch());
124-
dispatch(sectionActions.showLeftPaneSection(SectionType.Message));
125118
dispatch(sectionActions.resetLeftOverlayMode());
126119
}
127120
});
@@ -140,29 +133,14 @@ const Section = (props: { type: SectionType }) => {
140133
);
141134
}
142135

143-
const unreadToShow = type === SectionType.Message ? globalUnreadMessageCount : undefined;
144-
145136
const buttonProps = {
146137
iconSize: 'medium',
147138
padding: 'var(--margins-lg)',
148139
onClick: handleClick,
149-
isSelected,
140+
isSelected: false,
150141
} satisfies Omit<SessionLucideIconButtonProps, 'unicode' | 'dataTestId'>;
151142

152143
switch (type) {
153-
case SectionType.Message:
154-
return (
155-
<SessionLucideIconButton
156-
{...buttonProps}
157-
dataTestId="message-section"
158-
unicode={LUCIDE_ICONS_UNICODE.MESSAGE_SQUARE}
159-
style={{
160-
position: 'relative',
161-
}}
162-
>
163-
{Boolean(unreadToShow) && <SessionNotificationCount count={unreadToShow} />}
164-
</SessionLucideIconButton>
165-
);
166144
case SectionType.DebugMenu:
167145
return (
168146
<SessionLucideIconButton
@@ -176,6 +154,7 @@ const Section = (props: { type: SectionType }) => {
176154
return (
177155
<SessionLucideIconButton
178156
{...buttonProps}
157+
margin="auto 0 0 0"
179158
unicode={isDarkTheme ? LUCIDE_ICONS_UNICODE.MOON : LUCIDE_ICONS_UNICODE.SUN_MEDIUM}
180159
dataTestId="theme-section"
181160
/>
@@ -362,7 +341,6 @@ export const ActionsPanel = () => {
362341
<>
363342
<LeftPaneSectionContainer data-testid="leftpane-section-container">
364343
<Section type={SectionType.Profile} />
365-
<Section type={SectionType.Message} />
366344
{showDebugMenu && <Section type={SectionType.DebugMenu} />}
367345
<Section type={SectionType.ThemeSwitch} />
368346
</LeftPaneSectionContainer>

‎ts/components/leftpane/LeftPane.tsx‎

Lines changed: 1 addition & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,4 @@
1-
import { useSelector } from 'react-redux';
21
import styled from 'styled-components';
3-
import { SectionType } from '../../state/ducks/section';
4-
import { getFocusedSection } from '../../state/selectors/section';
52
import { SessionToastContainer } from '../SessionToastContainer';
63
import { CallInFullScreenContainer } from '../calling/CallInFullScreenContainer';
74
import { DraggableCallContainer } from '../calling/DraggableCallContainer';
@@ -26,13 +23,7 @@ const StyledLeftPane = styled.div<{ isRtl: boolean }>`
2623
`;
2724

2825
const LeftPaneSection = () => {
29-
const focusedSection = useSelector(getFocusedSection);
30-
31-
if (focusedSection === SectionType.Message) {
32-
return <LeftPaneMessageSection />;
33-
}
34-
35-
return null;
26+
return <LeftPaneMessageSection />;
3627
};
3728

3829
const CallContainer = () => {

‎ts/components/leftpane/LeftPaneSectionHeader.tsx‎

Lines changed: 22 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import { useDispatch, useSelector } from 'react-redux';
22
import styled from 'styled-components';
3-
import { LeftOverlayMode, sectionActions, SectionType } from '../../state/ducks/section';
3+
import { LeftOverlayMode, sectionActions } from '../../state/ducks/section';
44
import { disableRecoveryPhrasePrompt } from '../../state/ducks/userConfig';
5-
import { getFocusedSection, useLeftOverlayMode } from '../../state/selectors/section';
5+
import { useLeftOverlayMode } from '../../state/selectors/section';
66
import { useHideRecoveryPasswordEnabled } from '../../state/selectors/settings';
77
import { useIsDarkTheme } from '../../state/theme/selectors/theme';
88
import { getShowRecoveryPhrasePrompt } from '../../state/selectors/userConfig';
@@ -107,7 +107,6 @@ function getLeftPaneHeaderLabel(leftOverlayMode: LeftOverlayMode | undefined): s
107107

108108
export const LeftPaneBanner = () => {
109109
const isDarkTheme = useIsDarkTheme();
110-
const section = useSelector(getFocusedSection);
111110
const isSignInWithRecoveryPhrase = isSignWithRecoveryPhrase();
112111
const hideRecoveryPassword = useHideRecoveryPasswordEnabled();
113112

@@ -118,7 +117,7 @@ export const LeftPaneBanner = () => {
118117
dispatch(userSettingsModal({ userSettingsPage: 'recovery-password' }));
119118
};
120119

121-
if (section !== SectionType.Message || isSignInWithRecoveryPhrase || hideRecoveryPassword) {
120+
if (isSignInWithRecoveryPhrase || hideRecoveryPassword) {
122121
return null;
123122
}
124123

@@ -160,19 +159,28 @@ export const LeftPaneBanner = () => {
160159

161160
export const LeftPaneSectionHeader = () => {
162161
const showRecoveryPhrasePrompt = useSelector(getShowRecoveryPhrasePrompt);
163-
const focusedSection = useSelector(getFocusedSection);
164162
const leftOverlayMode = useLeftOverlayMode();
165163

166164
const dispatch = useDispatch();
167-
const returnToActionChooser = () => {
165+
const goBack = () => {
166+
if (!leftOverlayMode) {
167+
return;
168+
}
169+
if (leftOverlayMode === 'choose-action') {
170+
dispatch(sectionActions.resetLeftOverlayMode());
171+
172+
return;
173+
}
168174
if (leftOverlayMode === 'closed-group') {
169175
dispatch(searchActions.clearSearch());
176+
dispatch(sectionActions.setLeftOverlayMode('choose-action'));
177+
178+
return;
170179
}
171180
dispatch(sectionActions.setLeftOverlayMode('choose-action'));
172181
};
173182

174183
const label = getLeftPaneHeaderLabel(leftOverlayMode);
175-
const isMessageSection = focusedSection === SectionType.Message;
176184

177185
return (
178186
<Flex $flexDirection="column">
@@ -182,21 +190,22 @@ export const LeftPaneSectionHeader = () => {
182190
$justifyContent="space-between"
183191
$alignItems="center"
184192
>
185-
{leftOverlayMode &&
186-
leftOverlayMode !== 'choose-action' &&
187-
leftOverlayMode !== 'message-requests' ? (
193+
{leftOverlayMode ? (
188194
<SessionLucideIconButton
189195
ariaLabel="Back button"
190196
iconSize="large"
191197
unicode={LUCIDE_ICONS_UNICODE.CHEVRON_LEFT}
192-
onClick={returnToActionChooser}
198+
onClick={goBack}
193199
dataTestId="back-button"
200+
padding="var(--margins-sm)"
194201
/>
195202
) : (
196203
<SpacerSM />
197204
)}
198-
<SectionTitle color={'var(--text-primary-color)'}>{label}</SectionTitle>
199-
{isMessageSection && <MenuButton />}
205+
<SectionTitle color={'var(--text-primary-color)'} onClick={goBack}>
206+
{label}
207+
</SectionTitle>
208+
{!leftOverlayMode && <MenuButton />}
200209
</StyledLeftPaneSectionHeader>
201210
{showRecoveryPhrasePrompt && <LeftPaneBanner />}
202211
</Flex>

‎ts/components/leftpane/conversation-list-item/HeaderItem.tsx‎

Lines changed: 1 addition & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -18,21 +18,15 @@ import {
1818
openConversationWithMessages,
1919
} from '../../../state/ducks/conversations';
2020
import { useIsSearchingForType } from '../../../state/selectors/search';
21-
import { useIsMessageSection } from '../../../state/selectors/section';
2221
import { Timestamp } from '../../conversation/Timestamp';
2322
import { SessionIcon } from '../../icon';
2423
import { UserItem } from './UserItem';
2524
import type { WithConvoId } from '../../../session/types/with';
2625

2726
const NotificationSettingIcon = () => {
28-
const isMessagesSection = useIsMessageSection();
2927
const convoId = useConvoIdFromContext();
3028
const convoSetting = useNotificationSetting(convoId);
3129

32-
if (!isMessagesSection) {
33-
return null;
34-
}
35-
3630
switch (convoSetting) {
3731
case 'all':
3832
return null;
@@ -66,10 +60,9 @@ const StyledConversationListItemIconWrapper = styled.div`
6660
const PinIcon = () => {
6761
const conversationId = useConvoIdFromContext();
6862

69-
const isMessagesSection = useIsMessageSection();
7063
const isPinned = useIsPinned(conversationId);
7164

72-
return isMessagesSection && isPinned ? (
65+
return isPinned ? (
7366
<SessionIcon iconType="pin" iconColor={'var(--conversation-tab-text-color)'} iconSize="small" />
7467
) : null;
7568
};

‎ts/components/menu/Menu.tsx‎

Lines changed: 2 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -15,10 +15,7 @@ import {
1515
import { ConvoHub } from '../../session/conversations';
1616
import { PubKey } from '../../session/types';
1717
import { useConversationIdOrigin } from '../../state/selectors/conversations';
18-
import {
19-
useIsMessageRequestOverlayShown,
20-
useIsMessageSection,
21-
} from '../../state/selectors/section';
18+
import { useIsMessageRequestOverlayShown } from '../../state/selectors/section';
2219
import { useSelectedConversationKey } from '../../state/selectors/selectedConversation';
2320
import { ItemWithDataTestId } from './items/MenuItemWithDataTestId';
2421
import { NetworkTime } from '../../util/NetworkTime';
@@ -57,16 +54,11 @@ export const InviteContactMenuItem = (): JSX.Element | null => {
5754

5855
export const MarkConversationUnreadMenuItem = (): JSX.Element | null => {
5956
const conversationId = useConvoIdFromContext();
60-
const isMessagesSection = useIsMessageSection();
6157
const isPrivate = useIsPrivate(conversationId);
6258
const isPrivateAndFriend = useIsPrivateAndFriend(conversationId);
6359
const isMessageRequestShown = useIsMessageRequestOverlayShown();
6460

65-
if (
66-
isMessagesSection &&
67-
!isMessageRequestShown &&
68-
(!isPrivate || (isPrivate && isPrivateAndFriend))
69-
) {
61+
if (!isMessageRequestShown && (!isPrivate || (isPrivate && isPrivateAndFriend))) {
7062
const conversation = ConvoHub.use().get(conversationId);
7163

7264
const markUnread = () => {

‎ts/components/menuAndSettingsHooks/UseTogglePinConversationHandler.tsx‎

Lines changed: 2 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -14,14 +14,10 @@ import {
1414
} from '../dialog/SessionProInfoModal';
1515
import { Constants } from '../../session';
1616
import { getPinnedConversationsCount } from '../../state/selectors/conversations';
17-
import {
18-
useIsMessageRequestOverlayShown,
19-
useIsMessageSection,
20-
} from '../../state/selectors/section';
17+
import { useIsMessageRequestOverlayShown } from '../../state/selectors/section';
2118
import { useCurrentUserHasPro } from '../../hooks/useHasPro';
2219

2320
function useShowPinUnpin(conversationId: string) {
24-
const isMessagesSection = useIsMessageSection();
2521
const isPrivateAndFriend = useIsPrivateAndFriend(conversationId);
2622
const isPrivate = useIsPrivate(conversationId);
2723
const isMessageRequest = useIsMessageRequestOverlayShown();
@@ -39,9 +35,7 @@ function useShowPinUnpin(conversationId: string) {
3935
return false;
4036
}
4137

42-
return (
43-
isMessagesSection && !isMessageRequest && (!isPrivate || (isPrivate && isPrivateAndFriend))
44-
);
38+
return !isMessageRequest && (!isPrivate || (isPrivate && isPrivateAndFriend));
4539
}
4640

4741
export function useTogglePinConversationHandler(id: string) {

‎ts/components/menuAndSettingsHooks/usePinUnpin.ts‎

Lines changed: 2 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -5,13 +5,9 @@ import {
55
useIsPrivate,
66
useIsPrivateAndFriend,
77
} from '../../hooks/useParamSelector';
8-
import {
9-
useIsMessageRequestOverlayShown,
10-
useIsMessageSection,
11-
} from '../../state/selectors/section';
8+
import { useIsMessageRequestOverlayShown } from '../../state/selectors/section';
129

1310
export function useShowPinUnpin(conversationId: string) {
14-
const isMessagesSection = useIsMessageSection();
1511
const isPrivateAndFriend = useIsPrivateAndFriend(conversationId);
1612
const isPrivate = useIsPrivate(conversationId);
1713
const isMessageRequest = useIsMessageRequestOverlayShown();
@@ -29,7 +25,5 @@ export function useShowPinUnpin(conversationId: string) {
2925
return false;
3026
}
3127

32-
return (
33-
isMessagesSection && !isMessageRequest && (!isPrivate || (isPrivate && isPrivateAndFriend))
34-
);
28+
return !isMessageRequest && (!isPrivate || (isPrivate && isPrivateAndFriend));
3529
}

0 commit comments

Comments
 (0)