YourSelfHosted/memos
1
0
Fork 0
mirror of https://github.com/usememos/memos.git synced 2025-06-05 22:09:59 +02:00
Code Issues Packages Projects Releases Wiki Activity

chore: add comments icon

Browse Source
This commit is contained in:
Steven
2024-03-02 11:29:21 +08:00
parent 7e23ceb242
commit 9a8a1d017e
3 changed files with 21 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
web/src/components/MemoView.tsx
View File

@ -42,7 +42,8 @@ const MemoView: React.FC<Props> = (props: Props) => {
const [displayTime, setDisplayTime] = useState<string>(getRelativeTimeString(getTimeStampByDate(memo.displayTime)));
const [creator, setCreator] = useState(userStore.getUserByUsername(extractUsernameFromName(memo.creator)));
const memoContainerRef = useRef<HTMLDivElement>(null);
const referenceRelations = memo.relations.filter((relation) => relation.type === MemoRelation_Type.REFERENCE);
const referencedMemos = memo.relations.filter((relation) => relation.type === MemoRelation_Type.REFERENCE);
const commentAmount = memo.relations.filter((relation) => relation.type === MemoRelation_Type.COMMENT).length;
const readonly = memo.creator !== user?.name;
useEffect(() => {
@ -124,8 +125,8 @@ const MemoView: React.FC<Props> = (props: Props) => {
</>
)}
</div>
<div className="flex flex-row justify-end items-center select-none">
<div className="w-auto invisible group-hover:visible flex flex-row justify-between items-center">
<div className="flex flex-row justify-end items-center select-none gap-1">
<div className="w-auto invisible group-hover:visible flex flex-row justify-between items-center gap-1">
{props.showVisibility && memo.visibility !== Visibility.PRIVATE && (
<Tooltip title={t(`memo.visibility.${convertVisibilityToString(memo.visibility).toLowerCase()}` as any)} placement="top">
<span className="h-7 w-7 flex justify-center items-center hover:opacity-70">
@ -135,6 +136,17 @@ const MemoView: React.FC<Props> = (props: Props) => {
)}
{currentUser && <ReactionSelector className="border-none" memo={memo} />}
</div>
<Link
className={classNames(
"flex flex-row justify-start items-center hover:opacity-70",
commentAmount === 0 && "invisible group-hover:visible",
)}
to={`/m/${memo.name}`}
unstable_viewTransition
>
<Icon.MessageCircleMore className="w-4 h-4 mx-auto text-gray-500 dark:text-gray-400" />
{commentAmount > 0 && <span className="text-xs text-gray-500 dark:text-gray-400">{commentAmount}</span>}
</Link>
{!readonly && <MemoActionMenu memo={memo} hiddenActions={props.showPinned ? [] : ["pin"]} />}
</div>
</div>
@ -146,7 +158,7 @@ const MemoView: React.FC<Props> = (props: Props) => {
onClick={handleMemoContentClick}
/>
<MemoResourceListView resources={memo.resources} />
<MemoRelationListView memo={memo} relations={referenceRelations} />
<MemoRelationListView memo={memo} relations={referencedMemos} />
<MemoReactionistView memo={memo} reactions={memo.reactions} />
</div>
);