diff --git a/src/app/(routes)/document/[id]/(main)/@header/default.tsx b/src/app/(routes)/document/[id]/(main)/@header/default.tsx index 49ca712f..813a18c9 100644 --- a/src/app/(routes)/document/[id]/(main)/@header/default.tsx +++ b/src/app/(routes)/document/[id]/(main)/@header/default.tsx @@ -17,8 +17,8 @@ import GoBackButton from '@/shared/components/custom/go-back-button' import { getRelativeTime } from '@/shared/utils/date' import { useQuery } from '@tanstack/react-query' import { queries } from '@/shared/lib/tanstack-query/query-keys' -import { deleteDocument } from '@/requests/document' import ConfirmDialogWidget from '@/widget/confirm-dialog' +import { useDeleteDocument } from '@/requests/document/hooks' // Header 컴포넌트 const Header = () => { @@ -26,6 +26,7 @@ const Header = () => { const { id } = useParams() const { getPreviousPath } = usePreviousPath({ getCustomPath: true }) const { data } = useQuery(queries.document.item(Number(id))) + const { mutate: deleteDocumentMutation } = useDeleteDocument() const handleClickCancel = () => { const previousPath = getPreviousPath() @@ -38,10 +39,10 @@ const Header = () => { } } - const handleClickDelete = async () => { - await deleteDocument({ documentIds: [Number(id)] }) - - router.push('/document') + const handleClickDelete = () => { + deleteDocumentMutation([Number(id)], { + onSuccess: () => router.push('/document'), + }) } return ( diff --git a/src/app/(routes)/document/[id]/modify/@header/default.tsx b/src/app/(routes)/document/[id]/modify/@header/default.tsx index b5e5ff39..3f62f4fc 100644 --- a/src/app/(routes)/document/[id]/modify/@header/default.tsx +++ b/src/app/(routes)/document/[id]/modify/@header/default.tsx @@ -11,14 +11,11 @@ import { useParams, useRouter } from 'next/navigation' const Header = () => { const { id } = useParams() const router = useRouter() - const { mutate: updateDocumentMutate } = useUpdateDocument() + const { mutate: updateDocumentMutate } = useUpdateDocument(Number(id)) const { documentTitle: title, editorMarkdownContent: content } = useEditDocumentContext() const { selectedDirectory } = useDirectoryContext() const handleClickSave = (id: number, title: string, content: string) => { - // eslint-disable-next-line no-console - console.log(title, content) - if (title.trim().length === 0 || content.trim().length === 0) { alert('제목과 내용을 입력해주세요') return diff --git a/src/features/directory/components/directory-menu-dots/index.tsx b/src/features/directory/components/directory-menu-dots/index.tsx index 6fc2e435..7b9ecf23 100644 --- a/src/features/directory/components/directory-menu-dots/index.tsx +++ b/src/features/directory/components/directory-menu-dots/index.tsx @@ -22,8 +22,7 @@ const DirectoryMenuDots = () => { const handleClickDelete = () => { if (!selectedDirectoryId) return - deleteDirectoryMutation(selectedDirectoryId) - window.location.reload() + deleteDirectoryMutation(selectedDirectoryId, { onSuccess: () => window.location.reload() }) } return ( diff --git a/src/requests/document/hooks.ts b/src/requests/document/hooks.ts index 881c91cb..e1341e24 100644 --- a/src/requests/document/hooks.ts +++ b/src/requests/document/hooks.ts @@ -7,6 +7,9 @@ import { deleteDocument, moveDocument, updateDocument } from '.' import { queries } from '@/shared/lib/tanstack-query/query-keys' import { getQueryClient } from '@/shared/lib/tanstack-query/client' +/** + * 문서 생성 Hook + */ export const useCreateDocument = () => { const { data: session } = useSession() @@ -16,12 +19,15 @@ export const useCreateDocument = () => { }) } +/** + * 문서 수정 Hook + */ export const useUpdateDocument = (documentId: number) => { const queryClient = getQueryClient() return useMutation({ - mutationFn: (params: { documentId: number; requestBody: Document.Request.UpdateContent }) => - updateDocument(params.documentId, params.requestBody), + mutationFn: (payload: { documentId: number; requestBody: Document.Request.UpdateContent }) => + updateDocument(payload.documentId, payload.requestBody), onSuccess: async () => { // 문서 정보 갱신 await queryClient.invalidateQueries(queries.document.item(documentId)) @@ -39,7 +45,7 @@ export const useMoveDocument = (listOption: { const queryClient = getQueryClient() return useMutation({ - mutationFn: async (requestBody: Document.Request.MoveDocument) => moveDocument(requestBody), + mutationFn: async (payload: Document.Request.MoveDocument) => moveDocument(payload), onSuccess: async () => { // 문서 목록 갱신 await queryClient.invalidateQueries(queries.document.list(listOption)) @@ -50,7 +56,7 @@ export const useMoveDocument = (listOption: { /** * 문서 삭제 Hook */ -export const useDeleteDocument = (listOption: { +export const useDeleteDocument = (listOption?: { directoryId?: string sortOption: Document.Sort }) => { @@ -60,7 +66,7 @@ export const useDeleteDocument = (listOption: { mutationFn: async (documentIds: number[]) => deleteDocument({ documentIds }), onSuccess: async () => { // 문서 목록 갱신 - await queryClient.invalidateQueries(queries.document.list(listOption)) + listOption && (await queryClient.invalidateQueries(queries.document.list(listOption))) }, }) }