diff --git a/src/view/shell/desktop/Search.tsx b/src/view/shell/desktop/Search.tsx
index 6b7a0a4176..6653c88eac 100644
--- a/src/view/shell/desktop/Search.tsx
+++ b/src/view/shell/desktop/Search.tsx
@@ -1,17 +1,90 @@
import React from 'react'
-import {TextInput, View, StyleSheet, TouchableOpacity} from 'react-native'
+import {
+ ViewStyle,
+ TextInput,
+ View,
+ StyleSheet,
+ TouchableOpacity,
+} from 'react-native'
import {useNavigation, StackActions} from '@react-navigation/native'
-import {AppBskyActorDefs} from '@atproto/api'
-
+import {AppBskyActorDefs, moderateProfile} from '@atproto/api'
import {observer} from 'mobx-react-lite'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
+
+import {s} from '#/lib/styles'
+import {sanitizeDisplayName} from '#/lib/strings/display-names'
+import {sanitizeHandle} from '#/lib/strings/handles'
+import {makeProfileLink} from '#/lib/routes/links'
+import {Link} from '#/view/com/util/Link'
import {usePalette} from 'lib/hooks/usePalette'
import {MagnifyingGlassIcon2} from 'lib/icons'
import {NavigationProp} from 'lib/routes/types'
-import {ProfileCard} from 'view/com/profile/ProfileCard'
import {Text} from 'view/com/util/text/Text'
-import {Trans, msg} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
+import {UserAvatar} from '#/view/com/util/UserAvatar'
import {useActorSearch} from '#/state/queries/actor-autocomplete'
+import {useModerationOpts} from '#/state/queries/preferences'
+
+export function SearchResultCard({
+ profile,
+ style,
+}: {
+ profile: AppBskyActorDefs.ProfileViewBasic
+ style: ViewStyle
+}) {
+ const pal = usePalette('default')
+ const moderationOpts = useModerationOpts()
+
+ if (!moderationOpts) {
+ // TODO
+ return null
+ }
+
+ const moderation = moderateProfile(profile, moderationOpts)
+
+ return (
+
+
+
+
+
+ {sanitizeDisplayName(
+ profile.displayName || sanitizeHandle(profile.handle),
+ moderation.profile,
+ )}
+
+
+ {sanitizeHandle(profile.handle, '@')}
+
+
+
+
+ )
+}
export const DesktopSearch = observer(function DesktopSearch() {
const {_} = useLingui()
@@ -107,7 +180,11 @@ export const DesktopSearch = observer(function DesktopSearch() {
{searchResults.length ? (
<>
{searchResults.map((item, i) => (
-
+
))}
>
) : (
@@ -157,15 +234,11 @@ const styles = StyleSheet.create({
paddingVertical: 7,
},
resultsContainer: {
- // @ts-ignore supported by web
- // position: 'fixed',
marginTop: 10,
-
flexDirection: 'column',
width: 300,
borderWidth: 1,
borderRadius: 6,
- paddingVertical: 4,
},
noResults: {
textAlign: 'center',