diff --git a/src/screens/Search/components/SearchHistory.tsx b/src/screens/Search/components/SearchHistory.tsx
index f49fadf0d5..325591c717 100644
--- a/src/screens/Search/components/SearchHistory.tsx
+++ b/src/screens/Search/components/SearchHistory.tsx
@@ -1,15 +1,15 @@
-import {Pressable, ScrollView, View} from 'react-native'
+import {ScrollView, View} from 'react-native'
import {moderateProfile, type ModerationOpts} from '@atproto/api'
import {Trans, useLingui} from '@lingui/react/macro'
-import {createHitslop, HITSLOP_10} from '#/lib/constants'
+import {createHitslop} from '#/lib/constants'
import {makeProfileLink} from '#/lib/routes/links'
import {sanitizeDisplayName} from '#/lib/strings/display-names'
import {sanitizeHandle} from '#/lib/strings/handles'
import {useModerationOpts} from '#/state/preferences/moderation-opts'
import {UserAvatar} from '#/view/com/util/UserAvatar'
import {BlockDrawerGesture} from '#/view/shell/BlockDrawerGesture'
-import {atoms as a} from '#/alf'
+import {atoms as a, useTheme} from '#/alf'
import {Button, ButtonIcon} from '#/components/Button'
import {TimesLarge_Stroke2_Corner0_Rounded as XIcon} from '#/components/icons/Times'
import * as Layout from '#/components/Layout'
@@ -35,7 +35,6 @@ export function SearchHistory({
onRemoveProfileClick: (profile: bsky.profile.AnyProfileView) => void
}) {
const ax = useAnalytics()
- const {t: l} = useLingui()
const moderationOpts = useModerationOpts()
return (
@@ -86,31 +85,19 @@ export function SearchHistory({
)}
{searchHistory.length > 0 && (
-
+
{searchHistory.slice(0, 5).map((historyItem, index) => (
-
- {
- ax.metric('search:query', {
- source: 'history',
- })
- onItemClick(historyItem)
- }}
- hitSlop={HITSLOP_10}
- style={[a.flex_1, a.py_sm]}>
- {historyItem}
-
-
-
+ {
+ ax.metric('search:query', {
+ source: 'history',
+ })
+ onItemClick(historyItem)
+ }}
+ onRemove={() => onRemoveItemClick(historyItem)}
+ />
))}
)}
@@ -188,3 +175,49 @@ function RecentProfileItem({
)
}
+
+function RecentSearchItem({
+ onPress,
+ onRemove,
+ historyItem,
+}: {
+ onPress: () => void
+ onRemove: () => void
+ historyItem: string
+}) {
+ const {t: l} = useLingui()
+ const t = useTheme()
+
+ return (
+
+
+
+
+ )
+}