diff --git a/compiler/forget/packages/babel-plugin-react-forget/src/HIR/BuildHIR.ts b/compiler/forget/packages/babel-plugin-react-forget/src/HIR/BuildHIR.ts
index f5244c6aab..dfdd840a21 100644
--- a/compiler/forget/packages/babel-plugin-react-forget/src/HIR/BuildHIR.ts
+++ b/compiler/forget/packages/babel-plugin-react-forget/src/HIR/BuildHIR.ts
@@ -2215,6 +2215,20 @@ function lowerMemberExpression(
const object =
loweredObject ?? lowerExpressionToTemporary(builder, objectNode);
+ if (objectNode.isIdentifier() && objectNode.node.name === "React") {
+ builder.errors.push({
+ reason: `(BuildHIR::lowerMemberExpression) Handle loading properties from React namespace`,
+ severity: ErrorSeverity.Todo,
+ loc: propertyNode.node.loc ?? null,
+ suggestions: null,
+ });
+ return {
+ object,
+ property: propertyNode.toString(),
+ value: { kind: "UnsupportedNode", node: exprNode, loc: exprLoc },
+ };
+ }
+
if (!expr.node.computed) {
if (!propertyNode.isIdentifier()) {
builder.errors.push({
diff --git a/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/_bug.hooks-with-React-namespace.expect.md b/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/_bug.hooks-with-React-namespace.expect.md
deleted file mode 100644
index 2b2384dede..0000000000
--- a/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/_bug.hooks-with-React-namespace.expect.md
+++ /dev/null
@@ -1,30 +0,0 @@
-
-## Input
-
-```javascript
-function Foo() {
- const [x, setX] = React.useState(1);
- return x;
-}
-
-```
-
-## Code
-
-```javascript
-import { unstable_useMemoCache as useMemoCache } from "react";
-function Foo() {
- const $ = useMemoCache(1);
- let t0;
- if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
- t0 = React.useState(1);
- $[0] = t0;
- } else {
- t0 = $[0];
- }
- const [x] = t0;
- return x;
-}
-
-```
-
\ No newline at end of file
diff --git a/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/babel-existing-react-kitchensink-import.expect.md b/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/babel-existing-react-kitchensink-import.expect.md
index 3ff22edbed..08d7f400a4 100644
--- a/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/babel-existing-react-kitchensink-import.expect.md
+++ b/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/babel-existing-react-kitchensink-import.expect.md
@@ -3,18 +3,18 @@
```javascript
import * as React from "react";
-import { useState } from "react";
+import { useState, useMemo } from "react";
function Component(props) {
const [x] = useState(0);
- const expensiveNumber = React.useMemo(() => calculateExpensiveNumber(x), [x]);
+ const expensiveNumber = useMemo(() => calculateExpensiveNumber(x), [x]);
return
{expensiveNumber}
;
}
function Component2(props) {
const [x] = useState(0);
- const expensiveNumber = React.useMemo(() => calculateExpensiveNumber(x), [x]);
+ const expensiveNumber = useMemo(() => calculateExpensiveNumber(x), [x]);
return {expensiveNumber}
;
}
@@ -25,74 +25,62 @@ function Component2(props) {
```javascript
import * as React from "react";
-import { useState, unstable_useMemoCache as useMemoCache } from "react";
+import {
+ useState,
+ useMemo,
+ unstable_useMemoCache as useMemoCache,
+} from "react";
function Component(props) {
- const $ = useMemoCache(6);
+ const $ = useMemoCache(4);
const [x] = useState(0);
const c_0 = $[0] !== x;
- let t1;
+ let t0;
if (c_0) {
- const c_2 = $[2] !== x;
- let t0;
- if (c_2) {
- t0 = () => calculateExpensiveNumber(x);
- $[2] = x;
- $[3] = t0;
- } else {
- t0 = $[3];
- }
- t1 = React.useMemo(t0, [x]);
+ t0 = calculateExpensiveNumber(x);
$[0] = x;
- $[1] = t1;
+ $[1] = t0;
} else {
- t1 = $[1];
+ t0 = $[1];
}
- const expensiveNumber = t1;
- const c_4 = $[4] !== expensiveNumber;
- let t2;
- if (c_4) {
- t2 = {expensiveNumber}
;
- $[4] = expensiveNumber;
- $[5] = t2;
+ const t15 = t0;
+ const expensiveNumber = t15;
+ const c_2 = $[2] !== expensiveNumber;
+ let t1;
+ if (c_2) {
+ t1 = {expensiveNumber}
;
+ $[2] = expensiveNumber;
+ $[3] = t1;
} else {
- t2 = $[5];
+ t1 = $[3];
}
- return t2;
+ return t1;
}
function Component2(props) {
- const $ = useMemoCache(6);
+ const $ = useMemoCache(4);
const [x] = useState(0);
const c_0 = $[0] !== x;
- let t1;
+ let t0;
if (c_0) {
- const c_2 = $[2] !== x;
- let t0;
- if (c_2) {
- t0 = () => calculateExpensiveNumber(x);
- $[2] = x;
- $[3] = t0;
- } else {
- t0 = $[3];
- }
- t1 = React.useMemo(t0, [x]);
+ t0 = calculateExpensiveNumber(x);
$[0] = x;
- $[1] = t1;
+ $[1] = t0;
} else {
- t1 = $[1];
+ t0 = $[1];
}
- const expensiveNumber = t1;
- const c_4 = $[4] !== expensiveNumber;
- let t2;
- if (c_4) {
- t2 = {expensiveNumber}
;
- $[4] = expensiveNumber;
- $[5] = t2;
+ const t15 = t0;
+ const expensiveNumber = t15;
+ const c_2 = $[2] !== expensiveNumber;
+ let t1;
+ if (c_2) {
+ t1 = {expensiveNumber}
;
+ $[2] = expensiveNumber;
+ $[3] = t1;
} else {
- t2 = $[5];
+ t1 = $[3];
}
- return t2;
+ return t1;
}
```
diff --git a/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/babel-existing-react-kitchensink-import.js b/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/babel-existing-react-kitchensink-import.js
index 4880c50eb2..39bcae9d69 100644
--- a/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/babel-existing-react-kitchensink-import.js
+++ b/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/babel-existing-react-kitchensink-import.js
@@ -1,16 +1,16 @@
import * as React from "react";
-import { useState } from "react";
+import { useState, useMemo } from "react";
function Component(props) {
const [x] = useState(0);
- const expensiveNumber = React.useMemo(() => calculateExpensiveNumber(x), [x]);
+ const expensiveNumber = useMemo(() => calculateExpensiveNumber(x), [x]);
return {expensiveNumber}
;
}
function Component2(props) {
const [x] = useState(0);
- const expensiveNumber = React.useMemo(() => calculateExpensiveNumber(x), [x]);
+ const expensiveNumber = useMemo(() => calculateExpensiveNumber(x), [x]);
return {expensiveNumber}
;
}
diff --git a/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/babel-existing-react-namespace-import.expect.md b/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/babel-existing-react-namespace-import.expect.md
deleted file mode 100644
index 8128495d2e..0000000000
--- a/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/babel-existing-react-namespace-import.expect.md
+++ /dev/null
@@ -1,72 +0,0 @@
-
-## Input
-
-```javascript
-import * as React from "react";
-
-function Component(props) {
- const [x] = React.useState(0);
- const expensiveNumber = React.useMemo(() => calculateExpensiveNumber(x), [x]);
-
- return {expensiveNumber}
;
-}
-
-function Component2(props) {
- const [x] = React.useState(0);
- const expensiveNumber = React.useMemo(() => calculateExpensiveNumber(x), [x]);
-
- return {expensiveNumber}
;
-}
-
-```
-
-## Code
-
-```javascript
-import { unstable_useMemoCache as useMemoCache } from "react";
-import * as React from "react";
-
-function Component(props) {
- const $ = useMemoCache(2);
- let t0;
- if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
- const [x] = React.useState(0);
- t0 = React.useMemo(() => calculateExpensiveNumber(x), [x]);
- $[0] = t0;
- } else {
- t0 = $[0];
- }
- const expensiveNumber = t0;
- let t1;
- if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
- t1 = {expensiveNumber}
;
- $[1] = t1;
- } else {
- t1 = $[1];
- }
- return t1;
-}
-
-function Component2(props) {
- const $ = useMemoCache(2);
- let t0;
- if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
- const [x] = React.useState(0);
- t0 = React.useMemo(() => calculateExpensiveNumber(x), [x]);
- $[0] = t0;
- } else {
- t0 = $[0];
- }
- const expensiveNumber = t0;
- let t1;
- if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
- t1 = {expensiveNumber}
;
- $[1] = t1;
- } else {
- t1 = $[1];
- }
- return t1;
-}
-
-```
-
\ No newline at end of file
diff --git a/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.babel-existing-react-namespace-import.expect.md b/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.babel-existing-react-namespace-import.expect.md
new file mode 100644
index 0000000000..14c60a6ec2
--- /dev/null
+++ b/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.babel-existing-react-namespace-import.expect.md
@@ -0,0 +1,32 @@
+
+## Input
+
+```javascript
+import * as React from "react";
+
+function Component(props) {
+ const [x] = React.useState(0);
+ const expensiveNumber = React.useMemo(() => calculateExpensiveNumber(x), [x]);
+
+ return {expensiveNumber}
;
+}
+
+function Component2(props) {
+ const [x] = React.useState(0);
+ const expensiveNumber = React.useMemo(() => calculateExpensiveNumber(x), [x]);
+
+ return {expensiveNumber}
;
+}
+
+```
+
+
+## Error
+
+```
+[ReactForget] Todo: (BuildHIR::lowerMemberExpression) Handle loading properties from React namespace (4:4)
+
+[ReactForget] Todo: (BuildHIR::lowerMemberExpression) Handle loading properties from React namespace (5:5)
+```
+
+
\ No newline at end of file
diff --git a/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/babel-existing-react-namespace-import.js b/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.babel-existing-react-namespace-import.js
similarity index 100%
rename from compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/babel-existing-react-namespace-import.js
rename to compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.babel-existing-react-namespace-import.js
diff --git a/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.hooks-with-React-namespace.expect.md b/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.hooks-with-React-namespace.expect.md
new file mode 100644
index 0000000000..6e9f92625a
--- /dev/null
+++ b/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.hooks-with-React-namespace.expect.md
@@ -0,0 +1,19 @@
+
+## Input
+
+```javascript
+function Foo() {
+ const [x, setX] = React.useState(1);
+ return x;
+}
+
+```
+
+
+## Error
+
+```
+[ReactForget] Todo: (BuildHIR::lowerMemberExpression) Handle loading properties from React namespace (2:2)
+```
+
+
\ No newline at end of file
diff --git a/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/_bug.hooks-with-React-namespace.js b/compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.hooks-with-React-namespace.js
similarity index 100%
rename from compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/_bug.hooks-with-React-namespace.js
rename to compiler/forget/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.hooks-with-React-namespace.js