diff --git a/pages/docs/react/latest/migrate-react.mdx b/pages/docs/react/latest/migrate-react.mdx
index 799caeee2..df25f2fa5 100644
--- a/pages/docs/react/latest/migrate-react.mdx
+++ b/pages/docs/react/latest/migrate-react.mdx
@@ -211,3 +211,32 @@ let make = () => {
   </div>
 }
 ```
+
+### Mangling the prop name
+
+The prop name was mangled automatically in v3, such as `_open` becomes `open` in the generated js code. This is no longer the case in v4 because the internal representation is changed to the record instead object. If you need to mangle the prop name, you can use the `@as` annotation.
+
+Rewrite this:
+
+```res
+module Comp = {
+  @react.component
+  let make = (~_open, ~_type) =>
+    <Modal _open _type>
+      <Description />
+    </Modal>
+}
+```
+
+To this:
+
+```res
+module Comp = {
+  @react.component
+  let make =
+    (@as("open") ~_open, @as("type") ~_type) =>
+      <Modal _open _type>
+        <Description />
+      </Modal>
+}
+```