import React, { useState, useEffect } from 'react';
import { FlatList } 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 ? (
        <FlatList
            data={[post]}
            renderItem={({ item }) => <Post post={item} showComments={hideComments ? false : true}/>}
            keyExtractor={item => item._id}
        />
            
    ) : null);
};

export default React.memo(SinglePostComponent);