Remove the avi from the compose prompt

zio/stable
Paul Frazee 2023-01-16 17:37:18 -06:00
parent dac9bc24d1
commit 11c861d2d3
3 changed files with 12 additions and 26 deletions

View File

@ -1,46 +1,29 @@
import React from 'react' import React from 'react'
import {StyleSheet, TouchableOpacity, View} from 'react-native' import {StyleSheet, TouchableOpacity, View} from 'react-native'
import {colors} from '../../lib/styles'
import {useStores} from '../../../state'
import {UserAvatar} from '../util/UserAvatar'
import {Text} from '../util/text/Text' import {Text} from '../util/text/Text'
import {usePalette} from '../../lib/hooks/usePalette' import {usePalette} from '../../lib/hooks/usePalette'
export function ComposePrompt({ export function ComposePrompt({
noAvi = false,
text = "What's up?", text = "What's up?",
btn = 'Post', btn = 'Post',
isReply = false,
onPressCompose, onPressCompose,
}: { }: {
noAvi?: boolean
text?: string text?: string
btn?: string btn?: string
isReply?: boolean
onPressCompose: () => void onPressCompose: () => void
}) { }) {
const pal = usePalette('default') const pal = usePalette('default')
const store = useStores()
const onPressAvatar = () => {
store.nav.navigate(`/profile/${store.me.handle}`)
}
return ( return (
<TouchableOpacity <TouchableOpacity
style={[ style={[
pal.view, pal.view,
pal.border, pal.border,
styles.container, styles.container,
noAvi ? styles.noAviContainer : undefined, isReply ? styles.containerReply : undefined,
]} ]}
onPress={onPressCompose}> onPress={onPressCompose}>
{!noAvi ? (
<TouchableOpacity style={styles.avatar} onPress={onPressAvatar}>
<UserAvatar
size={50}
handle={store.me.handle || ''}
displayName={store.me.displayName}
avatar={store.me.avatar}
/>
</TouchableOpacity>
) : undefined}
<View style={styles.textContainer}> <View style={styles.textContainer}>
<Text type="h5" style={[pal.textLight, {fontWeight: 'normal'}]}> <Text type="h5" style={[pal.textLight, {fontWeight: 'normal'}]}>
{text} {text}
@ -57,14 +40,15 @@ export function ComposePrompt({
const styles = StyleSheet.create({ const styles = StyleSheet.create({
container: { container: {
paddingHorizontal: 10, paddingLeft: 4,
paddingVertical: 10, paddingRight: 10,
paddingVertical: 14,
flexDirection: 'row', flexDirection: 'row',
alignItems: 'center', alignItems: 'center',
borderTopWidth: 1, borderTopWidth: 1,
}, },
noAviContainer: { containerReply: {
paddingVertical: 14, paddingHorizontal: 10,
}, },
avatar: { avatar: {
width: 50, width: 50,

View File

@ -237,7 +237,7 @@ export const PostThreadItem = observer(function PostThreadItem({
</View> </View>
</View> </View>
<ComposePrompt <ComposePrompt
noAvi isReply
text="Write your reply" text="Write your reply"
btn="Reply" btn="Reply"
onPressCompose={onPressReply} onPressCompose={onPressReply}

View File

@ -39,7 +39,9 @@ export const Feed = observer(function Feed({
// like PureComponent, shouldComponentUpdate, etc // like PureComponent, shouldComponentUpdate, etc
const renderItem = ({item}: {item: any}) => { const renderItem = ({item}: {item: any}) => {
if (item === COMPOSE_PROMPT_ITEM) { if (item === COMPOSE_PROMPT_ITEM) {
return <ComposePrompt onPressCompose={onPressCompose} /> return (
<ComposePrompt onPressCompose={onPressCompose} text="New message" />
)
} else if (item === EMPTY_FEED_ITEM) { } else if (item === EMPTY_FEED_ITEM) {
return ( return (
<EmptyState <EmptyState