diff --git a/src/view/screens/Search/Explore.tsx b/src/view/screens/Search/Explore.tsx index 899afd8abe..e2a76a71b5 100644 --- a/src/view/screens/Search/Explore.tsx +++ b/src/view/screens/Search/Explore.tsx @@ -26,37 +26,45 @@ import { FeedFeedLoadingPlaceholder, ProfileCardFeedLoadingPlaceholder, } from 'view/com/util/LoadingPlaceholder' -import {atoms as a, useTheme} from '#/alf' +import {atoms as a, useTheme, ViewStyleProp} from '#/alf' import {Button} from '#/components/Button' import {ArrowBottom_Stroke2_Corner0_Rounded as ArrowBottom} from '#/components/icons/Arrow' import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfo} from '#/components/icons/CircleInfo' +import {Props as SVGIconProps} from '#/components/icons/common' +import {ListSparkle_Stroke2_Corner0_Rounded as ListSparkle} from '#/components/icons/ListSparkle' +import {UserCircle_Stroke2_Corner0_Rounded as Person} from '#/components/icons/UserCircle' import {Loader} from '#/components/Loader' import {Text} from '#/components/Typography' function SuggestedItemsHeader({ title, description, + style, + icon: Icon, }: { title: string description: string -}) { + icon: React.ComponentType +} & ViewStyleProp) { const t = useTheme() return ( - - - {title} - + + + + {title} + {description} @@ -218,6 +226,8 @@ type ExploreScreenItems = key: string title: string description: string + style?: ViewStyleProp['style'] + icon: React.ComponentType } | { type: 'profile' @@ -314,6 +324,7 @@ export function Explore() { description: _( msg`Follow more accounts to get connected to your interests and build your network.`, ), + icon: Person, }, ] @@ -361,6 +372,8 @@ export function Explore() { description: _( msg`Custom feeds built by the community bring you new experiences and help you find the content you love.`, ), + style: [a.pt_5xl], + icon: ListSparkle, }) if (feeds && preferences) { @@ -446,6 +459,8 @@ export function Explore() { ) }