diff --git a/src/components/ProfileCard.tsx b/src/components/ProfileCard.tsx new file mode 100644 index 0000000000..d3b1b39dd2 --- /dev/null +++ b/src/components/ProfileCard.tsx @@ -0,0 +1,57 @@ +import React from 'react' +import {View} from 'react-native' +import {AppBskyActorDefs} from '@atproto/api' + +import {sanitizeDisplayName} from 'lib/strings/display-names' +import {sanitizeHandle} from 'lib/strings/handles' +import {UserAvatar} from 'view/com/util/UserAvatar' +import {atoms as a, useTheme} from '#/alf' +import {Link} from '#/components/Link' +import {Text} from '#/components/Typography' + +export function Default({ + profile, +}: { + profile: AppBskyActorDefs.ProfileViewDetailed +}) { + const t = useTheme() + + const handle = `@${sanitizeHandle(profile.handle)}` + const name = + profile.displayName != null && profile.displayName !== '' + ? sanitizeDisplayName(profile.displayName) + : handle + + return ( + + + + + {name} + + {handle} + + + + {profile.description && ( + {profile.description} + )} + + ) +} + +function Wrapper({did, children}: {did: string; children: React.ReactNode}) { + return ( + + {children} + + ) +} diff --git a/src/screens/StarterPack/StarterPackLandingScreen.tsx b/src/screens/StarterPack/StarterPackLandingScreen.tsx index 9b122b820f..c79748f1ca 100644 --- a/src/screens/StarterPack/StarterPackLandingScreen.tsx +++ b/src/screens/StarterPack/StarterPackLandingScreen.tsx @@ -12,7 +12,6 @@ import { import {useResolveDidQuery} from 'state/queries/resolve-uri' import {useStarterPackQuery} from 'state/queries/useStarterPackQuery' import {LoggedOutScreenState} from 'view/com/auth/LoggedOut' -import {ProfileCard} from 'view/com/profile/ProfileCard' import {CenteredView} from 'view/com/util/Views' import {Logo} from 'view/icons/Logo' import {atoms as a, useTheme} from '#/alf' @@ -21,6 +20,7 @@ import {Divider} from '#/components/Divider' import * as FeedCard from '#/components/FeedCard' import {LinearGradientBackground} from '#/components/LinearGradientBackground' import {ListMaybePlaceholder} from '#/components/Lists' +import {Default as ProfileCardInner} from '#/components/ProfileCard' import {Text} from '#/components/Typography' function parseStarterPackHttpUri(uri: string): {name?: string; rkey?: string} { @@ -93,7 +93,6 @@ function LandingScreenInner({ const {isTabletOrDesktop} = useWebMediaQueries() const listItemsCount = starterPack.list?.listItemCount ?? 0 - const sampleProfiles = listItemsSample?.map(item => item.subject) if (!AppBskyGraphStarterpack.isRecord(record)) { return null @@ -197,7 +196,7 @@ function LandingScreenInner({ ) : null} - {Boolean(sampleProfiles?.length) && ( + {Boolean(listItemsSample?.length) && ( {feeds?.length ? ( @@ -227,20 +226,20 @@ function LandingScreenInner({ )} - - {starterPack.listItemsSample?.map(item => ( - - ))} + + {starterPack.listItemsSample + ?.slice(0, 8) + .map((item, index) => ( + + + + ))} )}