Merge pull request #10 from Nekiiinkognito/feature/fixVoteCounter

Feature/fix vote counter

enshi/package.json

@@ -1,7 +1,7 @@
 {
   "name": "enshi",
   "private": true,
-  "version": "0.1.6",
+  "version": "0.1.7",
   "type": "module",
   "scripts": {
     "dev": "vite",

enshi/src/Components/ArticleViewer/VoteButton/VoteButton.tsx

@@ -48,7 +48,7 @@ export default function VoteButton(props: TVoteButton) {
                 queryKey: [props.vote + "voteCheck"],
             });
             queryClient.invalidateQueries({
-                queryKey: ["post_vote_counter"],
+                queryKey: [`post_vote_counter_${props.postId}`],
             });
         },
     });

enshi/src/Components/ArticleViewer/VoteCounter/VoteCounter.tsx

@@ -8,13 +8,14 @@ type TVoteCounter = {
 
 export default function VoteCounter(props: TVoteCounter) {
     const { data, isLoading } = useQuery({
-        queryKey: ["post_vote_counter"],
+        queryKey: [`post_vote_counter_${props.postId}` ],
         queryFn: async () => {
             const response = await axiosLocalhost.get(
                 `post-votes/${props.postId}`
             );
             return response.data as { upvotes: number; downvotes: number };
         },
+        gcTime: 1000 * 60, 
     });
 
     const calculateRating = (upvotes: number, downvotes: number) => {
@@ -22,12 +23,12 @@ export default function VoteCounter(props: TVoteCounter) {
     }
 
     if (isLoading) {
-        return <Skeleton>
+        return <Skeleton className="w-4">
             {calculateRating(0, 0)}
         </Skeleton>
     }
 
-    return <Box>
+    return <Box className="flex justify-center w-4 gap-2">
         {calculateRating(data?.upvotes || 0, data?.downvotes || 0)}
     </Box>;
 }