diff --git a/src/apis/index.ts b/src/apis/index.ts index 5c3e24d..ddf0ae7 100644 --- a/src/apis/index.ts +++ b/src/apis/index.ts @@ -26,11 +26,12 @@ const getToken = async (tokeName: string) => { const setForwardedForByServer = async (config: AxiosRequestConfig) => { if (!isServer || !config.headers) return; - config.headers["x-forwarded-for"] = (await import("next/headers")) - .headers() - .get("x-forwarded-for"); + const ips = (await import("next/headers")).headers().get("x-forwarded-for")?.split(", ") ?? []; - config.headers["x-real-ip"] = (await import("next/headers")).headers().get("x-real-ip"); + if (ips.length === 0) return; + + config.headers["x-forwarded-for"] = ips[0]; + config.headers["x-real-ip"] = ips[0]; }; api.interceptors.request.use(async (config) => { diff --git a/src/hooks/query/post.ts b/src/hooks/query/post.ts index 937e2f5..95af668 100644 --- a/src/hooks/query/post.ts +++ b/src/hooks/query/post.ts @@ -101,7 +101,8 @@ const useLikePostMutation = (nid: number) => { onMutate: () => { queryClient.cancelQueries(["post", nid]); - const prev = queryClient.getQueryData(["post", nid]); + const post = queryClient.getQueryData(["post", nid]); + const posts = queryClient.getQueryData(["posts"]); queryClient.setQueryData(["post", nid], (prev) => { if (!prev) return prev; @@ -109,10 +110,25 @@ const useLikePostMutation = (nid: number) => { return { ...prev, isLiked: true, likeCount: prev.likeCount + 1 }; }); - return prev; + queryClient.setQueryData(["posts"], (prev) => { + if (!prev) return prev; + + return prev.map((post) => { + if (post.nid !== nid) return post; + + return { ...post, isLiked: true, likeCount: post.likeCount + 1 }; + }); + }); + + return { post, posts }; }, onError: (err, _, prev) => { - queryClient.setQueryData(["post", nid], prev); + if (!prev) return; + + const { post, posts } = prev; + + queryClient.setQueryData(["post", nid], post); + queryClient.setQueryData(["posts"], posts); }, onSettled: () => { queryClient.invalidateQueries(["post", nid]); @@ -128,7 +144,8 @@ const useUnlikePostMutation = (nid: number) => { onMutate: () => { queryClient.cancelQueries(["post", nid]); - const prev = queryClient.getQueryData(["post", nid]); + const post = queryClient.getQueryData(["post", nid]); + const posts = queryClient.getQueryData(["posts"]); queryClient.setQueryData(["post", nid], (prev) => { if (!prev) return prev; @@ -136,10 +153,25 @@ const useUnlikePostMutation = (nid: number) => { return { ...prev, isLiked: false, likeCount: prev.likeCount - 1 }; }); - return prev; + queryClient.setQueryData(["posts"], (prev) => { + if (!prev) return prev; + + return prev.map((post) => { + if (post.nid !== nid) return post; + + return { ...post, isLiked: false, likeCount: post.likeCount - 1 }; + }); + }); + + return { post, posts }; }, onError: (err, _, prev) => { - queryClient.setQueryData(["post", nid], prev); + if (!prev) return; + + const { post, posts } = prev; + + queryClient.setQueryData(["post", nid], post); + queryClient.setQueryData(["posts"], posts); }, onSettled: () => { queryClient.invalidateQueries(["post", nid]); diff --git a/src/styles/globals.css b/src/styles/globals.css index 54f4902..4cf896c 100644 --- a/src/styles/globals.css +++ b/src/styles/globals.css @@ -74,7 +74,7 @@ body { overflow: overlay; - @apply m-0 bg-primary text-base transition-[background-color]; + @apply m-0 bg-primary text-base; } a { @@ -119,11 +119,11 @@ ::-webkit-scrollbar-track { box-shadow: none; - background-color: none; + background: none; } ::-webkit-scrollbar-thumb { - background-color: theme(textColor.secondary); + background: theme(textColor.secondary); @apply rounded-lg; }