fix thread double border (#1251)

zio/stable
Eric Bailey 2023-08-22 12:49:03 -05:00 committed by GitHub
parent 09a445d804
commit 13c11801b9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 17 additions and 7 deletions

View File

@ -156,7 +156,7 @@ export const PostThread = observer(function PostThread({
}, [navigation]) }, [navigation])
const renderItem = React.useCallback( const renderItem = React.useCallback(
({item}: {item: YieldedItem}) => { ({item, index}: {item: YieldedItem; index: number}) => {
if (item === PARENT_SPINNER) { if (item === PARENT_SPINNER) {
return ( return (
<View style={styles.parentSpinner}> <View style={styles.parentSpinner}>
@ -205,11 +205,20 @@ export const PostThread = observer(function PostThread({
</View> </View>
) )
} else if (item instanceof PostThreadItemModel) { } else if (item instanceof PostThreadItemModel) {
return <PostThreadItem item={item} onPostReply={onRefresh} /> const prev = (
index - 1 >= 0 ? posts[index - 1] : undefined
) as PostThreadItemModel
return (
<PostThreadItem
item={item}
onPostReply={onRefresh}
hasPrecedingItem={prev?._showChildReplyLine}
/>
)
} }
return <></> return <></>
}, },
[onRefresh, onPressReply, pal], [onRefresh, onPressReply, pal, posts],
) )
// loading // loading

View File

@ -38,9 +38,11 @@ import {isDesktopWeb} from 'platform/detection'
export const PostThreadItem = observer(function PostThreadItem({ export const PostThreadItem = observer(function PostThreadItem({
item, item,
onPostReply, onPostReply,
hasPrecedingItem,
}: { }: {
item: PostThreadItemModel item: PostThreadItemModel
onPostReply: () => void onPostReply: () => void
hasPrecedingItem: boolean
}) { }) {
const pal = usePalette('default') const pal = usePalette('default')
const store = useStores() const store = useStores()
@ -359,8 +361,7 @@ export const PostThreadItem = observer(function PostThreadItem({
styles.outer, styles.outer,
pal.border, pal.border,
pal.view, pal.view,
item._showParentReplyLine && styles.noTopBorder, item._showParentReplyLine && hasPrecedingItem && styles.noTopBorder,
!item._showChildReplyLine && {borderBottomWidth: 1},
]} ]}
moderation={item.moderation.content}> moderation={item.moderation.content}>
<PostSandboxWarning /> <PostSandboxWarning />
@ -483,7 +484,7 @@ export const PostThreadItem = observer(function PostThreadItem({
<Link <Link
style={[ style={[
styles.loadMore, styles.loadMore,
{borderBottomColor: pal.colors.border}, {borderTopColor: pal.colors.border},
pal.view, pal.view,
]} ]}
href={itemHref} href={itemHref}
@ -600,7 +601,7 @@ const styles = StyleSheet.create({
loadMore: { loadMore: {
flexDirection: 'row', flexDirection: 'row',
justifyContent: 'space-between', justifyContent: 'space-between',
borderBottomWidth: 1, borderTopWidth: 1,
paddingLeft: 80, paddingLeft: 80,
paddingRight: 20, paddingRight: 20,
paddingVertical: 12, paddingVertical: 12,