diff options
Diffstat (limited to 'src/components/ProfileCard.tsx')
-rw-r--r-- | src/components/ProfileCard.tsx | 39 |
1 files changed, 22 insertions, 17 deletions
diff --git a/src/components/ProfileCard.tsx b/src/components/ProfileCard.tsx index 6f6d68049..b208903b4 100644 --- a/src/components/ProfileCard.tsx +++ b/src/components/ProfileCard.tsx @@ -220,8 +220,10 @@ export function NameAndHandlePlaceholder() { export function Description({ profile: profileUnshadowed, + numberOfLines = 3, }: { profile: AppBskyActorDefs.ProfileViewDetailed + numberOfLines?: number }) { const profile = useProfileShadow(profileUnshadowed) const {description} = profile @@ -244,31 +246,34 @@ export function Description({ <RichText value={rt} style={[a.leading_snug]} - numberOfLines={3} + numberOfLines={numberOfLines} disableLinks /> </View> ) } -export function DescriptionPlaceholder() { +export function DescriptionPlaceholder({ + numberOfLines = 3, +}: { + numberOfLines?: number +}) { const t = useTheme() return ( - <View style={[a.gap_xs]}> - <View - style={[a.rounded_xs, a.w_full, t.atoms.bg_contrast_50, {height: 12}]} - /> - <View - style={[a.rounded_xs, a.w_full, t.atoms.bg_contrast_50, {height: 12}]} - /> - <View - style={[ - a.rounded_xs, - a.w_full, - t.atoms.bg_contrast_50, - {height: 12, width: 100}, - ]} - /> + <View style={[{gap: 8}]}> + {Array(numberOfLines) + .fill(0) + .map((_, i) => ( + <View + key={i} + style={[ + a.rounded_xs, + a.w_full, + t.atoms.bg_contrast_50, + {height: 12, width: i + 1 === numberOfLines ? '60%' : '100%'}, + ]} + /> + ))} </View> ) } |