Change post prompt to a set of buttons (#55)
parent
f10a8308d9
commit
3f95f98ef9
|
@ -12,7 +12,7 @@ import {EmptyState} from '../util/EmptyState'
|
|||
import {ErrorMessage} from '../util/error/ErrorMessage'
|
||||
import {FeedModel} from '../../../state/models/feed-view'
|
||||
import {FeedItem} from './FeedItem'
|
||||
import {ComposePrompt} from '../composer/Prompt'
|
||||
import {PromptButtons} from './PromptButtons'
|
||||
import {OnScrollCb} from '../../lib/hooks/useOnMainScroll'
|
||||
|
||||
const COMPOSE_PROMPT_ITEM = {_reactKey: '__prompt__'}
|
||||
|
@ -41,7 +41,7 @@ export const Feed = observer(function Feed({
|
|||
// like PureComponent, shouldComponentUpdate, etc
|
||||
const renderItem = ({item}: {item: any}) => {
|
||||
if (item === COMPOSE_PROMPT_ITEM) {
|
||||
return <ComposePrompt onPressCompose={onPressCompose} />
|
||||
return <PromptButtons onPressCompose={onPressCompose} />
|
||||
} else if (item === EMPTY_FEED_ITEM) {
|
||||
return (
|
||||
<EmptyState
|
||||
|
|
|
@ -0,0 +1,48 @@
|
|||
import React from 'react'
|
||||
import {StyleSheet, TouchableOpacity, View} from 'react-native'
|
||||
import {Text} from '../util/text/Text'
|
||||
import {usePalette} from '../../lib/hooks/usePalette'
|
||||
|
||||
export function PromptButtons({
|
||||
onPressCompose,
|
||||
}: {
|
||||
onPressCompose: (imagesOpen?: boolean) => void
|
||||
}) {
|
||||
const pal = usePalette('default')
|
||||
return (
|
||||
<View style={[pal.view, pal.border, styles.container]}>
|
||||
<TouchableOpacity
|
||||
testID="composePromptButton"
|
||||
style={[styles.btn, {backgroundColor: pal.colors.backgroundLight}]}
|
||||
onPress={() => onPressCompose(false)}>
|
||||
<Text type="button" style={pal.textLight}>
|
||||
New post
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
<TouchableOpacity
|
||||
style={[styles.btn, {backgroundColor: pal.colors.backgroundLight}]}
|
||||
onPress={() => onPressCompose(true)}>
|
||||
<Text type="button" style={pal.textLight}>
|
||||
Share photo
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
container: {
|
||||
paddingVertical: 12,
|
||||
paddingBottom: 10,
|
||||
paddingHorizontal: 16,
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
borderTopWidth: 1,
|
||||
},
|
||||
btn: {
|
||||
paddingVertical: 6,
|
||||
paddingHorizontal: 14,
|
||||
borderRadius: 30,
|
||||
marginRight: 10,
|
||||
},
|
||||
})
|
|
@ -135,8 +135,15 @@ const styles = StyleSheet.create({
|
|||
fontWeight: 'normal',
|
||||
},
|
||||
|
||||
backIcon: {width: 30, height: 30},
|
||||
backIconWide: {width: 40, height: 30},
|
||||
backIcon: {
|
||||
width: 30,
|
||||
height: 30,
|
||||
},
|
||||
backIconWide: {
|
||||
width: 40,
|
||||
height: 30,
|
||||
marginLeft: 6,
|
||||
},
|
||||
btn: {
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
|
|
Loading…
Reference in New Issue