Feed showing posts

components/Post.js

@@ -0,0 +1,46 @@
+import React, { useState, useEffect } from 'react';
+import { Text, View, ScrollView, Button, StyleSheet } from 'react-native';
+import API from './../API.js';
+import UserName from './UserName.js';
+import Media from './Media.js';
+
+
+let Post = (props) => {
+
+    let toProfileText = props.post.toProfile && props.post.toProfile !== props.post.profileid ? 
+        <Text> {">"} <UserName profileid={props.post.toProfile} /></Text> : undefined;
+
+    let cleanContent = props.post.content.replace(/@[A-z]+:.+\w/g, '');
+    return (
+        <View style={styles.postView}>
+            <Text style={styles.userName}>
+                <UserName profileid={props.post.profileid} />
+                {toProfileText}
+            </Text>
+            <Text>{cleanContent}</Text>
+            <Media content={props.post.content} />
+            <View style={{flexDirection: "row", flow: 4, justifyContent: 'space-between'}}>
+                <Button title='Like' style={{flow:1}} />
+                <Button title='Comment' style={{flow:1}} />
+                <Button title='Share' style={{flow:1}} />
+                <Button title='Book' style={{flow:1}} />
+            </View>
+        </View>
+    );
+}
+
+export default Post;
+
+const styles = StyleSheet.create({
+    userName: {
+        fontSize: 14,
+        fontWeight: 'bold',
+        marginBottom: 5,
+    },
+    postView: {
+        margin: 8,
+        borderColor: 'gray',
+        borderWidth: 1,
+        padding: 10
+    }
+});