diff options
Diffstat (limited to 'src/screens/Search')
| -rw-r--r-- | src/screens/Search/Explore.tsx | 2 | ||||
| -rw-r--r-- | src/screens/Search/modules/ExploreSuggestedAccounts.tsx | 74 | ||||
| -rw-r--r-- | src/screens/Search/util/useSuggestedUsers.ts | 9 |
3 files changed, 16 insertions, 69 deletions
diff --git a/src/screens/Search/Explore.tsx b/src/screens/Search/Explore.tsx index baf69cd7f..cefe68b01 100644 --- a/src/screens/Search/Explore.tsx +++ b/src/screens/Search/Explore.tsx @@ -66,9 +66,9 @@ import { import {ListSparkle_Stroke2_Corner0_Rounded as ListSparkle} from '#/components/icons/ListSparkle' import {StarterPack} from '#/components/icons/StarterPack' import {UserCircle_Stroke2_Corner0_Rounded as Person} from '#/components/icons/UserCircle' +import {boostInterests} from '#/components/InterestTabs' import {Loader} from '#/components/Loader' import * as ProfileCard from '#/components/ProfileCard' -import {boostInterests} from '#/components/ProgressGuide/FollowDialog' import {SubtleHover} from '#/components/SubtleHover' import {Text} from '#/components/Typography' import * as ModuleHeader from './components/ModuleHeader' diff --git a/src/screens/Search/modules/ExploreSuggestedAccounts.tsx b/src/screens/Search/modules/ExploreSuggestedAccounts.tsx index fd37544f4..71bfd6547 100644 --- a/src/screens/Search/modules/ExploreSuggestedAccounts.tsx +++ b/src/screens/Search/modules/ExploreSuggestedAccounts.tsx @@ -14,11 +14,9 @@ import { } from '#/screens/Onboarding/state' import {useTheme} from '#/alf' import {atoms as a} from '#/alf' -import {Button} from '#/components/Button' +import {boostInterests, InterestTabs} from '#/components/InterestTabs' import * as ProfileCard from '#/components/ProfileCard' -import {boostInterests, Tabs} from '#/components/ProgressGuide/FollowDialog' import {SubtleHover} from '#/components/SubtleHover' -import {Text} from '#/components/Typography' import type * as bsky from '#/types/bsky' export function useLoadEnoughProfiles({ @@ -59,10 +57,12 @@ export function SuggestedAccountsTabBar({ selectedInterest, onSelectInterest, hideDefaultTab, + defaultTabLabel, }: { selectedInterest: string | null onSelectInterest: (interest: string | null) => void hideDefaultTab?: boolean + defaultTabLabel?: string }) { const {_} = useLingui() const interestsDisplayNames = useInterestsDisplayNames() @@ -71,9 +71,10 @@ export function SuggestedAccountsTabBar({ const interests = Object.keys(interestsDisplayNames) .sort(boostInterests(popularInterests)) .sort(boostInterests(personalizedInterests)) + return ( <BlockDrawerGesture> - <Tabs + <InterestTabs interests={hideDefaultTab ? interests : ['all', ...interests]} selectedInterest={ selectedInterest || (hideDefaultTab ? interests[0] : 'all') @@ -86,82 +87,19 @@ export function SuggestedAccountsTabBar({ ) onSelectInterest(tab === 'all' ? null : tab) }} - hasSearchText={false} interestsDisplayNames={ hideDefaultTab ? interestsDisplayNames : { - all: _(msg`For You`), + all: defaultTabLabel || _(msg`For You`), ...interestsDisplayNames, } } - TabComponent={Tab} - contentContainerStyle={[ - { - // visual alignment - paddingLeft: a.px_md.paddingLeft, - }, - ]} /> </BlockDrawerGesture> ) } -let Tab = ({ - onSelectTab, - interest, - active, - index, - interestsDisplayName, - onLayout, -}: { - onSelectTab: (index: number) => void - interest: string - active: boolean - index: number - interestsDisplayName: string - onLayout: (index: number, x: number, width: number) => void -}): React.ReactNode => { - const t = useTheme() - const {_} = useLingui() - const activeText = active ? _(msg` (active)`) : '' - return ( - <View - key={interest} - onLayout={e => - onLayout(index, e.nativeEvent.layout.x, e.nativeEvent.layout.width) - }> - <Button - label={_(msg`Search for "${interestsDisplayName}"${activeText}`)} - onPress={() => onSelectTab(index)}> - {({hovered, pressed, focused}) => ( - <View - style={[ - a.rounded_full, - a.px_lg, - a.py_sm, - a.border, - active || hovered || pressed || focused - ? [t.atoms.bg_contrast_25, t.atoms.border_contrast_medium] - : [t.atoms.bg, t.atoms.border_contrast_low], - ]}> - <Text - style={[ - a.font_medium, - active || hovered || pressed || focused - ? t.atoms.text - : t.atoms.text_contrast_medium, - ]}> - {interestsDisplayName} - </Text> - </View> - )} - </Button> - </View> - ) -} -Tab = memo(Tab) - /** * Profile card for suggested accounts. Note: border is on the bottom edge */ diff --git a/src/screens/Search/util/useSuggestedUsers.ts b/src/screens/Search/util/useSuggestedUsers.ts index aa29dad8c..9ca2c558a 100644 --- a/src/screens/Search/util/useSuggestedUsers.ts +++ b/src/screens/Search/util/useSuggestedUsers.ts @@ -11,6 +11,7 @@ import {useInterestsDisplayNames} from '#/screens/Onboarding/state' export function useSuggestedUsers({ category = null, search = false, + overrideInterests, }: { category?: string | null /** @@ -18,11 +19,17 @@ export function useSuggestedUsers({ * based on the user's "app language setting */ search?: boolean + /** + * In onboarding, interests haven't been saved to prefs yet, so we need to + * pass them down through here + */ + overrideInterests?: string[] }) { const interestsDisplayNames = useInterestsDisplayNames() const curated = useGetSuggestedUsersQuery({ enabled: !search, category, + overrideInterests, }) const searched = useActorSearchPaginated({ enabled: !!search, @@ -43,6 +50,7 @@ export function useSuggestedUsers({ isLoading: searched.isLoading, error: searched.error, isRefetching: searched.isRefetching, + refetch: searched.refetch, } } else { return { @@ -50,6 +58,7 @@ export function useSuggestedUsers({ isLoading: curated.isLoading, error: curated.error, isRefetching: curated.isRefetching, + refetch: curated.refetch, } } }, [curated, searched, search]) |