From 90225a694819f22c53a7259e54abe28b2b50b693 Mon Sep 17 00:00:00 2001
From: Kevan Stannard <kevanstannard@gmail.com>
Date: Mon, 18 Jan 2021 21:07:33 +1100
Subject: [PATCH 1/2] Add Syntax Lookup @react.component decorator

---
 .../syntax/decorator_react_component.mdx      | 37 +++++++++++++++++++
 1 file changed, 37 insertions(+)
 create mode 100644 misc_docs/syntax/decorator_react_component.mdx

diff --git a/misc_docs/syntax/decorator_react_component.mdx b/misc_docs/syntax/decorator_react_component.mdx
new file mode 100644
index 000000000..8fefece7a
--- /dev/null
+++ b/misc_docs/syntax/decorator_react_component.mdx
@@ -0,0 +1,37 @@
+---
+id: "react-component-decorator"
+keywords: ["react", "component", "decorator"]
+name: "@react.component"
+summary: "This is the `@react.component` decorator."
+category: "decorators"
+---
+
+The `@react.component` decorator is used to annotate functions that are [ReasonReact](https://reasonml.github.io/reason-react/en/) components.
+
+### Example
+
+<CodeTab labels={["ReScript", "JS Output"]}>
+
+```res
+@react.component
+let make = (~name) => {
+  <button> {ReasonReact.string("Hello " ++ name ++ "!")} </button>
+}
+```
+
+```js
+var React = require("react");
+
+function MyComponent(Props) {
+  var name = Props.name;
+  return React.createElement("button", undefined, "Hello " + name + "!");
+}
+
+var make = MyComponent;
+```
+
+</CodeTab>
+
+### References
+
+* [ReasonReact Components](https://reasonml.github.io/reason-react/docs/en/components)
\ No newline at end of file

From 6bfb9b9cba203bcd6a46dd55248f8a074fb7a765 Mon Sep 17 00:00:00 2001
From: Kevan Stannard <kevanstannard@gmail.com>
Date: Thu, 21 Jan 2021 08:34:18 +1100
Subject: [PATCH 2/2] Update misc_docs/syntax/decorator_react_component.mdx

Co-authored-by: Patrick Ecker <ryyppy@users.noreply.github.com>
---
 misc_docs/syntax/decorator_react_component.mdx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/misc_docs/syntax/decorator_react_component.mdx b/misc_docs/syntax/decorator_react_component.mdx
index 8fefece7a..51fbcbe82 100644
--- a/misc_docs/syntax/decorator_react_component.mdx
+++ b/misc_docs/syntax/decorator_react_component.mdx
@@ -8,6 +8,10 @@ category: "decorators"
 
 The `@react.component` decorator is used to annotate functions that are [ReasonReact](https://reasonml.github.io/reason-react/en/) components.
 
+You will need this decorator whenever you want to use a ReScript / React component in ReScript JSX expressions.
+
+**Note:** The `@react.component` decorator requires the [react-jsx config](/docs/manual/latest/build-configuration#reason-refmt-old) to be set in your `bsconfig.json` to enable the required React transformations. 
+
 ### Example
 
 <CodeTab labels={["ReScript", "JS Output"]}>
@@ -34,4 +38,4 @@ var make = MyComponent;
 
 ### References
 
-* [ReasonReact Components](https://reasonml.github.io/reason-react/docs/en/components)
\ No newline at end of file
+* [ReasonReact Components](https://reasonml.github.io/reason-react/docs/en/components)