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

feat: update memo detail page

Browse Source
This commit is contained in:
Steven
2023-09-23 20:14:07 +08:00
parent 08a81e79dd
commit d4e54f343d
7 changed files with 149 additions and 131 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
web/src/components/Memo.tsx
View File

@ -6,6 +6,7 @@ import { Link } from "react-router-dom";
import { UNKNOWN_ID } from "@/helpers/consts";
import { getRelativeTimeString } from "@/helpers/datetime";
import useCurrentUser from "@/hooks/useCurrentUser";
import useNavigateTo from "@/hooks/useNavigateTo";
import { useFilterStore, useMemoStore, useUserStore } from "@/store/module";
import { useUserV1Store } from "@/store/v1";
import { useTranslate } from "@/utils/i18n";
@ -17,7 +18,6 @@ import showMemoEditorDialog from "./MemoEditor/MemoEditorDialog";
import MemoRelationListView from "./MemoRelationListView";
import MemoResourceListView from "./MemoResourceListView";
import showPreviewImageDialog from "./PreviewImageDialog";
import showShareMemo from "./ShareMemoDialog";
import UserAvatar from "./UserAvatar";
import "@/less/memo.less";
@ -30,6 +30,7 @@ interface Props {
const Memo: React.FC<Props> = (props: Props) => {
const { memo, lazyRendering } = props;
const t = useTranslate();
const navigateTo = useNavigateTo();
const { i18n } = useTranslation();
const filterStore = useFilterStore();
const userStore = useUserStore();
@ -89,6 +90,14 @@ const Memo: React.FC<Props> = (props: Props) => {
return <div className={`memo-wrapper min-h-[128px] ${"memos-" + memo.id}`} ref={memoContainerRef}></div>;
}
const handleGotoMemoDetailPage = (event: React.MouseEvent<HTMLDivElement>) => {
if (event.altKey) {
showChangeMemoCreatedTsDialog(memo.id);
} else {
navigateTo(`/m/${memo.id}`);
}
};
const handleTogglePinMemoBtnClick = async () => {
try {
if (memo.pinned) {
@ -143,10 +152,6 @@ const Memo: React.FC<Props> = (props: Props) => {
});
};
const handleGenerateMemoImageBtnClick = () => {
showShareMemo(memo);
};
const handleMemoContentClick = async (e: React.MouseEvent) => {
const targetEl = e.target as HTMLElement;
@ -217,11 +222,6 @@ const Memo: React.FC<Props> = (props: Props) => {
handleEditMemoClick();
};
const handleMemoCreatedTimeClick = (e: React.MouseEvent) => {
e.preventDefault();
showChangeMemoCreatedTsDialog(memo.id);
};
return (
<>
<div className={`memo-wrapper ${"memos-" + memo.id} ${memo.pinned && !readonly ? "pinned" : ""}`} ref={memoContainerRef}>
@ -236,7 +236,7 @@ const Memo: React.FC<Props> = (props: Props) => {
<Icon.Dot className="w-4 h-auto text-gray-400 dark:text-zinc-400" />
</>
)}
<span className="text-sm text-gray-400 select-none" onDoubleClick={handleMemoCreatedTimeClick}>
<span className="text-sm text-gray-400 select-none" onClick={handleGotoMemoDetailPage}>
{displayTime}
</span>
</div>
@ -256,10 +256,6 @@ const Memo: React.FC<Props> = (props: Props) => {
<Icon.Edit3 className="w-4 h-auto mr-2" />
{t("common.edit")}
</span>
<span className="btn" onClick={handleGenerateMemoImageBtnClick}>
<Icon.Share className="w-4 h-auto mr-2" />
{t("common.share")}
</span>
<span className="btn" onClick={handleMarkMemoClick}>
<Icon.Link className="w-4 h-auto mr-2" />
{t("common.mark")}