Bluesky app fork with some witchin' additions 馃挮
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

at cope-settings-sync 88 lines 2.2 kB view raw
1import {useCallback} from 'react' 2import {View} from 'react-native' 3import {Sift, type UseSiftReturn} from '@bsky.app/sift' 4 5import {atoms as a, useTheme} from '#/alf' 6import {type AutocompleteItem} from '#/components/Autocomplete/types' 7import {useOnKeyboard} from '#/components/hooks/useOnKeyboard' 8import {Portal} from '#/components/Portal' 9import {IS_WEB} from '#/env' 10import {AutocompleteItemEmoji} from './AutocompleteItemEmoji' 11import {AutocompleteItemProfile} from './AutocompleteItemProfile' 12import {AutocompleteItemSearch} from './AutocompleteItemSearch' 13 14function renderItem( 15 item: Parameters<Parameters<typeof Sift<AutocompleteItem>>[0]['render']>[0], 16) { 17 switch (item.item.type) { 18 case 'profile': 19 return <AutocompleteItemProfile {...item} /> 20 case 'emoji': 21 return <AutocompleteItemEmoji {...item} /> 22 case 'search': 23 return <AutocompleteItemSearch {...item} /> 24 default: 25 return <View /> 26 } 27} 28 29export function Autocomplete({ 30 inverted, 31 sift, 32 data, 33 render = renderItem, 34 onSelect, 35 onDismiss, 36}: { 37 inverted?: boolean 38 sift: UseSiftReturn 39 data: AutocompleteItem[] 40 render?: Parameters<typeof Sift<AutocompleteItem>>[0]['render'] 41 onSelect: (item: AutocompleteItem) => void 42 onDismiss: () => void 43}) { 44 const t = useTheme() 45 46 const updatePosition = useCallback(() => { 47 sift.updatePosition() 48 }, [sift]) 49 50 useOnKeyboard('keyboardDidShow', updatePosition) 51 useOnKeyboard('keyboardDidHide', updatePosition) 52 53 return ( 54 <Portal> 55 <Sift 56 inverted={inverted} 57 sift={sift} 58 data={data} 59 onSelect={onSelect} 60 onDismiss={onDismiss} 61 outerStyle={[ 62 a.rounded_md, 63 a.w_full, 64 t.atoms.shadow_lg, 65 IS_WEB 66 ? { 67 maxWidth: 300, 68 } 69 : {}, 70 ]} 71 innerStyle={[ 72 a.overflow_hidden, 73 a.rounded_md, 74 a.border, 75 t.atoms.border_contrast_low, 76 t.atoms.bg, 77 a.w_full, 78 IS_WEB 79 ? { 80 maxWidth: 300, 81 } 82 : {}, 83 ]} 84 render={render} 85 /> 86 </Portal> 87 ) 88}