Skip to content

Commit 13ff8fd

Browse files
scottnonnenberg-signalscottnonnenberg-signal
committed
Merge #6817 
2 parents 26140ee + fed6bbf commit 13ff8fd

File tree

13 files changed

+158
-17
lines changed

13 files changed

+158
-17
lines changed

‎ts/components/LeftPane.stories.tsx‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,7 @@ const defaultConversations: Array<ConversationType> = [
6262
];
6363

6464
const defaultSearchProps = {
65+
isSearchingGlobally: true,
6566
searchConversation: undefined,
6667
searchDisabled: false,
6768
searchTerm: 'hello',
@@ -145,6 +146,8 @@ const useProps = (overrideProps: OverridePropsType = {}): PropsType => {
145146
composeReplaceAvatar: action('composeReplaceAvatar'),
146147
composeSaveAvatarToDisk: action('composeSaveAvatarToDisk'),
147148
createGroup: action('createGroup'),
149+
endConversationSearch: action('endConversationSearch'),
150+
endSearch: action('endSearch'),
148151
getPreferredBadge: () => undefined,
149152
hasFailedStorySends: false,
150153
hasPendingUpdate: false,
@@ -609,6 +612,7 @@ export function ArchiveNoArchivedConversations(): JSX.Element {
609612
modeSpecificProps: {
610613
mode: LeftPaneMode.Archive,
611614
archivedConversations: [],
615+
isSearchingGlobally: false,
612616
searchConversation: undefined,
613617
searchTerm: '',
614618
startSearchCounter: 0,
@@ -625,6 +629,7 @@ export function ArchiveArchivedConversations(): JSX.Element {
625629
modeSpecificProps: {
626630
mode: LeftPaneMode.Archive,
627631
archivedConversations: defaultConversations,
632+
isSearchingGlobally: false,
628633
searchConversation: undefined,
629634
searchTerm: '',
630635
startSearchCounter: 0,
@@ -641,6 +646,7 @@ export function ArchiveSearchingAConversation(): JSX.Element {
641646
modeSpecificProps: {
642647
mode: LeftPaneMode.Archive,
643648
archivedConversations: defaultConversations,
649+
isSearchingGlobally: false,
644650
searchConversation: undefined,
645651
searchTerm: '',
646652
startSearchCounter: 0,

‎ts/components/LeftPane.tsx‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -120,6 +120,8 @@ export type PropsType = {
120120
composeReplaceAvatar: ReplaceAvatarActionType;
121121
composeSaveAvatarToDisk: SaveAvatarToDiskActionType;
122122
createGroup: () => void;
123+
endConversationSearch: () => void;
124+
endSearch: () => void;
123125
navTabsCollapsed: boolean;
124126
openUsernameReservationModal: () => void;
125127
onOutgoingAudioCallInConversation: (conversationId: string) => void;
@@ -183,6 +185,8 @@ export function LeftPane({
183185
composeSaveAvatarToDisk,
184186
crashReportCount,
185187
createGroup,
188+
endConversationSearch,
189+
endSearch,
186190
getPreferredBadge,
187191
hasExpiredDialog,
188192
hasFailedStorySends,
@@ -704,6 +708,8 @@ export function LeftPane({
704708
{helper.getSearchInput({
705709
clearConversationSearch,
706710
clearSearch,
711+
endConversationSearch,
712+
endSearch,
707713
i18n,
708714
onChangeComposeSearchTerm: event => {
709715
setComposeSearchTerm(event.target.value);

‎ts/components/LeftPaneSearchInput.tsx‎

Lines changed: 22 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,10 @@ type PropsType = {
1515
clearConversationSearch: () => void;
1616
clearSearch: () => void;
1717
disabled?: boolean;
18+
endConversationSearch: () => void;
19+
endSearch: () => void;
1820
i18n: LocalizerType;
21+
isSearchingGlobally: boolean;
1922
onEnterKeyDown?: (
2023
clearSearch: () => void,
2124
showConversation: ShowConversationType
@@ -31,7 +34,10 @@ export function LeftPaneSearchInput({
3134
clearConversationSearch,
3235
clearSearch,
3336
disabled,
37+
endConversationSearch,
38+
endSearch,
3439
i18n,
40+
isSearchingGlobally,
3541
onEnterKeyDown,
3642
searchConversation,
3743
searchTerm,
@@ -46,6 +52,7 @@ export function LeftPaneSearchInput({
4652
searchConversation?.id
4753
);
4854
const prevSearchCounter = usePrevious(startSearchCounter, startSearchCounter);
55+
const wasSearchingGlobally = usePrevious(false, isSearchingGlobally);
4956

5057
useEffect(() => {
5158
// When user chooses to search in a given conversation we focus the field for them
@@ -56,14 +63,19 @@ export function LeftPaneSearchInput({
5663
inputRef.current?.focus();
5764
}
5865
// When user chooses to start a new search, we focus the field
59-
if (startSearchCounter !== prevSearchCounter) {
66+
if (
67+
(isSearchingGlobally && !wasSearchingGlobally) ||
68+
startSearchCounter !== prevSearchCounter
69+
) {
6070
inputRef.current?.select();
6171
}
6272
}, [
6373
prevSearchConversationId,
6474
prevSearchCounter,
6575
searchConversation,
6676
startSearchCounter,
77+
isSearchingGlobally,
78+
wasSearchingGlobally,
6779
]);
6880

6981
const changeValue = (nextSearchTerm: string) => {
@@ -82,11 +94,6 @@ export function LeftPaneSearchInput({
8294
}
8395
};
8496

85-
const clearAndFocus = () => {
86-
clearSearch();
87-
inputRef.current?.focus();
88-
};
89-
9097
const label = searchConversation ? i18n('icu:searchIn') : i18n('icu:search');
9198

9299
return (
@@ -98,7 +105,7 @@ export function LeftPaneSearchInput({
98105
moduleClassName="LeftPaneSearchInput"
99106
onBlur={() => {
100107
if (!searchConversation && !searchTerm) {
101-
clearSearch();
108+
endSearch();
102109
}
103110
}}
104111
onKeyDown={event => {
@@ -112,10 +119,14 @@ export function LeftPaneSearchInput({
112119
changeValue(event.currentTarget.value);
113120
}}
114121
onClear={() => {
115-
if (searchConversation && searchTerm) {
116-
changeValue('');
122+
if (searchTerm) {
123+
clearSearch();
124+
inputRef.current?.focus();
125+
} else if (searchConversation) {
126+
endConversationSearch();
127+
inputRef.current?.focus();
117128
} else {
118-
clearAndFocus();
129+
inputRef.current?.blur();
119130
}
120131
}}
121132
ref={inputRef}
@@ -151,7 +162,7 @@ export function LeftPaneSearchInput({
151162
<button
152163
aria-label={i18n('icu:clearSearch')}
153164
className="LeftPaneSearchInput__in-conversation-pill__x-button"
154-
onClick={clearAndFocus}
165+
onClick={endConversationSearch}
155166
type="button"
156167
/>
157168
</div>

‎ts/components/leftPane/LeftPaneArchiveHelper.tsx‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ import * as KeyboardLayout from '../../services/keyboardLayout';
2323

2424
type LeftPaneArchiveBasePropsType = {
2525
archivedConversations: ReadonlyArray<ConversationListItemPropsType>;
26+
isSearchingGlobally: boolean;
2627
searchConversation: undefined | ConversationType;
2728
searchTerm: string;
2829
startSearchCounter: number;
@@ -35,6 +36,8 @@ export type LeftPaneArchivePropsType =
3536
export class LeftPaneArchiveHelper extends LeftPaneHelper<LeftPaneArchivePropsType> {
3637
private readonly archivedConversations: ReadonlyArray<ConversationListItemPropsType>;
3738

39+
private readonly isSearchingGlobally: boolean;
40+
3841
private readonly searchConversation: undefined | ConversationType;
3942

4043
private readonly searchTerm: string;
@@ -47,6 +50,7 @@ export class LeftPaneArchiveHelper extends LeftPaneHelper<LeftPaneArchivePropsTy
4750
super();
4851

4952
this.archivedConversations = props.archivedConversations;
53+
this.isSearchingGlobally = props.isSearchingGlobally;
5054
this.searchConversation = props.searchConversation;
5155
this.searchTerm = props.searchTerm;
5256
this.startSearchCounter = props.startSearchCounter;
@@ -82,12 +86,16 @@ export class LeftPaneArchiveHelper extends LeftPaneHelper<LeftPaneArchivePropsTy
8286
override getSearchInput({
8387
clearConversationSearch,
8488
clearSearch,
89+
endConversationSearch,
90+
endSearch,
8591
i18n,
8692
updateSearchTerm,
8793
showConversation,
8894
}: Readonly<{
8995
clearConversationSearch: () => unknown;
9096
clearSearch: () => unknown;
97+
endConversationSearch: () => unknown;
98+
endSearch: () => unknown;
9199
i18n: LocalizerType;
92100
updateSearchTerm: (searchTerm: string) => unknown;
93101
showConversation: ShowConversationType;
@@ -100,7 +108,10 @@ export class LeftPaneArchiveHelper extends LeftPaneHelper<LeftPaneArchivePropsTy
100108
<LeftPaneSearchInput
101109
clearConversationSearch={clearConversationSearch}
102110
clearSearch={clearSearch}
111+
endConversationSearch={endConversationSearch}
112+
endSearch={endSearch}
103113
i18n={i18n}
114+
isSearchingGlobally={this.isSearchingGlobally}
104115
searchConversation={this.searchConversation}
105116
searchTerm={this.searchTerm}
106117
showConversation={showConversation}

‎ts/components/leftPane/LeftPaneHelper.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,8 @@ export abstract class LeftPaneHelper<T> {
4040
_: Readonly<{
4141
clearConversationSearch: () => unknown;
4242
clearSearch: () => unknown;
43+
endConversationSearch: () => unknown;
44+
endSearch: () => unknown;
4345
i18n: LocalizerType;
4446
onChangeComposeSearchTerm: (
4547
event: ChangeEvent<HTMLInputElement>

‎ts/components/leftPane/LeftPaneInboxHelper.tsx‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ export type LeftPaneInboxPropsType = {
2525
archivedConversations: ReadonlyArray<ConversationListItemPropsType>;
2626
pinnedConversations: ReadonlyArray<ConversationListItemPropsType>;
2727
isAboutToSearch: boolean;
28+
isSearchingGlobally: boolean;
2829
startSearchCounter: number;
2930
searchDisabled: boolean;
3031
searchTerm: string;
@@ -40,6 +41,8 @@ export class LeftPaneInboxHelper extends LeftPaneHelper<LeftPaneInboxPropsType>
4041

4142
private readonly isAboutToSearch: boolean;
4243

44+
private readonly isSearchingGlobally: boolean;
45+
4346
private readonly startSearchCounter: number;
4447

4548
private readonly searchDisabled: boolean;
@@ -53,6 +56,7 @@ export class LeftPaneInboxHelper extends LeftPaneHelper<LeftPaneInboxPropsType>
5356
archivedConversations,
5457
pinnedConversations,
5558
isAboutToSearch,
59+
isSearchingGlobally,
5660
startSearchCounter,
5761
searchDisabled,
5862
searchTerm,
@@ -64,6 +68,7 @@ export class LeftPaneInboxHelper extends LeftPaneHelper<LeftPaneInboxPropsType>
6468
this.archivedConversations = archivedConversations;
6569
this.pinnedConversations = pinnedConversations;
6670
this.isAboutToSearch = isAboutToSearch;
71+
this.isSearchingGlobally = isSearchingGlobally;
6772
this.startSearchCounter = startSearchCounter;
6873
this.searchDisabled = searchDisabled;
6974
this.searchTerm = searchTerm;
@@ -84,12 +89,16 @@ export class LeftPaneInboxHelper extends LeftPaneHelper<LeftPaneInboxPropsType>
8489
override getSearchInput({
8590
clearConversationSearch,
8691
clearSearch,
92+
endConversationSearch,
93+
endSearch,
8794
i18n,
8895
showConversation,
8996
updateSearchTerm,
9097
}: Readonly<{
9198
clearConversationSearch: () => unknown;
9299
clearSearch: () => unknown;
100+
endConversationSearch: () => unknown;
101+
endSearch: () => unknown;
93102
i18n: LocalizerType;
94103
showConversation: ShowConversationType;
95104
updateSearchTerm: (searchTerm: string) => unknown;
@@ -98,8 +107,11 @@ export class LeftPaneInboxHelper extends LeftPaneHelper<LeftPaneInboxPropsType>
98107
<LeftPaneSearchInput
99108
clearConversationSearch={clearConversationSearch}
100109
clearSearch={clearSearch}
110+
endConversationSearch={endConversationSearch}
111+
endSearch={endSearch}
101112
disabled={this.searchDisabled}
102113
i18n={i18n}
114+
isSearchingGlobally={this.isSearchingGlobally}
103115
searchConversation={this.searchConversation}
104116
searchTerm={this.searchTerm}
105117
showConversation={showConversation}

‎ts/components/leftPane/LeftPaneSearchHelper.tsx‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,7 @@ export type LeftPaneSearchPropsType = {
4444
primarySendsSms: boolean;
4545
searchTerm: string;
4646
startSearchCounter: number;
47+
isSearchingGlobally: boolean;
4748
searchDisabled: boolean;
4849
searchConversation: undefined | ConversationType;
4950
};
@@ -57,6 +58,8 @@ export class LeftPaneSearchHelper extends LeftPaneHelper<LeftPaneSearchPropsType
5758

5859
private readonly contactResults: MaybeLoadedSearchResultsType<ConversationListItemPropsType>;
5960

61+
private readonly isSearchingGlobally: boolean;
62+
6063
private readonly messageResults: MaybeLoadedSearchResultsType<{
6164
id: string;
6265
conversationId: string;
@@ -78,6 +81,7 @@ export class LeftPaneSearchHelper extends LeftPaneHelper<LeftPaneSearchPropsType
7881
constructor({
7982
contactResults,
8083
conversationResults,
84+
isSearchingGlobally,
8185
messageResults,
8286
primarySendsSms,
8387
searchConversation,
@@ -90,6 +94,7 @@ export class LeftPaneSearchHelper extends LeftPaneHelper<LeftPaneSearchPropsType
9094

9195
this.contactResults = contactResults;
9296
this.conversationResults = conversationResults;
97+
this.isSearchingGlobally = isSearchingGlobally;
9398
this.messageResults = messageResults;
9499
this.primarySendsSms = primarySendsSms;
95100
this.searchConversation = searchConversation;
@@ -103,12 +108,16 @@ export class LeftPaneSearchHelper extends LeftPaneHelper<LeftPaneSearchPropsType
103108
override getSearchInput({
104109
clearConversationSearch,
105110
clearSearch,
111+
endConversationSearch,
112+
endSearch,
106113
i18n,
107114
showConversation,
108115
updateSearchTerm,
109116
}: Readonly<{
110117
clearConversationSearch: () => unknown;
111118
clearSearch: () => unknown;
119+
endConversationSearch: () => unknown;
120+
endSearch: () => unknown;
112121
i18n: LocalizerType;
113122
showConversation: ShowConversationType;
114123
updateSearchTerm: (searchTerm: string) => unknown;
@@ -117,8 +126,11 @@ export class LeftPaneSearchHelper extends LeftPaneHelper<LeftPaneSearchPropsType
117126
<LeftPaneSearchInput
118127
clearConversationSearch={clearConversationSearch}
119128
clearSearch={clearSearch}
129+
endConversationSearch={endConversationSearch}
130+
endSearch={endSearch}
120131
disabled={this.searchDisabled}
121132
i18n={i18n}
133+
isSearchingGlobally={this.isSearchingGlobally}
122134
onEnterKeyDown={this.onEnterKeyDown}
123135
searchConversation={this.searchConversation}
124136
searchTerm={this.searchTerm}

0 commit comments

Comments
 (0)