import AvatarDrawing from "@/components/AvatarDrawing"; import { GetLatestCommentAPI } from "@/type/wwwAPI"; import Link from "next/link"; import Col from "react-bootstrap/Col"; import Row from "react-bootstrap/Row"; import Stack from "react-bootstrap/Stack"; import { getDatetime } from "taehui-lib/date"; export default function CommentTitleView({ forumID, essayID, comment: { commentID, avatarID, avatarName, date, text }, }: { forumID?: string; essayID?: number; comment: GetLatestCommentAPI[number]; }) { const isLoading = !( typeof forumID === "string" && commentID >= 0 && typeof essayID === "number" ); return ( <Row className="flex-nowrap" {...(!isLoading && { as: Link, href: `/forum/${forumID}/${essayID}`, })} > <Col xs="auto"> <AvatarDrawing avatarID={avatarID} /> </Col> <Col className="cc"> <Stack gap={2}> <span className="ellipsis">{avatarName}</span> <span className="ellipsis">{text}</span> </Stack> </Col> <Col xs="auto" suppressHydrationWarning> {getDatetime(date)} </Col> </Row> ); }