diff --git a/docs/suspensive.org/src/pages/en/docs/react-query/Mutation.mdx b/docs/suspensive.org/src/pages/en/docs/react-query/Mutation.mdx
new file mode 100644
index 000000000..3d8198001
--- /dev/null
+++ b/docs/suspensive.org/src/pages/en/docs/react-query/Mutation.mdx
@@ -0,0 +1,93 @@
+import { Callout, Sandpack } from '@/components'
+
+# Mutation
+
+Similar to how [``](/docs/react-query/SuspenseQuery) allows `useSuspenseQuery` to be used at the same depth, `` facilitates the use of `useMutation` at the same depth.
+
+```jsx /Mutation/
+import { Mutation } from '@suspensive/react-query'
+import { useSuspenseQuery } from '@tanstack/react-query'
+
+const PostsPage = () => {
+ const { data: posts } = useSuspenseQuery({
+ queryKey: ['posts'],
+ queryFn: () => getPosts(),
+ });
+
+ return posts.map(post => (
+ api.editPost({ postId: post.id, content })}
+ >
+ {postMutation => (
+ <>
+ {post.content}
+ {post.comments.map(comment => (
+ api.editComment({ postId: post.id, commentId: comment.id, content })}
+ >
+ {commentMutation => (
+
+ {postMutation.isLoading ? : null}
+ {comment.content}
+
+ )}
+
+ ))}
+ >
+ )}
+
+ ));
+}
+```
+
+### Motivation: useMutation Creates Unnecessary Depth
+
+The existing useMutation is a hook, which leads to the creation of components like PostToUseMutation and CommentToUseMutation. This creates unnecessary depth and results in awkward component names, making the structure less flexible and harder to manage due to coupling with parent components.
+
+```jsx /useMutation/
+import { useMutation } from '@tanstack/react-query'
+
+const PostsPage = () => {
+ const posts = usePosts();
+
+ return posts.map(post => );
+};
+
+// PostToUseMutation (unnecessary name, needs to be refactored to use only useMutation)
+const PostToUseMutation = ({ post }: { post: Post }) => { // Props need to be passed to useMutation.
+ const postMutation = useMutation({
+ mutationFn: ({ content }: { content: string }) => api.editPost({ postId: post.id, content }),
+ });
+
+ if (postMutation.isLoading) {
+ return ;
+ }
+
+ return (
+ <>
+
{post.content}
+