import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { getInitials } from "../../../utils";
import ClickableText from "../../ClickableText";
import "./styles.scss";
function Note({ id, author, dateTime, isEdited, content, notesRemaining, onNotesViewAllClick, }) {
    return (_jsxs("div", { className: "note", children: [_jsxs("div", { className: "noteHeader", children: [_jsx("div", { className: "avatar", children: _jsx("span", { children: getInitials(author) }) }), _jsxs("div", { className: "noteContentWrapper", children: [_jsx("div", { className: "noteContent", dangerouslySetInnerHTML: {
                                    __html: content,
                                } }), _jsxs("div", { className: "info", children: [_jsx("p", { className: "author", children: author }), _jsxs("p", { className: "time", children: [isEdited ? "Last edited : " : "", dateTime] })] })] })] }), notesRemaining > 0 && (_jsx("div", { className: "action", children: _jsx(ClickableText, { colorVariant: "gray", sizeVariant: "xs", text: `View ${notesRemaining} more`, onClick: onNotesViewAllClick }) }))] }, id));
}
export default Note;
