diff --git a/client/src/components/post/PostCard.tsx b/client/src/components/post/PostCard.tsx index c5e382b..16a5f15 100644 --- a/client/src/components/post/PostCard.tsx +++ b/client/src/components/post/PostCard.tsx @@ -1,19 +1,15 @@ "use client"; import { PostInterface } from "@/types/post/PostInterface"; -import { - FavoriteOutlined, - MoreVertOutlined, - ShareOutlined, -} from "@mui/icons-material"; +import { MoreVertOutlined } from "@mui/icons-material"; import { Avatar, + Box, Card, CardActions, CardContent, - CardHeader, CardMedia, - IconButton, Typography, + ButtonBase, } from "@mui/material"; const PostCard = ({ @@ -23,54 +19,98 @@ const PostCard = ({ nickname, content, userImage, + tags, }: PostInterface) => { return ( - - {/* Header */} - + + {userImage || userId[0].toUpperCase()} + + + {/* Header */} + + - {userImage || userId[0].toUpperCase()} - - } - action={ - + {nickname} + {`@${userId}`} + {createdAt} + + + - - } - title={`@${userId}`} - subheader={nickname} - /> - {/* image */} - {image.length !== 0 && ( - - )} - {/* Contents */} - - - {content} - - - {/* CTA */} - - - - - - - - + + + + {/* Contents */} + + {content} + {/* Hash tags */} + {tags?.length > 0 && ( + + {tags.map((tag, i) => ( + + {`#${tag}`} + + ))} + + )} + + {/* image */} + {image.length !== 0 && ( + + )} + {/* CTA */} + + + 댓글 + + + 좋아요 + + + 공유하기 + + + ); };