diff --git a/web/src/components/MemoActionMenu/hooks.ts b/web/src/components/MemoActionMenu/hooks.ts index 67a889f36..e4e52b63c 100644 --- a/web/src/components/MemoActionMenu/hooks.ts +++ b/web/src/components/MemoActionMenu/hooks.ts @@ -4,7 +4,7 @@ import { useCallback } from "react"; import toast from "react-hot-toast"; import { useLocation } from "react-router-dom"; import { useInstance } from "@/contexts/InstanceContext"; -import { useDeleteMemo, useUpdateMemo } from "@/hooks/useMemoQueries"; +import { memoKeys, useDeleteMemo, useUpdateMemo } from "@/hooks/useMemoQueries"; import useNavigateTo from "@/hooks/useNavigateTo"; import { userKeys } from "@/hooks/useUserQueries"; import { handleError } from "@/lib/error"; @@ -98,13 +98,20 @@ export const useMemoActionHandlers = ({ memo, onEdit, setDeleteDialogOpen }: Use }, [setDeleteDialogOpen]); const confirmDeleteMemo = useCallback(async () => { - await deleteMemo(memo.name); + await deleteMemo(memo.name, { + onSuccess: () => { + // If this was a comment, refresh the parent memo's comments list so it disappears from the UI + if (memo.parent) { + queryClient.invalidateQueries({ queryKey: memoKeys.comments(memo.parent) }); + } + }, + }); toast.success(t("message.deleted-successfully")); if (isInMemoDetailPage) { navigateTo("/"); } memoUpdatedCallback(); - }, [memo.name, t, isInMemoDetailPage, navigateTo, memoUpdatedCallback, deleteMemo]); + }, [memo.name, memo.parent, t, isInMemoDetailPage, navigateTo, memoUpdatedCallback, deleteMemo, queryClient]); return { handleTogglePinMemoBtnClick, diff --git a/web/src/components/MemoReactionListView/hooks.ts b/web/src/components/MemoReactionListView/hooks.ts index 6e83b8b33..c6a3a32db 100644 --- a/web/src/components/MemoReactionListView/hooks.ts +++ b/web/src/components/MemoReactionListView/hooks.ts @@ -61,6 +61,10 @@ export const useReactionActions = ({ memo, onComplete }: UseReactionActionsOptio const updatedMemo = await memoServiceClient.getMemo({ name: memo.name }); queryClient.setQueryData(memoKeys.detail(memo.name), updatedMemo); queryClient.invalidateQueries({ queryKey: memoKeys.lists() }); + // If this memo is a comment, refresh the parent's comments list so the comment's reactions update in the UI + if (memo.parent) { + queryClient.invalidateQueries({ queryKey: memoKeys.comments(memo.parent) }); + } } catch { // skip error }