Skip to content

fix: handwriting API 캐시 전략 개선 #288

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
b0nsu wants to merge 1 commit into
base: develop
Choose a base branch
from
+10 −9
Open

fix: handwriting API 캐시 전략 개선 #288

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 8 additions & 9 deletions apps/native/src/apis/controller/student/scrap/handwriting/putUpdateHandwriting.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,14 +29,13 @@ export const useUpdateHandwriting = () => {
});
return data as UpdateHandwritingResponse;
},
// onSuccess: (_, { scrapId }) => {
// queryClient.invalidateQueries({
// queryKey: TanstackQueryClient.queryOptions(
// 'get',
// '/api/student/scrap/{scrapId}/handwriting',
// { params: { path: { scrapId } } }
// ).queryKey,
// });
// },
onSuccess: (_, { scrapId, request }) => {
queryClient.setQueryData(
TanstackQueryClient.queryOptions('get', '/api/student/scrap/{scrapId}/handwriting', {
params: { path: { scrapId } },
}).queryKey,
{ data: request.data }
Comment on lines +32 to +37
Copy link

Copilot AI Apr 24, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

setQueryData에 { data: request.data }를 넣으면 GET /handwriting 캐시 타입(스크랩 ID/updatedAt 포함 ScrapHandwritingResp)과 shape가 달라지고, 서버가 응답에서 보정한 값/updatedAt도 반영되지 않습니다. onSuccess의 첫 번째 인자인 mutation response를 사용해 캐시를 동일한 응답 객체로 설정하거나, 기존 캐시와 merge해서 scrapId/updatedAt 필드를 유지하도록 수정해 주세요.

Suggested change
onSuccess: (_, { scrapId, request }) => {
queryClient.setQueryData(
TanstackQueryClient.queryOptions('get', '/api/student/scrap/{scrapId}/handwriting', {
params: { path: { scrapId } },
}).queryKey,
{ data: request.data }
onSuccess: (response, { scrapId }) => {
queryClient.setQueryData(
TanstackQueryClient.queryOptions('get', '/api/student/scrap/{scrapId}/handwriting', {
params: { path: { scrapId } },
}).queryKey,
response

Copilot uses AI. Check for mistakes.
);
},
});
};
2 changes: 2 additions & 0 deletions apps/native/src/apis/controller/student/scrap/handwriting/useGetHandwriting.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,8 @@ export const useGetHandwriting = (scrapId: number, enabled = true) => {
},
{
enabled,
staleTime: Infinity,
Copy link

Copilot AI Apr 24, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

staleTime: Infinity로 인해 이 쿼리는 기본적으로 더 이상 stale 상태가 되지 않아, 이후 데이터 변경은 mutation에서 setQueryData/invalidateQueries로 보장해야 합니다. 현재 useDeleteHandwriting는 ['scrap','handwriting',scrapId] 형태의 queryKey를 invalidate하고 있어(openapi-react-query TanstackQueryClient.useQuery의 queryKey와 불일치), 삭제 후에도 이 캐시가 남을 수 있습니다. handwriting 관련 mutation들이 모두 TanstackQueryClient.queryOptions(...).queryKey를 사용하도록 정리하거나, 삭제 시 해당 queryKey에 대해 setQueryData(undefined)/invalidate를 해 주세요.

Suggested change
staleTime: Infinity,

Copilot uses AI. Check for mistakes.
refetchOnWindowFocus: false,
}
);
};
Loading