import React, { useState, useEffect } from 'react';
import { View, ScrollView } from 'react-native';
import API from './../API.js';
import Post from './Post.js';

let SinglePostComponent = ({ postId, hideComments }) => {
    let [post, setPost] = useState({});
    useEffect(() => {
        let subscribed = true;
        let getData = async ()=>{
            if (postId){
                let post = await API.getPost(postId);
                if(subscribed) setPost(post);
            }
        }
        getData();
        return () => {
            subscribed = false;
        }
    }, [postId]);
    return (post._id ? (
        <View style={{ flex: 1 }}>
            <ScrollView contentContainerStyle={{ paddingBottom: 18 }}>
                <Post post={post} showComments={hideComments ? false : true} />
            </ScrollView>
        </View>
    ) : null);
};

export default React.memo(SinglePostComponent);
