mirror of https://github.com/usememos/memos
chore: update memo detail page
Steven
2 years ago
parent
10c81ccba3
commit
671551bdc1
@ -0,0 +1,331 @@
|
|||||||
|
import { Divider, Tooltip } from "@mui/joy";
|
||||||
|
import { memo, useEffect, useRef, useState } from "react";
|
||||||
|
import { toast } from "react-hot-toast";
|
||||||
|
import { useTranslation } from "react-i18next";
|
||||||
|
import { Link } from "react-router-dom";
|
||||||
|
import { UNKNOWN_ID } from "@/helpers/consts";
|
||||||
|
import { getRelativeTimeString, getTimeStampByDate } from "@/helpers/datetime";
|
||||||
|
import useCurrentUser from "@/hooks/useCurrentUser";
|
||||||
|
import useNavigateTo from "@/hooks/useNavigateTo";
|
||||||
|
import { useFilterStore } from "@/store/module";
|
||||||
|
import { useUserV1Store, extractUsernameFromName, useMemoV1Store } from "@/store/v1";
|
||||||
|
import { RowStatus } from "@/types/proto/api/v2/common";
|
||||||
|
import { MemoRelation, MemoRelation_Type } from "@/types/proto/api/v2/memo_relation_service";
|
||||||
|
import { Memo, Visibility } from "@/types/proto/api/v2/memo_service";
|
||||||
|
import { Resource } from "@/types/proto/api/v2/resource_service";
|
||||||
|
import { useTranslate } from "@/utils/i18n";
|
||||||
|
import { convertVisibilityToString } from "@/utils/memo";
|
||||||
|
import showChangeMemoCreatedTsDialog from "./ChangeMemoCreatedTsDialog";
|
||||||
|
import { showCommonDialog } from "./Dialog/CommonDialog";
|
||||||
|
import Icon from "./Icon";
|
||||||
|
import MemoContentV1 from "./MemoContentV1";
|
||||||
|
import showMemoEditorDialog from "./MemoEditor/MemoEditorDialog";
|
||||||
|
import MemoRelationListViewV1 from "./MemoRelationListViewV1";
|
||||||
|
import MemoResourceListView from "./MemoResourceListView";
|
||||||
|
import showPreviewImageDialog from "./PreviewImageDialog";
|
||||||
|
import showShareMemoDialogV1 from "./ShareMemoDialogV1";
|
||||||
|
import UserAvatar from "./UserAvatar";
|
||||||
|
import VisibilityIconV1 from "./VisibilityIconV1";
|
||||||
|
import "@/less/memo.less";
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
memo: Memo;
|
||||||
|
showCreator?: boolean;
|
||||||
|
showParent?: boolean;
|
||||||
|
showVisibility?: boolean;
|
||||||
|
showPinnedStyle?: boolean;
|
||||||
|
lazyRendering?: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
const MemoViewV1: React.FC<Props> = (props: Props) => {
|
||||||
|
const { memo, lazyRendering } = props;
|
||||||
|
const t = useTranslate();
|
||||||
|
const navigateTo = useNavigateTo();
|
||||||
|
const { i18n } = useTranslation();
|
||||||
|
const filterStore = useFilterStore();
|
||||||
|
const memoStore = useMemoV1Store();
|
||||||
|
const userV1Store = useUserV1Store();
|
||||||
|
const user = useCurrentUser();
|
||||||
|
const [shouldRender, setShouldRender] = useState<boolean>(lazyRendering ? false : true);
|
||||||
|
const [displayTime, setDisplayTime] = useState<string>(getRelativeTimeString(getTimeStampByDate(memo.displayTime)));
|
||||||
|
const [creator, setCreator] = useState(userV1Store.getUserByUsername(extractUsernameFromName(memo.creator)));
|
||||||
|
const [parentMemo, setParentMemo] = useState<Memo | undefined>(undefined);
|
||||||
|
const [resources, setResources] = useState<Resource[]>([]);
|
||||||
|
const [memoRelations, setMemoRelations] = useState<MemoRelation[]>([]);
|
||||||
|
const memoContainerRef = useRef<HTMLDivElement>(null);
|
||||||
|
const referenceRelations = memoRelations.filter((relation) => relation.type === MemoRelation_Type.REFERENCE);
|
||||||
|
const readonly = memo.creator !== user?.name;
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
memoStore.fetchMemoResources(memo.id).then((resources: Resource[]) => {
|
||||||
|
setResources(resources);
|
||||||
|
});
|
||||||
|
memoStore.fetchMemoRelations(memo.id).then((relations: MemoRelation[]) => {
|
||||||
|
setMemoRelations(relations);
|
||||||
|
const parentMemoId = relations.find(
|
||||||
|
(relation) => relation.memoId === memo.id && relation.type === MemoRelation_Type.COMMENT
|
||||||
|
)?.relatedMemoId;
|
||||||
|
if (parentMemoId) {
|
||||||
|
memoStore.getOrFetchMemoById(parentMemoId).then((memo: Memo) => {
|
||||||
|
setParentMemo(memo);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
// Prepare memo creator.
|
||||||
|
useEffect(() => {
|
||||||
|
if (creator) return;
|
||||||
|
|
||||||
|
(async () => {
|
||||||
|
const user = await userV1Store.getOrFetchUserByUsername(extractUsernameFromName(memo.creator));
|
||||||
|
setCreator(user);
|
||||||
|
})();
|
||||||
|
}, [memo.creator]);
|
||||||
|
|
||||||
|
// Update display time string.
|
||||||
|
useEffect(() => {
|
||||||
|
let intervalFlag: any = -1;
|
||||||
|
if (Date.now() - getTimeStampByDate(memo.displayTime) < 1000 * 60 * 60 * 24) {
|
||||||
|
intervalFlag = setInterval(() => {
|
||||||
|
setDisplayTime(getRelativeTimeString(getTimeStampByDate(memo.displayTime)));
|
||||||
|
}, 1000 * 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
return () => {
|
||||||
|
clearInterval(intervalFlag);
|
||||||
|
};
|
||||||
|
}, [i18n.language]);
|
||||||
|
|
||||||
|
// Lazy rendering.
|
||||||
|
useEffect(() => {
|
||||||
|
if (shouldRender) return;
|
||||||
|
if (!memoContainerRef.current) return;
|
||||||
|
|
||||||
|
const observer = new IntersectionObserver(([entry]) => {
|
||||||
|
if (!entry.isIntersecting) return;
|
||||||
|
observer.disconnect();
|
||||||
|
|
||||||
|
setShouldRender(true);
|
||||||
|
});
|
||||||
|
observer.observe(memoContainerRef.current);
|
||||||
|
|
||||||
|
return () => observer.disconnect();
|
||||||
|
}, [lazyRendering, filterStore.state]);
|
||||||
|
|
||||||
|
if (!shouldRender) {
|
||||||
|
// Render a placeholder to occupy the space.
|
||||||
|
return <div className={`w-full h-32 !bg-transparent ${"memos-" + memo.id}`} ref={memoContainerRef} />;
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleGotoMemoDetailPage = (event: React.MouseEvent<HTMLDivElement>) => {
|
||||||
|
if (event.altKey) {
|
||||||
|
showChangeMemoCreatedTsDialog(memo.id);
|
||||||
|
} else {
|
||||||
|
navigateTo(`/m/${memo.id}`);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleTogglePinMemoBtnClick = async () => {
|
||||||
|
try {
|
||||||
|
if (memo.pinned) {
|
||||||
|
await memoStore.updateMemo(
|
||||||
|
{
|
||||||
|
id: memo.id,
|
||||||
|
pinned: false,
|
||||||
|
},
|
||||||
|
["pinned"]
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
await memoStore.updateMemo(
|
||||||
|
{
|
||||||
|
id: memo.id,
|
||||||
|
pinned: true,
|
||||||
|
},
|
||||||
|
["pinned"]
|
||||||
|
);
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
// do nth
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleEditMemoClick = () => {
|
||||||
|
showMemoEditorDialog({
|
||||||
|
memoId: memo.id,
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleMarkMemoClick = () => {
|
||||||
|
showMemoEditorDialog({
|
||||||
|
relationList: [
|
||||||
|
{
|
||||||
|
memoId: UNKNOWN_ID,
|
||||||
|
relatedMemoId: memo.id,
|
||||||
|
type: "REFERENCE",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleArchiveMemoClick = async () => {
|
||||||
|
try {
|
||||||
|
await memoStore.updateMemo(
|
||||||
|
{
|
||||||
|
id: memo.id,
|
||||||
|
rowStatus: RowStatus.ARCHIVED,
|
||||||
|
},
|
||||||
|
["row_status"]
|
||||||
|
);
|
||||||
|
} catch (error: any) {
|
||||||
|
console.error(error);
|
||||||
|
toast.error(error.response.data.message);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleDeleteMemoClick = async () => {
|
||||||
|
showCommonDialog({
|
||||||
|
title: t("memo.delete-memo"),
|
||||||
|
content: t("memo.delete-confirm"),
|
||||||
|
style: "danger",
|
||||||
|
dialogName: "delete-memo-dialog",
|
||||||
|
onConfirm: async () => {
|
||||||
|
await memoStore.deleteMemo(memo.id);
|
||||||
|
},
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleMemoContentClick = async (e: React.MouseEvent) => {
|
||||||
|
const targetEl = e.target as HTMLElement;
|
||||||
|
|
||||||
|
if (targetEl.className === "tag-span") {
|
||||||
|
const tagName = targetEl.innerText.slice(1);
|
||||||
|
const currTagQuery = filterStore.getState().tag;
|
||||||
|
if (currTagQuery === tagName) {
|
||||||
|
filterStore.setTagFilter(undefined);
|
||||||
|
} else {
|
||||||
|
filterStore.setTagFilter(tagName);
|
||||||
|
}
|
||||||
|
} else if (targetEl.tagName === "IMG") {
|
||||||
|
const imgUrl = targetEl.getAttribute("src");
|
||||||
|
if (imgUrl) {
|
||||||
|
showPreviewImageDialog([imgUrl], 0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
className={`group memo-wrapper ${"memos-" + memo.id} ${memo.pinned && props.showPinnedStyle ? "pinned" : ""}`}
|
||||||
|
ref={memoContainerRef}
|
||||||
|
>
|
||||||
|
<div className="memo-top-wrapper mb-1">
|
||||||
|
<div className="w-full max-w-[calc(100%-20px)] flex flex-row justify-start items-center mr-1">
|
||||||
|
{props.showCreator && creator && (
|
||||||
|
<>
|
||||||
|
<Link to={`/u/${encodeURIComponent(extractUsernameFromName(memo.creator))}`}>
|
||||||
|
<Tooltip title={"Creator"} placement="top">
|
||||||
|
<span className="flex flex-row justify-start items-center">
|
||||||
|
<UserAvatar className="!w-5 !h-5 mr-1" avatarUrl={creator.avatarUrl} />
|
||||||
|
<span className="text-sm text-gray-600 max-w-[8em] truncate dark:text-gray-400">
|
||||||
|
{creator.nickname || extractUsernameFromName(creator.name)}
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
</Tooltip>
|
||||||
|
</Link>
|
||||||
|
<Icon.Dot className="w-4 h-auto text-gray-400 dark:text-zinc-400" />
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
<span className="text-sm text-gray-400 select-none" onClick={handleGotoMemoDetailPage}>
|
||||||
|
{displayTime}
|
||||||
|
</span>
|
||||||
|
{props.showPinnedStyle && memo.pinned && (
|
||||||
|
<>
|
||||||
|
<Icon.Dot className="w-4 h-auto text-gray-400 dark:text-zinc-400" />
|
||||||
|
<Tooltip title={"Pinned"} placement="top">
|
||||||
|
<Icon.Bookmark className="w-4 h-auto text-green-600" />
|
||||||
|
</Tooltip>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
<div className="w-auto hidden group-hover:flex flex-row justify-between items-center">
|
||||||
|
<Icon.Dot className="w-4 h-auto text-gray-400 dark:text-zinc-400" />
|
||||||
|
<Link className="flex flex-row justify-start items-center" to={`/m/${memo.id}`}>
|
||||||
|
<Tooltip title={"Identifier"} placement="top">
|
||||||
|
<span className="text-sm text-gray-500 dark:text-gray-400">#{memo.id}</span>
|
||||||
|
</Tooltip>
|
||||||
|
</Link>
|
||||||
|
{props.showVisibility && memo.visibility !== Visibility.PRIVATE && (
|
||||||
|
<>
|
||||||
|
<Icon.Dot className="w-4 h-auto text-gray-400 dark:text-zinc-400" />
|
||||||
|
<Tooltip title={t(`memo.visibility.${convertVisibilityToString(memo.visibility)}` as any)} placement="top">
|
||||||
|
<span>
|
||||||
|
<VisibilityIconV1 visibility={memo.visibility} />
|
||||||
|
</span>
|
||||||
|
</Tooltip>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="btns-container space-x-2">
|
||||||
|
{!readonly && (
|
||||||
|
<>
|
||||||
|
<span className="btn more-action-btn">
|
||||||
|
<Icon.MoreVertical className="icon-img" />
|
||||||
|
</span>
|
||||||
|
<div className="more-action-btns-wrapper">
|
||||||
|
<div className="more-action-btns-container min-w-[6em]">
|
||||||
|
{!parentMemo && (
|
||||||
|
<span className="btn" onClick={handleTogglePinMemoBtnClick}>
|
||||||
|
{memo.pinned ? <Icon.BookmarkMinus className="w-4 h-auto mr-2" /> : <Icon.BookmarkPlus className="w-4 h-auto mr-2" />}
|
||||||
|
{memo.pinned ? t("common.unpin") : t("common.pin")}
|
||||||
|
</span>
|
||||||
|
)}
|
||||||
|
<span className="btn" onClick={handleEditMemoClick}>
|
||||||
|
<Icon.Edit3 className="w-4 h-auto mr-2" />
|
||||||
|
{t("common.edit")}
|
||||||
|
</span>
|
||||||
|
{!parentMemo && (
|
||||||
|
<span className="btn" onClick={handleMarkMemoClick}>
|
||||||
|
<Icon.Link className="w-4 h-auto mr-2" />
|
||||||
|
{t("common.mark")}
|
||||||
|
</span>
|
||||||
|
)}
|
||||||
|
<span className="btn" onClick={() => showShareMemoDialogV1(memo)}>
|
||||||
|
<Icon.Share className="w-4 h-auto mr-2" />
|
||||||
|
{t("common.share")}
|
||||||
|
</span>
|
||||||
|
<Divider className="!my-1" />
|
||||||
|
<span className="btn text-orange-500" onClick={handleArchiveMemoClick}>
|
||||||
|
<Icon.Archive className="w-4 h-auto mr-2" />
|
||||||
|
{t("common.archive")}
|
||||||
|
</span>
|
||||||
|
<span className="btn text-red-600" onClick={handleDeleteMemoClick}>
|
||||||
|
<Icon.Trash className="w-4 h-auto mr-2" />
|
||||||
|
{t("common.delete")}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{props.showParent && parentMemo && (
|
||||||
|
<div className="w-auto max-w-full mb-1">
|
||||||
|
<Link
|
||||||
|
className="px-2 py-0.5 border rounded-full max-w-xs w-auto text-xs flex flex-row justify-start items-center flex-nowrap text-gray-600 dark:text-gray-400 dark:border-gray-500 hover:shadow hover:opacity-80"
|
||||||
|
to={`/m/${parentMemo.id}`}
|
||||||
|
>
|
||||||
|
<Icon.ArrowUpRightFromCircle className="w-3 h-auto shrink-0 opacity-60" />
|
||||||
|
<span className="mx-1 opacity-60">#{parentMemo.id}</span>
|
||||||
|
<span className="truncate">{parentMemo.content}</span>
|
||||||
|
</Link>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
<MemoContentV1 content={memo.content} nodes={memo.nodes} onMemoContentClick={handleMemoContentClick} />
|
||||||
|
<MemoResourceListView resourceList={resources} />
|
||||||
|
<MemoRelationListViewV1 memo={memo} relationList={referenceRelations} />
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default memo(MemoViewV1);
|
||||||
@ -0,0 +1,137 @@
|
|||||||
|
import { Button } from "@mui/joy";
|
||||||
|
import copy from "copy-to-clipboard";
|
||||||
|
import React, { useEffect, useRef, useState } from "react";
|
||||||
|
import { toast } from "react-hot-toast";
|
||||||
|
import { getDateTimeString, getTimeString } from "@/helpers/datetime";
|
||||||
|
import useLoading from "@/hooks/useLoading";
|
||||||
|
import toImage from "@/labs/html2image";
|
||||||
|
import { useUserV1Store, extractUsernameFromName, useMemoV1Store } from "@/store/v1";
|
||||||
|
import { Memo } from "@/types/proto/api/v2/memo_service";
|
||||||
|
import { Resource } from "@/types/proto/api/v2/resource_service";
|
||||||
|
import { useTranslate } from "@/utils/i18n";
|
||||||
|
import { generateDialog } from "./Dialog";
|
||||||
|
import Icon from "./Icon";
|
||||||
|
import MemoContentV1 from "./MemoContentV1";
|
||||||
|
import MemoResourceListView from "./MemoResourceListView";
|
||||||
|
import UserAvatar from "./UserAvatar";
|
||||||
|
import "@/less/share-memo-dialog.less";
|
||||||
|
|
||||||
|
interface Props extends DialogProps {
|
||||||
|
memo: Memo;
|
||||||
|
}
|
||||||
|
|
||||||
|
const ShareMemoDialogV1: React.FC<Props> = (props: Props) => {
|
||||||
|
const { memo, destroy } = props;
|
||||||
|
const t = useTranslate();
|
||||||
|
const userV1Store = useUserV1Store();
|
||||||
|
const memoStore = useMemoV1Store();
|
||||||
|
const downloadingImageState = useLoading(false);
|
||||||
|
const loadingState = useLoading();
|
||||||
|
const memoElRef = useRef<HTMLDivElement>(null);
|
||||||
|
const [resources, setResources] = useState<Resource[]>([]);
|
||||||
|
const user = userV1Store.getUserByUsername(extractUsernameFromName(memo.creator));
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
(async () => {
|
||||||
|
setResources(await memoStore.fetchMemoResources(memo.id));
|
||||||
|
await userV1Store.getOrFetchUserByUsername(extractUsernameFromName(memo.creator));
|
||||||
|
loadingState.setFinish();
|
||||||
|
})();
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
const handleCloseBtnClick = () => {
|
||||||
|
destroy();
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleDownloadImageBtnClick = () => {
|
||||||
|
if (!memoElRef.current) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
downloadingImageState.setLoading();
|
||||||
|
toImage(memoElRef.current, {
|
||||||
|
pixelRatio: window.devicePixelRatio * 2,
|
||||||
|
})
|
||||||
|
.then((url) => {
|
||||||
|
const a = document.createElement("a");
|
||||||
|
a.href = url;
|
||||||
|
a.download = `memos-${getDateTimeString(Date.now())}.png`;
|
||||||
|
a.click();
|
||||||
|
|
||||||
|
downloadingImageState.setFinish();
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
console.error(err);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleCopyLinkBtnClick = () => {
|
||||||
|
copy(`${window.location.origin}/m/${memo.id}`);
|
||||||
|
toast.success(t("message.succeed-copy-link"));
|
||||||
|
};
|
||||||
|
|
||||||
|
if (loadingState.isLoading) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className="dialog-header-container py-3 px-4 !mb-0 rounded-t-lg">
|
||||||
|
<p className="">{t("common.share")} Memo</p>
|
||||||
|
<button className="btn close-btn" onClick={handleCloseBtnClick}>
|
||||||
|
<Icon.X className="icon-img" />
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div className="dialog-content-container w-full flex flex-col justify-start items-start relative">
|
||||||
|
<div className="px-4 pb-3 w-full flex flex-row justify-start items-center space-x-2">
|
||||||
|
<Button color="neutral" variant="outlined" disabled={downloadingImageState.isLoading} onClick={handleDownloadImageBtnClick}>
|
||||||
|
{downloadingImageState.isLoading ? (
|
||||||
|
<Icon.Loader className="w-4 h-auto mr-1 animate-spin" />
|
||||||
|
) : (
|
||||||
|
<Icon.Download className="w-4 h-auto mr-1" />
|
||||||
|
)}
|
||||||
|
{t("common.image")}
|
||||||
|
</Button>
|
||||||
|
<Button color="neutral" variant="outlined" onClick={handleCopyLinkBtnClick}>
|
||||||
|
<Icon.Link className="w-4 h-auto mr-1" />
|
||||||
|
{t("common.link")}
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
<div className="w-full border-t dark:border-zinc-700 overflow-clip">
|
||||||
|
<div
|
||||||
|
className="w-full h-auto select-none relative flex flex-col justify-start items-start bg-white dark:bg-zinc-800"
|
||||||
|
ref={memoElRef}
|
||||||
|
>
|
||||||
|
<span className="w-full px-6 pt-5 pb-2 text-sm text-gray-500">{getTimeString(memo.displayTime)}</span>
|
||||||
|
<div className="w-full px-6 text-base pb-4">
|
||||||
|
<MemoContentV1 content={memo.content} />
|
||||||
|
<MemoResourceListView resourceList={resources} />
|
||||||
|
</div>
|
||||||
|
<div className="flex flex-row justify-between items-center w-full bg-gray-100 dark:bg-zinc-700 py-4 px-6">
|
||||||
|
<div className="flex flex-row justify-start items-center">
|
||||||
|
<UserAvatar className="mr-2" avatarUrl={user.avatarUrl} />
|
||||||
|
<div className="w-auto grow truncate flex mr-2 flex-col justify-center items-start">
|
||||||
|
<span className="w-full text truncate font-medium text-gray-600 dark:text-gray-300">
|
||||||
|
{user.nickname || extractUsernameFromName(user.name)}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<span className="text-gray-500 dark:text-gray-400">via memos</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default function showShareMemoDialogV1(memo: Memo): void {
|
||||||
|
generateDialog(
|
||||||
|
{
|
||||||
|
className: "share-memo-dialog-v1",
|
||||||
|
dialogName: "share-memo-dialog-v1",
|
||||||
|
},
|
||||||
|
ShareMemoDialogV1,
|
||||||
|
{ memo }
|
||||||
|
);
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue