From ff783d8aebc90802079f843b27f2719173bd6b70 Mon Sep 17 00:00:00 2001
From: Ivan Chen <ivan@tagg.id>
Date: Thu, 8 Jul 2021 16:01:56 -0400
Subject: Add post button

---
 src/components/moments/MomentPostButton.tsx | 49 +++++++++++++++++++++++++++++
 src/components/moments/index.ts             |  1 +
 src/screens/profile/CaptionScreen.tsx       |  7 ++++-
 3 files changed, 56 insertions(+), 1 deletion(-)
 create mode 100644 src/components/moments/MomentPostButton.tsx

(limited to 'src')

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>
-- 
cgit v1.2.3-70-g09d2