diff --git a/web/src/components/ChangeMemoCreatedTsDialog.tsx b/web/src/components/ChangeMemoCreatedTsDialog.tsx index 3cb912aa..b3fc7baf 100644 --- a/web/src/components/ChangeMemoCreatedTsDialog.tsx +++ b/web/src/components/ChangeMemoCreatedTsDialog.tsx @@ -18,14 +18,15 @@ const ChangeMemoCreatedTsDialog: React.FC = (props: Props) => { const maxDatetimeValue = dayjs().format("YYYY-MM-DDTHH:mm"); useEffect(() => { - const memo = memoService.getMemoById(memoId); - if (memo) { - const datetime = dayjs(memo.createdTs).format("YYYY-MM-DDTHH:mm"); - setCreatedAt(datetime); - } else { - toastHelper.error(t("message.memo-not-found")); - destroy(); - } + memoService.getMemoById(memoId).then((memo) => { + if (memo) { + const datetime = dayjs(memo.createdTs).format("YYYY-MM-DDTHH:mm"); + setCreatedAt(datetime); + } else { + toastHelper.error(t("message.memo-not-found")); + destroy(); + } + }); }, []); const handleCloseBtnClick = () => { diff --git a/web/src/components/Memo.tsx b/web/src/components/Memo.tsx index 888714ba..cc05990f 100644 --- a/web/src/components/Memo.tsx +++ b/web/src/components/Memo.tsx @@ -113,7 +113,7 @@ const Memo: React.FC = (props: Props) => { if (targetEl.className === "memo-link-text") { const memoId = targetEl.dataset?.value; - const memoTemp = memoService.getMemoById(Number(memoId) ?? UNKNOWN_ID); + const memoTemp = await memoService.getMemoById(Number(memoId) ?? UNKNOWN_ID); if (memoTemp) { showMemoCardDialog(memoTemp); diff --git a/web/src/components/MemoCardDialog.tsx b/web/src/components/MemoCardDialog.tsx index 214a04e0..9f3659c1 100644 --- a/web/src/components/MemoCardDialog.tsx +++ b/web/src/components/MemoCardDialog.tsx @@ -54,7 +54,7 @@ const MemoCardDialog: React.FC = (props: Props) => { continue; } - const memoTemp = memoService.getMemoById(id); + const memoTemp = await memoService.getMemoById(id); if (memoTemp) { linkMemos.push({ ...memoTemp, @@ -83,7 +83,9 @@ const MemoCardDialog: React.FC = (props: Props) => { }; fetchLinkedMemos(); - setMemo(memoService.getMemoById(memo.id) as Memo); + memoService.getMemoById(memo.id).then((memo) => { + setMemo(memo); + }); }, [memos, memo.id]); const handleMemoCreatedAtClick = () => { @@ -99,7 +101,7 @@ const MemoCardDialog: React.FC = (props: Props) => { if (targetEl.className === "memo-link-text") { const nextMemoId = targetEl.dataset?.value; - const memoTemp = memoService.getMemoById(Number(nextMemoId) ?? UNKNOWN_ID); + const memoTemp = await memoService.getMemoById(Number(nextMemoId) ?? UNKNOWN_ID); if (memoTemp) { const nextMemo = { diff --git a/web/src/components/MemoEditor.tsx b/web/src/components/MemoEditor.tsx index 043b21f6..23638869 100644 --- a/web/src/components/MemoEditor.tsx +++ b/web/src/components/MemoEditor.tsx @@ -47,6 +47,13 @@ const MemoEditor: React.FC = () => { const editorFontStyle = user?.setting.editorFontStyle || "normal"; const mobileEditorStyle = user?.setting.mobileEditorStyle || "normal"; + useEffect(() => { + const { editingMemoIdCache } = storage.get(["editingMemoIdCache"]); + if (editingMemoIdCache) { + editorStateService.setEditMemoWithId(editingMemoIdCache); + } + }, []); + useEffect(() => { if (editorState.markMemoId && editorState.markMemoId !== UNKNOWN_ID) { const editorCurrentValue = editorRef.current?.getContent(); @@ -62,18 +69,26 @@ const MemoEditor: React.FC = () => { editorState.editMemoId !== UNKNOWN_ID && editorState.editMemoId !== prevGlobalStateRef.current.editMemoId ) { - const memo = memoService.getMemoById(editorState.editMemoId ?? UNKNOWN_ID); - if (memo) { - setState({ - ...state, - resourceList: memo.resourceList, - }); - editorRef.current?.setContent(memo.content ?? ""); - editorRef.current?.focus(); - } + memoService.getMemoById(editorState.editMemoId ?? UNKNOWN_ID).then((memo) => { + if (memo) { + setState({ + ...state, + resourceList: memo.resourceList, + }); + editorRef.current?.setContent(memo.content ?? ""); + editorRef.current?.focus(); + } + }); } prevGlobalStateRef.current = editorState; + if (editorState.editMemoId) { + storage.set({ + editingMemoIdCache: editorState.editMemoId, + }); + } else { + storage.remove(["editingMemoIdCache"]); + } }, [state, editorState.editMemoId]); const handleKeyDown = (event: React.KeyboardEvent) => { @@ -175,7 +190,7 @@ const MemoEditor: React.FC = () => { try { const { editMemoId } = editorStateService.getState(); if (editMemoId && editMemoId !== UNKNOWN_ID) { - const prevMemo = memoService.getMemoById(editMemoId ?? UNKNOWN_ID); + const prevMemo = await memoService.getMemoById(editMemoId ?? UNKNOWN_ID); if (prevMemo) { await memoService.patchMemo({ @@ -206,7 +221,7 @@ const MemoEditor: React.FC = () => { editorRef.current?.setContent(""); }; - const handleCancelEditing = () => { + const handleCancelEdit = () => { setState({ ...state, resourceList: [], @@ -348,7 +363,7 @@ const MemoEditor: React.FC = () => { >
{t("editor.editing")} -
diff --git a/web/src/helpers/storage.ts b/web/src/helpers/storage.ts index e767ecfe..2509157b 100644 --- a/web/src/helpers/storage.ts +++ b/web/src/helpers/storage.ts @@ -4,6 +4,8 @@ interface StorageData { // Editor content cache editorContentCache: string; + // Editing memo id cache + editingMemoIdCache: MemoId; // locale locale: Locale; } diff --git a/web/src/services/memoService.ts b/web/src/services/memoService.ts index 277c51d3..a00511e2 100644 --- a/web/src/services/memoService.ts +++ b/web/src/services/memoService.ts @@ -71,19 +71,18 @@ const memoService = { fetchMemoById: async (memoId: MemoId) => { const { data } = (await api.getMemoById(memoId)).data; const memo = convertResponseModelMemo(data); - store.dispatch(patchMemo(memo)); return memo; }, - getMemoById: (memoId: MemoId) => { + getMemoById: async (memoId: MemoId) => { for (const m of memoService.getState().memos) { if (m.id === memoId) { return m; } } - return null; + return await memoService.fetchMemoById(memoId); }, updateTagsState: async () => {