diff options
Diffstat (limited to 'src/view/com')
-rw-r--r-- | src/view/com/composer/ComposePost.tsx | 6 | ||||
-rw-r--r-- | src/view/com/composer/Prompt.tsx | 46 | ||||
-rw-r--r-- | src/view/com/posts/Feed.tsx | 6 |
3 files changed, 43 insertions, 15 deletions
diff --git a/src/view/com/composer/ComposePost.tsx b/src/view/com/composer/ComposePost.tsx index d71f33e96..c390717a4 100644 --- a/src/view/com/composer/ComposePost.tsx +++ b/src/view/com/composer/ComposePost.tsx @@ -40,10 +40,12 @@ const HITSLOP = {left: 10, top: 10, right: 10, bottom: 10} export const ComposePost = observer(function ComposePost({ replyTo, + imagesOpen, onPost, onClose, }: { replyTo?: ComposerOpts['replyTo'] + imagesOpen?: ComposerOpts['imagesOpen'] onPost?: ComposerOpts['onPost'] onClose: () => void }) { @@ -54,7 +56,9 @@ export const ComposePost = observer(function ComposePost({ const [processingState, setProcessingState] = useState('') const [error, setError] = useState('') const [text, setText] = useState('') - const [isSelectingPhotos, setIsSelectingPhotos] = useState(false) + const [isSelectingPhotos, setIsSelectingPhotos] = useState( + imagesOpen || false, + ) const [selectedPhotos, setSelectedPhotos] = useState<string[]>([]) // Using default import (React.use...) instead of named import (use...) to be able to mock store's data in jest environment diff --git a/src/view/com/composer/Prompt.tsx b/src/view/com/composer/Prompt.tsx index 0b420021a..5bac6708b 100644 --- a/src/view/com/composer/Prompt.tsx +++ b/src/view/com/composer/Prompt.tsx @@ -1,5 +1,6 @@ import React from 'react' import {StyleSheet, TouchableOpacity, View} from 'react-native' +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' import {Text} from '../util/text/Text' import {usePalette} from '../../lib/hooks/usePalette' @@ -12,7 +13,7 @@ export function ComposePrompt({ text?: string btn?: string isReply?: boolean - onPressCompose: () => void + onPressCompose: (imagesOpen?: boolean) => void }) { const pal = usePalette('default') return ( @@ -24,25 +25,50 @@ export function ComposePrompt({ styles.container, isReply ? styles.containerReply : undefined, ]} - onPress={onPressCompose}> + onPress={() => onPressCompose()}> + {!isReply && ( + <FontAwesomeIcon + icon={['fas', 'pen-nib']} + size={18} + style={[pal.textLight, styles.iconLeft]} + /> + )} <View style={styles.textContainer}> - <Text type="lg" style={[pal.textLight]}> + <Text type={isReply ? 'lg' : 'lg-medium'} style={pal.textLight}> {text} </Text> </View> - <View style={[styles.btn, {backgroundColor: pal.colors.backgroundLight}]}> - <Text type="button" style={pal.textLight}> - {btn} - </Text> - </View> + {isReply ? ( + <View + style={[styles.btn, {backgroundColor: pal.colors.backgroundLight}]}> + <Text type="button" style={pal.textLight}> + {btn} + </Text> + </View> + ) : ( + <TouchableOpacity onPress={() => onPressCompose(true)}> + <FontAwesomeIcon + icon={['far', 'image']} + size={18} + style={[pal.textLight, styles.iconRight]} + /> + </TouchableOpacity> + )} </TouchableOpacity> ) } const styles = StyleSheet.create({ + iconLeft: { + marginLeft: 22, + marginRight: 2, + // marginLeft: 28, + // marginRight: 14, + }, + iconRight: { + marginRight: 20, + }, container: { - paddingLeft: 4, - paddingRight: 10, paddingVertical: 14, flexDirection: 'row', alignItems: 'center', diff --git a/src/view/com/posts/Feed.tsx b/src/view/com/posts/Feed.tsx index f3402428e..9affd4078 100644 --- a/src/view/com/posts/Feed.tsx +++ b/src/view/com/posts/Feed.tsx @@ -30,7 +30,7 @@ export const Feed = observer(function Feed({ feed: FeedModel style?: StyleProp<ViewStyle> scrollElRef?: MutableRefObject<FlatList<any> | null> - onPressCompose: () => void + onPressCompose: (imagesOpen?: boolean) => void onPressTryAgain?: () => void onScroll?: OnScrollCb testID?: string @@ -41,9 +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} text="New message" /> - ) + return <ComposePrompt onPressCompose={onPressCompose} /> } else if (item === EMPTY_FEED_ITEM) { return ( <EmptyState |