compiler: Known hooks/nonescaping scopes dont count as pruned

compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/FlattenScopesWithHooksOrUse.ts

@@ -66,6 +66,16 @@
     this.visitScope(scope, innerState);
     outerState.hasHook ||= innerState.hasHook;
     if (innerState.hasHook) {
+      if (scope.instructions.length === 1) {
+        // This was a scope just for a hook call, which doesn't need memoization.
+        // flatten it away
+        return {
+          kind: "replace-many",
+          value: scope.instructions,
+        };
+      }
+      // else this scope had multiple instructions and produced some other value:
+      // mark it as pruned
       return {
         kind: "replace",
         value: {

compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/PruneNonEscapingScopes.ts

@@ -951,12 +951,8 @@ class PruneScopesTransform extends ReactiveFunctionTransform<
     } else {
       this.prunedScopes.add(scopeBlock.scope.id);
       return {
-        kind: "replace",
-        value: {
-          kind: "pruned-scope",
-          scope: scopeBlock.scope,
-          instructions: scopeBlock.instructions,
-        },
+        kind: "replace-many",
+        value: scopeBlock.instructions,
       };
     }
   }

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/nonreactive-noescaping-dependency-can-inline-into-consuming-scope.expect.md

@@ -0,0 +1,46 @@
+
+## Input
+
+```javascript
+// @flow
+function Component() {
+  return (
+    <div
+      className={stylex(
+        // this value is a) in its own scope, b) non-reactive, and c) non-escaping
+        // its scope gets pruned bc it's non-escaping, but this doesn't mean we need to
+        // create a temporary for it
+        flags.feature("feature-name") ? styles.featureNameStyle : null
+      )}
+    ></div>
+  );
+}
+
+```
+
+## Code
+
+```javascript
+import { c as _c } from "react/compiler-runtime";
+function Component() {
+  const $ = _c(1);
+  let t0;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t0 = (
+      <div
+        className={stylex(
+          flags.feature("feature-name") ? styles.featureNameStyle : null,
+        )}
+      />
+    );
+    $[0] = t0;
+  } else {
+    t0 = $[0];
+  }
+  return t0;
+}
+
+```
+
+### Eval output
+(kind: exception) Fixture not implemented

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/nonreactive-noescaping-dependency-can-inline-into-consuming-scope.js

@@ -0,0 +1,13 @@
+// @flow
+function Component() {
+  return (
+    <div
+      className={stylex(
+        // this value is a) in its own scope, b) non-reactive, and c) non-escaping
+        // its scope gets pruned bc it's non-escaping, but this doesn't mean we need to
+        // create a temporary for it
+        flags.feature("feature-name") ? styles.featureNameStyle : null
+      )}
+    ></div>
+  );
+}

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/reactive-control-dependency-from-interleaved-reactivity-for-of.expect.md

@@ -39,7 +39,7 @@ export const FIXTURE_ENTRYPOINT = {
 ```javascript
 import { c as _c } from "react/compiler-runtime";
 function Component(props) {
-  const $ = _c(2);
+  const $ = _c(1);
 
   const a = [];
   const b = [];
@@ -53,12 +53,11 @@ function Component(props) {
     x = 1;
   }
   let t0;
-  if ($[0] !== x) {
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
     t0 = [x];
-    $[0] = x;
-    $[1] = t0;
+    $[0] = t0;
   } else {
-    t0 = $[1];
+    t0 = $[0];
   }
   return t0;
 }