[compiler][be] Promote destructured params to temporaries

Addresses a follow-up from the previous PR. Destructured function params are currently not eagerly promoted to temporaries: we wait until PromotedUsedTemporaries. But params _always_ have to be named, so we can promote when constructing HIR.

ghstack-source-id: a6f665762ebcb7b06b118fcaf7515b8021645eae
Pull Request resolved: https://github.com/facebook/react/pull/30332

compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts

@@ -129,6 +129,7 @@ export function lower(
         reactive: false,
         loc: param.node.loc ?? GeneratedSource,
       };
+      promoteTemporary(place.identifier);
       params.push(place);
       lowerAssignment(
         builder,

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

@@ -41,7 +41,6 @@ import {
   ValidIdentifierName,
   getHookKind,
   makeIdentifierName,
-  promoteTemporary,
 } from "../HIR/HIR";
 import { printIdentifier, printPlace } from "../HIR/PrintHIR";
 import { eachPatternOperand } from "../HIR/visitors";
@@ -278,16 +277,6 @@ export function codegenFunction(
     pruneUnusedLValues(reactiveFunction);
     pruneHoistedContexts(reactiveFunction);
 
-    /*
-     * TODO: temporary function params (due to destructuring) should always be
-     * promoted so that they can be renamed
-     */
-    for (const param of reactiveFunction.params) {
-      const place = param.kind === "Identifier" ? param : param.place;
-      if (place.identifier.name === null) {
-        promoteTemporary(place.identifier);
-      }
-    }
     const identifiers = renameVariables(reactiveFunction);
     logReactiveFunction("Outline", reactiveFunction);
     const codegen = codegenReactiveFunction(

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/outlined-destructured-params.expect.md

@@ -0,0 +1,65 @@
+
+## Input
+
+```javascript
+import { Stringify } from "shared-runtime";
+
+function Component(props) {
+  // test outlined functions with destructured parameters - the
+  // temporary for the destructured param must be promoted
+  return (
+    <>
+      {props.items.map(({ id, name }) => (
+        <Stringify key={id} name={name} />
+      ))}
+    </>
+  );
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: Component,
+  params: [{ items: [{ id: 1, name: "one" }] }],
+};
+
+```
+
+## Code
+
+```javascript
+import { c as _c } from "react/compiler-runtime";
+import { Stringify } from "shared-runtime";
+
+function Component(props) {
+  const $ = _c(4);
+  let t0;
+  if ($[0] !== props.items) {
+    t0 = props.items.map(_temp);
+    $[0] = props.items;
+    $[1] = t0;
+  } else {
+    t0 = $[1];
+  }
+  let t1;
+  if ($[2] !== t0) {
+    t1 = <>{t0}</>;
+    $[2] = t0;
+    $[3] = t1;
+  } else {
+    t1 = $[3];
+  }
+  return t1;
+}
+function _temp(t0) {
+  const { id, name } = t0;
+  return <Stringify key={id} name={name} />;
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: Component,
+  params: [{ items: [{ id: 1, name: "one" }] }],
+};
+
+```
+      
+### Eval output
+(kind: ok) <div>{"name":"one"}</div>

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/outlined-destructured-params.js

@@ -0,0 +1,18 @@
+import { Stringify } from "shared-runtime";
+
+function Component(props) {
+  // test outlined functions with destructured parameters - the
+  // temporary for the destructured param must be promoted
+  return (
+    <>
+      {props.items.map(({ id, name }) => (
+        <Stringify key={id} name={name} />
+      ))}
+    </>
+  );
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: Component,
+  params: [{ items: [{ id: 1, name: "one" }] }],
+};