Fix notification descriptions and render images for your own posts in notifs
parent
b9778b7943
commit
ee8d311795
|
@ -11,6 +11,7 @@ import {ago, pluralize} from '../../../lib/strings'
|
||||||
import {UpIconSolid} from '../../lib/icons'
|
import {UpIconSolid} from '../../lib/icons'
|
||||||
import {Text} from '../util/text/Text'
|
import {Text} from '../util/text/Text'
|
||||||
import {UserAvatar} from '../util/UserAvatar'
|
import {UserAvatar} from '../util/UserAvatar'
|
||||||
|
import {ImageHorzList} from '../util/images/ImageHorzList'
|
||||||
import {ErrorMessage} from '../util/error/ErrorMessage'
|
import {ErrorMessage} from '../util/error/ErrorMessage'
|
||||||
import {Post} from '../post/Post'
|
import {Post} from '../post/Post'
|
||||||
import {Link} from '../util/Link'
|
import {Link} from '../util/Link'
|
||||||
|
@ -181,6 +182,7 @@ export const FeedItem = observer(function FeedItem({
|
||||||
</Text>
|
</Text>
|
||||||
</>
|
</>
|
||||||
) : undefined}
|
) : undefined}
|
||||||
|
<Text style={[styles.metaItem, pal.text]}>{action}</Text>
|
||||||
<Text style={[styles.metaItem, pal.textLight]}>
|
<Text style={[styles.metaItem, pal.textLight]}>
|
||||||
{ago(item.indexedAt)}
|
{ago(item.indexedAt)}
|
||||||
</Text>
|
</Text>
|
||||||
|
@ -208,17 +210,21 @@ function AdditionalPostText({
|
||||||
if (additionalPost.error) {
|
if (additionalPost.error) {
|
||||||
return <ErrorMessage message={additionalPost.error} />
|
return <ErrorMessage message={additionalPost.error} />
|
||||||
}
|
}
|
||||||
const record = additionalPost.thread?.postRecord
|
const text = additionalPost.thread?.postRecord.text
|
||||||
let text = record.text
|
const images = (
|
||||||
if (
|
additionalPost.thread.post.embed as AppBskyEmbedImages.Presented
|
||||||
AppBskyEmbedImages.isMain(record.embed) &&
|
)?.images
|
||||||
AppBskyEmbedImages.validateMain(record.embed).success
|
return (
|
||||||
) {
|
<>
|
||||||
for (let i = 0; i < record.embed.images.length; i++) {
|
{text?.length > 0 && <Text style={pal.textLight}>{text}</Text>}
|
||||||
text += ` [${record.embed.images[i].alt || `image${i + 1}`}]`
|
{images && images?.length > 0 && (
|
||||||
}
|
<ImageHorzList
|
||||||
}
|
uris={images?.map(img => img.thumb)}
|
||||||
return <Text style={pal.textLight}>{text}</Text>
|
style={styles.additionalPostImages}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
</>
|
||||||
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
const styles = StyleSheet.create({
|
const styles = StyleSheet.create({
|
||||||
|
@ -264,6 +270,11 @@ const styles = StyleSheet.create({
|
||||||
paddingBottom: 5,
|
paddingBottom: 5,
|
||||||
color: colors.black,
|
color: colors.black,
|
||||||
},
|
},
|
||||||
|
additionalPostImages: {
|
||||||
|
marginTop: 5,
|
||||||
|
marginLeft: 2,
|
||||||
|
opacity: 0.8,
|
||||||
|
},
|
||||||
|
|
||||||
addedContainer: {
|
addedContainer: {
|
||||||
paddingTop: 4,
|
paddingTop: 4,
|
||||||
|
|
|
@ -0,0 +1,39 @@
|
||||||
|
import React from 'react'
|
||||||
|
import {
|
||||||
|
Image,
|
||||||
|
StyleProp,
|
||||||
|
StyleSheet,
|
||||||
|
TouchableWithoutFeedback,
|
||||||
|
View,
|
||||||
|
ViewStyle,
|
||||||
|
} from 'react-native'
|
||||||
|
|
||||||
|
export function ImageHorzList({
|
||||||
|
uris,
|
||||||
|
onPress,
|
||||||
|
style,
|
||||||
|
}: {
|
||||||
|
uris: string[]
|
||||||
|
onPress?: (index: number) => void
|
||||||
|
style?: StyleProp<ViewStyle>
|
||||||
|
}) {
|
||||||
|
return (
|
||||||
|
<View style={[styles.flexRow, style]}>
|
||||||
|
{uris.map((uri, i) => (
|
||||||
|
<TouchableWithoutFeedback key={i} onPress={() => onPress?.(i)}>
|
||||||
|
<Image source={{uri}} style={styles.image} />
|
||||||
|
</TouchableWithoutFeedback>
|
||||||
|
))}
|
||||||
|
</View>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
const styles = StyleSheet.create({
|
||||||
|
flexRow: {flexDirection: 'row'},
|
||||||
|
image: {
|
||||||
|
width: 100,
|
||||||
|
height: 100,
|
||||||
|
borderRadius: 4,
|
||||||
|
marginRight: 5,
|
||||||
|
},
|
||||||
|
})
|
|
@ -24,7 +24,7 @@ export function ImageLayoutGrid({
|
||||||
style,
|
style,
|
||||||
}: {
|
}: {
|
||||||
type: ImageLayoutGridType
|
type: ImageLayoutGridType
|
||||||
uris: string
|
uris: string[]
|
||||||
onPress?: (index: number) => void
|
onPress?: (index: number) => void
|
||||||
style?: StyleProp<ViewStyle>
|
style?: StyleProp<ViewStyle>
|
||||||
}) {
|
}) {
|
||||||
|
@ -58,7 +58,7 @@ function ImageLayoutGridInner({
|
||||||
containerInfo,
|
containerInfo,
|
||||||
}: {
|
}: {
|
||||||
type: ImageLayoutGridType
|
type: ImageLayoutGridType
|
||||||
uris: string
|
uris: string[]
|
||||||
onPress?: (index: number) => void
|
onPress?: (index: number) => void
|
||||||
containerInfo: Dim
|
containerInfo: Dim
|
||||||
}) {
|
}) {
|
||||||
|
|
Loading…
Reference in New Issue