From 9f141fa9af824b51d03f6b975b90e259c7568198 Mon Sep 17 00:00:00 2001
From: Joe Savona <joesavona@fb.com>
Date: Mon, 10 Jun 2024 09:52:18 -0700
Subject: [PATCH] Update on "[compiler] Type `ref` prop as a ref"

Adds a shape type for component props, which has one defined property: "ref". This means that if the ref property exists, we can type usage of `props.ref` (or via destructuring) the same as the result of `useRef()` and infer downstream usage similarly.

[ghstack-poisoned]
---
 ...invalid-write-ref-prop-in-render.expect.md | 27 +++++++++++++++++++
 .../error.invalid-write-ref-prop-in-render.js |  6 +++++
 2 files changed, 33 insertions(+)
 create mode 100644 compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-write-ref-prop-in-render.expect.md
 create mode 100644 compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-write-ref-prop-in-render.js

diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-write-ref-prop-in-render.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-write-ref-prop-in-render.expect.md
new file mode 100644
index 0000000000000..c00aaca4fe3a3
--- /dev/null
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-write-ref-prop-in-render.expect.md
@@ -0,0 +1,27 @@
+
+## Input
+
+```javascript
+// @validateRefAccessDuringRender @compilationMode(infer)
+function Component(props) {
+  const ref = props.ref;
+  ref.current = true;
+  return <div>{value}</div>;
+}
+
+```
+
+
+## Error
+
+```
+  2 | function Component(props) {
+  3 |   const ref = props.ref;
+> 4 |   ref.current = true;
+    |   ^^^^^^^^^^^ InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef) (4:4)
+  5 |   return <div>{value}</div>;
+  6 | }
+  7 |
+```
+          
+      
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-write-ref-prop-in-render.js b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-write-ref-prop-in-render.js
new file mode 100644
index 0000000000000..b939ea540bd13
--- /dev/null
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-write-ref-prop-in-render.js
@@ -0,0 +1,6 @@
+// @validateRefAccessDuringRender @compilationMode(infer)
+function Component(props) {
+  const ref = props.ref;
+  ref.current = true;
+  return <div>{value}</div>;
+}