mirror of https://github.com/tooot-app/app
55 lines
1.9 KiB
TypeScript
55 lines
1.9 KiB
TypeScript
import React, { useContext } from 'react'
|
|
import { Dimensions, StyleSheet, View } from 'react-native'
|
|
import { useTheme } from '@utils/styles/ThemeManager'
|
|
|
|
import TimelineAttachment from '@components/Timelines/Timeline/Shared/Attachment'
|
|
import TimelineAvatar from '@components/Timelines/Timeline/Shared/Avatar'
|
|
import TimelineCard from '@components/Timelines/Timeline/Shared/Card'
|
|
import TimelineContent from '@components/Timelines/Timeline/Shared/Content'
|
|
import TimelineHeaderDefault from '@components/Timelines/Timeline/Shared/HeaderDefault'
|
|
import { ComposeContext } from '@screens/Shared/Compose'
|
|
import { StyleConstants } from '@utils/styles/constants'
|
|
|
|
const ComposeReply: React.FC = () => {
|
|
const {
|
|
composeState: { replyToStatus }
|
|
} = useContext(ComposeContext)
|
|
const { theme } = useTheme()
|
|
|
|
const contentWidth =
|
|
Dimensions.get('window').width -
|
|
StyleConstants.Spacing.Global.PagePadding * 2 - // Global page padding on both sides
|
|
StyleConstants.Avatar.S - // Avatar width
|
|
StyleConstants.Spacing.S // Avatar margin to the right
|
|
|
|
return (
|
|
<View style={[styles.status, { borderTopColor: theme.border }]}>
|
|
<TimelineAvatar account={replyToStatus!.account} />
|
|
<View style={styles.details}>
|
|
<TimelineHeaderDefault status={replyToStatus!} />
|
|
{replyToStatus!.content.length > 0 && (
|
|
<TimelineContent status={replyToStatus!} />
|
|
)}
|
|
{replyToStatus!.media_attachments.length > 0 && (
|
|
<TimelineAttachment status={replyToStatus!} width={contentWidth} />
|
|
)}
|
|
{replyToStatus!.card && <TimelineCard card={replyToStatus!.card} />}
|
|
</View>
|
|
</View>
|
|
)
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
status: {
|
|
flex: 1,
|
|
flexDirection: 'row',
|
|
borderTopWidth: StyleSheet.hairlineWidth,
|
|
paddingTop: StyleConstants.Spacing.Global.PagePadding
|
|
},
|
|
details: {
|
|
flex: 1
|
|
}
|
|
})
|
|
|
|
export default React.memo(ComposeReply, () => true)
|