aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
authorIvan Chen <ivan@tagg.id>2021-07-08 16:01:56 -0400
committerIvan Chen <ivan@tagg.id>2021-07-09 15:56:47 -0400
commitff783d8aebc90802079f843b27f2719173bd6b70 (patch)
treedbad5aef1d667b7070815f56e993ae1a2bb68a0b /src
parentf9b9a3297dd8d935d0ed5f176451075e192aee49 (diff)
Add post button
Diffstat (limited to 'src')
-rw-r--r--src/components/moments/MomentPostButton.tsx49
-rw-r--r--src/components/moments/index.ts1
-rw-r--r--src/screens/profile/CaptionScreen.tsx7
3 files changed, 56 insertions, 1 deletions
diff --git a/src/components/moments/MomentPostButton.tsx b/src/components/moments/MomentPostButton.tsx
new file mode 100644
index 00000000..78fe209b
--- /dev/null
+++ b/src/components/moments/MomentPostButton.tsx
@@ -0,0 +1,49 @@
+import React from 'react';
+import {StyleSheet} from 'react-native';
+import {Text} from 'react-native-animatable';
+import {TouchableOpacity} from 'react-native-gesture-handler';
+import {TAGG_LIGHT_BLUE} from '../../constants';
+import {normalize, SCREEN_WIDTH} from '../../utils';
+
+interface MomentPostButtonProps {
+ enabled: boolean;
+ onPress: () => void;
+}
+
+const MomentPostButton: React.FC<MomentPostButtonProps> = ({
+ enabled,
+ onPress,
+}) => {
+ return (
+ <TouchableOpacity
+ style={[styles.button, enabled ? {} : styles.grey]}
+ onPress={onPress}
+ disabled={!enabled}>
+ <Text style={styles.text}>Post</Text>
+ </TouchableOpacity>
+ );
+};
+
+const styles = StyleSheet.create({
+ button: {
+ width: SCREEN_WIDTH * 0.8,
+ height: normalize(37),
+ backgroundColor: TAGG_LIGHT_BLUE,
+ justifyContent: 'center',
+ alignItems: 'center',
+ borderRadius: 6,
+ alignSelf: 'center',
+ },
+ grey: {
+ backgroundColor: '#C4C4C4',
+ },
+ text: {
+ color: 'white',
+ fontWeight: 'bold',
+ fontSize: normalize(15),
+ lineHeight: 18,
+ letterSpacing: 2,
+ },
+});
+
+export default MomentPostButton;
diff --git a/src/components/moments/index.ts b/src/components/moments/index.ts
index cac2da2e..d2f5d150 100644
--- a/src/components/moments/index.ts
+++ b/src/components/moments/index.ts
@@ -3,3 +3,4 @@ export {default as CaptionScreenHeader} from './CaptionScreenHeader';
export {default as Moment} from './Moment';
export {default as TagFriendsFooter} from './TagFriendsFoooter';
export {default as MomentPost} from './MomentPost';
+export {default as MomentPostButton} from './MomentPostButton';
diff --git a/src/screens/profile/CaptionScreen.tsx b/src/screens/profile/CaptionScreen.tsx
index aa866f56..86628d16 100644
--- a/src/screens/profile/CaptionScreen.tsx
+++ b/src/screens/profile/CaptionScreen.tsx
@@ -18,7 +18,11 @@ import {Button} from 'react-native-elements';
import Video from 'react-native-video';
import {useDispatch, useSelector} from 'react-redux';
import FrontArrow from '../../assets/icons/front-arrow.svg';
-import {MentionInputControlled, SearchBackground} from '../../components';
+import {
+ MentionInputControlled,
+ MomentPostButton,
+ SearchBackground,
+} from '../../components';
import {CaptionScreenHeader} from '../../components/';
import TaggLoadingIndicator from '../../components/common/TaggLoadingIndicator';
import {TAGG_LIGHT_BLUE_2} from '../../constants';
@@ -314,6 +318,7 @@ const CaptionScreen: React.FC<CaptionScreenProps> = ({route, navigation}) => {
})
}
/>
+ <MomentPostButton enabled={true} onPress={() => null} />
</View>
</KeyboardAvoidingView>
</TouchableWithoutFeedback>