From e79fb9d2e591775a8793163d29d9d5b1d86bd036 Mon Sep 17 00:00:00 2001
From: Josh Perez <60019601+josh-signal@users.noreply.github.com>
Date: Wed, 2 Feb 2022 10:30:39 -0500
Subject: [PATCH] Fix lost focus when typing in archived message while
 searching

---
 ts/components/LeftPane.stories.tsx            |  3 +++
 .../leftPane/LeftPaneArchiveHelper.tsx        | 24 +++++++++----------
 ts/state/smart/LeftPane.tsx                   |  1 +
 .../leftPane/LeftPaneArchiveHelper_test.ts    |  1 +
 4 files changed, 17 insertions(+), 12 deletions(-)

diff --git a/ts/components/LeftPane.stories.tsx b/ts/components/LeftPane.stories.tsx
index 2c795769a5..cb90aebb5c 100644
--- a/ts/components/LeftPane.stories.tsx
+++ b/ts/components/LeftPane.stories.tsx
@@ -423,6 +423,7 @@ story.add('Archive: no archived conversations', () => (
         archivedConversations: [],
         searchConversation: undefined,
         searchTerm: '',
+        startSearchCounter: 0,
       },
     })}
   />
@@ -436,6 +437,7 @@ story.add('Archive: archived conversations', () => (
         archivedConversations: defaultConversations,
         searchConversation: undefined,
         searchTerm: '',
+        startSearchCounter: 0,
       },
     })}
   />
@@ -449,6 +451,7 @@ story.add('Archive: searching a conversation', () => (
         archivedConversations: defaultConversations,
         searchConversation: undefined,
         searchTerm: '',
+        startSearchCounter: 0,
       },
     })}
   />
diff --git a/ts/components/leftPane/LeftPaneArchiveHelper.tsx b/ts/components/leftPane/LeftPaneArchiveHelper.tsx
index 7064186c41..ad71787eeb 100644
--- a/ts/components/leftPane/LeftPaneArchiveHelper.tsx
+++ b/ts/components/leftPane/LeftPaneArchiveHelper.tsx
@@ -13,7 +13,7 @@ import { RowType } from '../ConversationList';
 import type { PropsData as ConversationListItemPropsType } from '../conversationList/ConversationListItem';
 import type { LocalizerType } from '../../types/Util';
 import type { ConversationType } from '../../state/ducks/conversations';
-import { LeftPaneSearchInput } from '../LeftPaneSearchInput';
+import { LeftPaneMainSearchInput } from '../LeftPaneMainSearchInput';
 import type { LeftPaneSearchPropsType } from './LeftPaneSearchHelper';
 import { LeftPaneSearchHelper } from './LeftPaneSearchHelper';
 
@@ -21,6 +21,7 @@ type LeftPaneArchiveBasePropsType = {
   archivedConversations: ReadonlyArray<ConversationListItemPropsType>;
   searchConversation: undefined | ConversationType;
   searchTerm: string;
+  startSearchCounter: number;
 };
 
 export type LeftPaneArchivePropsType =
@@ -36,12 +37,15 @@ export class LeftPaneArchiveHelper extends LeftPaneHelper<LeftPaneArchivePropsTy
 
   private readonly searchHelper: undefined | LeftPaneSearchHelper;
 
+  private readonly startSearchCounter: number;
+
   constructor(props: Readonly<LeftPaneArchivePropsType>) {
     super();
 
     this.archivedConversations = props.archivedConversations;
     this.searchConversation = props.searchConversation;
     this.searchTerm = props.searchTerm;
+    this.startSearchCounter = props.startSearchCounter;
 
     if ('conversationResults' in props) {
       this.searchHelper = new LeftPaneSearchHelper(props);
@@ -72,6 +76,7 @@ export class LeftPaneArchiveHelper extends LeftPaneHelper<LeftPaneArchivePropsTy
   }
 
   override getSearchInput({
+    clearConversationSearch,
     clearSearch,
     i18n,
     updateSearchTerm,
@@ -86,19 +91,14 @@ export class LeftPaneArchiveHelper extends LeftPaneHelper<LeftPaneArchivePropsTy
     }
 
     return (
-      <LeftPaneSearchInput
+      <LeftPaneMainSearchInput
+        clearConversationSearch={clearConversationSearch}
+        clearSearch={clearSearch}
         i18n={i18n}
-        onChangeValue={newValue => {
-          updateSearchTerm(newValue);
-        }}
-        onClear={() => {
-          clearSearch();
-        }}
-        ref={el => {
-          el?.focus();
-        }}
         searchConversation={this.searchConversation}
-        value={this.searchTerm}
+        searchTerm={this.searchTerm}
+        startSearchCounter={this.startSearchCounter}
+        updateSearchTerm={updateSearchTerm}
       />
     );
   }
diff --git a/ts/state/smart/LeftPane.tsx b/ts/state/smart/LeftPane.tsx
index 701155036c..f1d9fd66ab 100644
--- a/ts/state/smart/LeftPane.tsx
+++ b/ts/state/smart/LeftPane.tsx
@@ -107,6 +107,7 @@ const getModeSpecificProps = (
           archivedConversations,
           searchConversation,
           searchTerm,
+          startSearchCounter: getStartSearchCounter(state),
           ...(searchConversation && searchTerm ? getSearchResults(state) : {}),
         };
       }
diff --git a/ts/test-node/components/leftPane/LeftPaneArchiveHelper_test.ts b/ts/test-node/components/leftPane/LeftPaneArchiveHelper_test.ts
index b2252a1a57..31a908946d 100644
--- a/ts/test-node/components/leftPane/LeftPaneArchiveHelper_test.ts
+++ b/ts/test-node/components/leftPane/LeftPaneArchiveHelper_test.ts
@@ -18,6 +18,7 @@ describe('LeftPaneArchiveHelper', () => {
     archivedConversations: [],
     searchConversation: undefined,
     searchTerm: '',
+    startSearchCounter: 0,
   };
 
   const searchingDefaults = {