Bluesky app fork with some witchin' additions 💫
0
fork

Configure Feed

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

handle each possible loading state (#4617)

authored by

Hailey and committed by
GitHub
e0ac7d5b f64245c1

+21 -7
+12 -4
src/screens/StarterPack/Wizard/StepFeeds.tsx
··· 32 32 const throttledQuery = useThrottledValue(query, 500) 33 33 const {screenReaderEnabled} = useA11y() 34 34 35 - const {data: savedFeedsAndLists} = useSavedFeeds() 35 + const {data: savedFeedsAndLists, isLoading: isLoadingSavedFeeds} = 36 + useSavedFeeds() 36 37 const savedFeeds = savedFeedsAndLists?.feeds 37 38 .filter(f => f.type === 'feed' && f.view.uri !== DISCOVER_FEED_URI) 38 39 .map(f => f.view) as AppBskyFeedDefs.GeneratorView[] 39 40 40 - const {data: popularFeedsPages, fetchNextPage} = useGetPopularFeedsQuery({ 41 + const { 42 + data: popularFeedsPages, 43 + fetchNextPage, 44 + isLoading: isLoadingPopularFeeds, 45 + } = useGetPopularFeedsQuery({ 41 46 limit: 30, 42 47 }) 43 48 const popularFeeds = popularFeedsPages?.pages.flatMap(p => p.feeds) ?? [] ··· 45 50 popularFeeds.filter(f => !savedFeeds.some(sf => sf.uri === f.uri)), 46 51 ) 47 52 48 - const {data: searchedFeeds, isLoading: isLoadingSearch} = 53 + const {data: searchedFeeds, isFetching: isFetchingSearchedFeeds} = 49 54 useSearchPopularFeedsQuery({q: throttledQuery}) 55 + 56 + const isLoading = 57 + isLoadingSavedFeeds || isLoadingPopularFeeds || isFetchingSearchedFeeds 50 58 51 59 const renderItem = ({ 52 60 item, ··· 90 98 style={{flex: 1}} 91 99 ListEmptyComponent={ 92 100 <View style={[a.flex_1, a.align_center, a.mt_lg, a.px_lg]}> 93 - {isLoadingSearch ? ( 101 + {isLoading ? ( 94 102 <Loader size="lg" /> 95 103 ) : ( 96 104 <Text
+9 -3
src/screens/StarterPack/Wizard/StepProfiles.tsx
··· 31 31 const [query, setQuery] = useState('') 32 32 const {screenReaderEnabled} = useA11y() 33 33 34 - const {data: topPages, fetchNextPage} = useActorSearchPaginated({ 34 + const { 35 + data: topPages, 36 + fetchNextPage, 37 + isLoading: isLoadingTopPages, 38 + } = useActorSearchPaginated({ 35 39 query: encodeURIComponent('*'), 36 40 }) 37 41 const topFollowers = topPages?.pages.flatMap(p => p.actors) 38 42 39 - const {data: results, isLoading: isLoadingResults} = 43 + const {data: results, isFetching: isFetchingResults} = 40 44 useActorAutocompleteQuery(query, true, 12) 45 + 46 + const isLoading = isLoadingTopPages || isFetchingResults 41 47 42 48 const renderItem = ({ 43 49 item, ··· 80 86 onEndReachedThreshold={isNative ? 2 : 0.25} 81 87 ListEmptyComponent={ 82 88 <View style={[a.flex_1, a.align_center, a.mt_lg, a.px_lg]}> 83 - {isLoadingResults ? ( 89 + {isLoading ? ( 84 90 <Loader size="lg" /> 85 91 ) : ( 86 92 <Text