Page MenuHomePhabricator
Files F2902778

D9210.id31215.diff
No OneTemporary
Actions

D9210.id31215.diff
View Options

diff --git a/native/chat/chat-thread-list-search.react.js b/native/chat/chat-thread-list-search.react.js
--- a/native/chat/chat-thread-list-search.react.js
+++ b/native/chat/chat-thread-list-search.react.js
@@ -80,8 +80,38 @@
],
[searchCancelButtonProgress, styles.cancelSearchButtonText],
);
- return (
- <>
+
+ const innerSearchNode = React.useMemo(
+ () => (
+ <Search
+ searchText={searchText}
+ onChangeText={onChangeText}
+ containerStyle={styles.search}
+ onBlur={onBlur}
+ placeholder="Search chats"
+ ref={ref}
+ autoFocus={innerSearchAutoFocus}
+ active={innerSearchActive}
+ />
+ ),
+ [
+ innerSearchActive,
+ innerSearchAutoFocus,
+ onBlur,
+ onChangeText,
+ ref,
+ searchText,
+ styles.search,
+ ],
+ );
+
+ const searchContainer = React.useMemo(
+ () => <AnimatedView style={searchBoxStyle}>{innerSearchNode}</AnimatedView>,
+ [innerSearchNode, searchBoxStyle],
+ );
+
+ const cancelButton = React.useMemo(
+ () => (
<Button
onPress={onSearchCancel}
disabled={searchStatus !== 'active'}
@@ -91,35 +121,24 @@
<Animated.Text style={buttonStyle}>Cancel</Animated.Text>
{/* eslint-enable react-native/no-raw-text */}
</Button>
- <AnimatedView style={searchBoxStyle}>
- <Search
- searchText={searchText}
- onChangeText={onChangeText}
- containerStyle={styles.search}
- onBlur={onBlur}
- placeholder="Search chats"
- ref={ref}
- autoFocus={innerSearchAutoFocus}
- active={innerSearchActive}
- />
- </AnimatedView>
- </>
+ ),
+ [buttonStyle, onSearchCancel, searchStatus, styles.cancelSearchButton],
+ );
+
+ const chatThreadListSearch = React.useMemo(
+ () => (
+ <>
+ {cancelButton}
+ {searchContainer}
+ </>
+ ),
+ [cancelButton, searchContainer],
);
+
+ return chatThreadListSearch;
}
const unboundStyles = {
- icon: {
- fontSize: 28,
- },
- container: {
- flex: 1,
- },
- searchContainer: {
- backgroundColor: 'listBackground',
- display: 'flex',
- justifyContent: 'center',
- flexDirection: 'row',
- },
searchBox: {
flex: 1,
},
@@ -142,10 +161,6 @@
paddingHorizontal: 16,
paddingTop: 8,
},
- flatList: {
- flex: 1,
- backgroundColor: 'listBackground',
- },
};
const ChatThreadListSearch: React.AbstractComponent<
diff --git a/native/chat/chat-thread-list.react.js b/native/chat/chat-thread-list.react.js
--- a/native/chat/chat-thread-list.react.js
+++ b/native/chat/chat-thread-list.react.js
@@ -494,28 +494,6 @@
justifyContent: 'center',
flexDirection: 'row',
},
- searchBox: {
- flex: 1,
- },
- search: {
- marginBottom: 8,
- marginHorizontal: 18,
- marginTop: 16,
- },
- cancelSearchButton: {
- position: 'absolute',
- right: 0,
- top: 0,
- bottom: 0,
- display: 'flex',
- justifyContent: 'center',
- },
- cancelSearchButtonText: {
- color: 'link',
- fontSize: 16,
- paddingHorizontal: 16,
- paddingTop: 8,
- },
flatList: {
flex: 1,
backgroundColor: 'listBackground',

File Metadata

Mime Type
text/plain
Expires
Sun, Oct 6, 6:59 PM (21 h, 37 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2250643
Default Alt Text
D9210.id31215.diff (3 KB)

Event Timeline