Rework search suggestions for performance (#492)

src/view/screens/Search.web.tsx

@@ -1,10 +1,8 @@
 import React from 'react'
-import {StyleSheet, View} from 'react-native'
 import {SearchUIModel} from 'state/models/ui/search'
 import {FoafsModel} from 'state/models/discovery/foafs'
 import {SuggestedActorsModel} from 'state/models/discovery/suggested-actors'
 import {withAuthRequired} from 'view/com/auth/withAuthRequired'
-import {ScrollView} from 'view/com/util/Views'
 import {Suggestions} from 'view/com/search/Suggestions'
 import {SearchResults} from 'view/com/search/SearchResults'
 import {observer} from 'mobx-react-lite'
@@ -13,15 +11,12 @@ import {
   SearchTabNavigatorParams,
 } from 'lib/routes/types'
 import {useStores} from 'state/index'
-import {s} from 'lib/styles'
-import {usePalette} from 'lib/hooks/usePalette'
 import * as Mobile from './SearchMobile'
 import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
 
 type Props = NativeStackScreenProps<SearchTabNavigatorParams, 'Search'>
 export const SearchScreen = withAuthRequired(
   observer(({navigation, route}: Props) => {
-    const pal = usePalette('default')
     const store = useStores()
     const params = route.params || {}
     const foafs = React.useMemo<FoafsModel>(
@@ -59,58 +54,6 @@ export const SearchScreen = withAuthRequired(
       return <Mobile.SearchScreen navigation={navigation} route={route} />
     }
 
-    return (
-      <ScrollView
-        testID="searchScrollView"
-        style={[pal.view, styles.container]}
-        scrollEventThrottle={100}>
-        <Suggestions foafs={foafs} suggestedActors={suggestedActors} />
-        <View style={s.footerSpacer} />
-      </ScrollView>
-    )
+    return <Suggestions foafs={foafs} suggestedActors={suggestedActors} />
   }),
 )
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-  },
-
-  header: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    paddingHorizontal: 12,
-    paddingTop: 4,
-    marginBottom: 14,
-  },
-  headerMenuBtn: {
-    width: 40,
-    height: 30,
-    marginLeft: 6,
-  },
-  headerSearchContainer: {
-    flex: 1,
-    flexDirection: 'row',
-    alignItems: 'center',
-    borderRadius: 30,
-    paddingHorizontal: 12,
-    paddingVertical: 8,
-  },
-  headerSearchIcon: {
-    marginRight: 6,
-    alignSelf: 'center',
-  },
-  headerSearchInput: {
-    flex: 1,
-    fontSize: 17,
-  },
-  headerCancelBtn: {
-    width: 60,
-    paddingLeft: 10,
-  },
-
-  searchPrompt: {
-    textAlign: 'center',
-    paddingTop: 10,
-  },
-})