#140

frontend/src/components/PostList.tsx

@@ -11,7 +11,8 @@ type Props = { posts:     Post[]
 export default (({ posts, onClick }: Props) => (
     <div className="flex flex-wrap gap-6 p-4">
       {posts.map ((post, i) => (
-	  <PrefetchLink to={`/posts/${ post.id }`}
+	  <PrefetchLink
+	      to={`/posts/${ post.id }`}
 	      key={post.id}
 	      className="w-40 h-40 overflow-hidden rounded-lg shadow-md hover:shadow-lg"
 	      onClick={onClick}>

frontend/src/pages/posts/PostDetailPage.tsx

@@ -43,19 +43,19 @@ export default (({ user }: Props) => {
 	return next
       },
       onMutate: async () => {
-	await qc.cancelQueries ({ queryKey: ['post', String (id)] })
-	const prev = qc.getQueryData<any> (['post', String (id)])
-	qc.setQueryData (['post', String (id)],
+	await qc.cancelQueries ({ queryKey: ['posts', String (id)] })
+	const prev = qc.getQueryData<any> (['posts', String (id)])
+	qc.setQueryData (['posts', String (id)],
 			 (cur: any) => cur ? { ...cur, viewed: !(cur.viewed) } : cur)
 	return { prev }
       },
       onError: (...[, , ctx]) => {
 	if (ctx?.prev)
-	  qc.setQueryData (['post', String (id)], ctx.prev)
+	  qc.setQueryData (['posts', String (id)], ctx.prev)
 	toast ({ title: '失敗……', description: '通信に失敗しました……' })
       },
       onSuccess: () => {
-	qc.invalidateQueries ({ queryKey: ['posts'] })
+	qc.invalidateQueries ({ queryKey: ['posts', 'index'] })
 	qc.invalidateQueries ({ queryKey: ['related', String (id)] })
       } })