Function PostContent

src/Components/Post/PostContent/PostContent.jsx:71–189

()

}

export default function PostContent() {
    const {postObj, comments = [], editable, avatar, latestYear, urlPostId, currentDisplayName} = useLoaderData();
    const smallPage = useSmallPage();
    const [open, setOpen] = useState(false);

    if (!postObj) {
        return <Typography>帖子加载失败或不存在。</Typography>;
    }
    const handleClose = () => {
        setOpen(false);
    };
    const handleOpen = () => {
        setOpen(true);
    };
    const authorUrl = latestYear ? postsApplicantPath(urlPostId, `${postObj.author}@${latestYear}`) : null;
    const authorLinkProps = authorUrl ? {component: Link, to: authorUrl} : {};
    const commentsByParentId = comments.reduce((acc, comment) => {
        const parentId = comment.parentId;
        acc[parentId] = [...(acc[parentId] ?? []), comment];
        return acc;
    }, {});
    const topLevelComments = getVisibleComments(postObj.id, commentsByParentId, true);
    return (
        <>
            <Box className="PostContentHeader" sx={{pb: "0.5rem"}}>
                <Box sx={{pb: "0.5rem", display: 'flex', gap: '1rem', alignItems: 'center'}}>
                    <Avatar
                        src={avatar}
                        sx={{
                            height: (smallPage ? "4.5rem" : "4rem"),
                            width: (smallPage ? "4.5rem" : "4rem"),
                            cursor: authorUrl ? 'pointer' : 'default'
                        }}
                        {...authorLinkProps}
                    />
                    <Box sx={{minWidth: 0}}>
                        <BoldTypography variant="h6"
                                        sx={authorUrl ? {cursor: 'pointer', textDecoration: "none"} : {}}
                                        {...authorLinkProps}
                        >
                            {postObj.author}
                        </BoldTypography>
                        <Typography variant="body2" sx={{color: 'text.secondary'}}>
                            创建于 {utcToLocal(postObj.created_at, true)}
                        </Typography>
                        <Typography variant="body2" sx={{color: 'text.secondary'}}>
                            最后修改于 {utcToLocal(postObj.updated_at ?? postObj.created_at, true)}
                        </Typography>
                    </Box>
                </Box>
                <Box className='ReviseRefreshButtonGroup'>
                    {editable ?
                        <>
                            <Tooltip title="编辑内容" arrow>
                                <IconButton component={Link} to={`${postsPostPath(urlPostId)}/edit${window.location.search}`}>
                                    <Edit/>
                                </IconButton>
                            </Tooltip>