Post.tsx

import { User } from "@/types/user";
import { FC, PropsWithChildren } from "react";
import styles from '../../styles/Post.module.css'
import PostAction from "./PostAction";
import { generateRandomLinearGradient } from "./Utils";
import { SlBubble, SlShare } from 'react-icons/sl'
import { AiOutlineHeart } from 'react-icons/ai'
import Avatar from "../profile/avatar";

type PostProps = {
  User: User,
  Post: string,
  TimeStamp?: string,
  Likes: User[],
}


const Post: FC<PropsWithChildren<PostProps>> = ({
  User,
  Post,
  TimeStamp,
  Likes
}) => {

  return (
    <div className={styles.post}>
      <div className={styles.header}>
        <Avatar User={User}/>
        <div className={styles.headerInfo}>
          <div className={styles.headerUserInfo}>
            <p className={styles.name} >{User.FirstName} {User.LastName}</p>
            <p className={styles.username}>@{User.Username}</p>
          </div>
          <div className={styles.timestamp}>
            {TimeStamp}
          </div>
        </div>
      </div>
      <div className={styles.postContentContainer}>
        <p className={styles.postContent}>{Post}</p>

        <div className={styles.postActions}>
          <PostAction label="7" icon={<SlBubble />} onClick={null}/>
          <PostAction label="0" icon={<AiOutlineHeart />} />
          <PostAction icon={<SlShare />}/>
        </div>
      </div>
    </div>
  )
}

export default Post;