From bde7875f20b795ef97fec7778946ef245d4a84a9 Mon Sep 17 00:00:00 2001
From: Joe Savona <joesavona@fb.com>
Date: Fri, 15 Sep 2023 12:10:51 -0700
Subject: [PATCH] fbt:param does not allow jsxfragment children

---
 .../ReactiveScopes/CodegenReactiveFunction.ts |  7 +--
 ...fbtparam-with-jsx-fragment-value.expect.md | 55 +++++++++++++++++++
 .../fbtparam-with-jsx-fragment-value.js       | 14 +++++
 .../packages/sprout/src/SproutTodoFilter.ts   |  1 +
 4 files changed, 72 insertions(+), 5 deletions(-)
 create mode 100644 compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/fbtparam-with-jsx-fragment-value.expect.md
 create mode 100644 compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/fbtparam-with-jsx-fragment-value.js

diff --git a/compiler/packages/babel-plugin-react-forget/src/ReactiveScopes/CodegenReactiveFunction.ts b/compiler/packages/babel-plugin-react-forget/src/ReactiveScopes/CodegenReactiveFunction.ts
index ecfb030ab9..d99cd74f43 100644
--- a/compiler/packages/babel-plugin-react-forget/src/ReactiveScopes/CodegenReactiveFunction.ts
+++ b/compiler/packages/babel-plugin-react-forget/src/ReactiveScopes/CodegenReactiveFunction.ts
@@ -1366,11 +1366,8 @@ function codegenJsxFbtChildElement(
   | t.JSXFragment {
   const value = codegenPlace(cx, place);
   switch (value.type) {
-    case "StringLiteral": {
-      return createJsxExpressionContainer(place.loc, value);
-    }
-    case "JSXElement":
-    case "JSXFragment": {
+    // fbt:param only allows JSX element or expression container as children
+    case "JSXElement": {
       return value;
     }
     default: {
diff --git a/compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/fbtparam-with-jsx-fragment-value.expect.md b/compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/fbtparam-with-jsx-fragment-value.expect.md
new file mode 100644
index 0000000000..936bde3853
--- /dev/null
+++ b/compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/fbtparam-with-jsx-fragment-value.expect.md
@@ -0,0 +1,55 @@
+
+## Input
+
+```javascript
+import fbt from "fbt";
+import { identity } from "shared-runtime";
+
+function Component(props) {
+  return (
+    <Foo
+      value={
+        <fbt desc="Description of the parameter">
+          <fbt:param name="value">{<>{identity(props.text)}</>}</fbt:param>%
+        </fbt>
+      }
+    />
+  );
+}
+
+```
+
+## Code
+
+```javascript
+import { unstable_useMemoCache as useMemoCache } from "react";
+import fbt from "fbt";
+import { identity } from "shared-runtime";
+
+function Component(props) {
+  const $ = useMemoCache(4);
+  const c_0 = $[0] !== props.text;
+  let t0;
+  if (c_0) {
+    t0 = fbt._("{value}%", [fbt._param("value", <>{identity(props.text)}</>)], {
+      hk: "10F5Cc",
+    });
+    $[0] = props.text;
+    $[1] = t0;
+  } else {
+    t0 = $[1];
+  }
+  const c_2 = $[2] !== t0;
+  let t1;
+  if (c_2) {
+    t1 = <Foo value={t0} />;
+    $[2] = t0;
+    $[3] = t1;
+  } else {
+    t1 = $[3];
+  }
+  return t1;
+}
+
+```
+      
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/fbtparam-with-jsx-fragment-value.js b/compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/fbtparam-with-jsx-fragment-value.js
new file mode 100644
index 0000000000..5498ee53b7
--- /dev/null
+++ b/compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/fbtparam-with-jsx-fragment-value.js
@@ -0,0 +1,14 @@
+import fbt from "fbt";
+import { identity } from "shared-runtime";
+
+function Component(props) {
+  return (
+    <Foo
+      value={
+        <fbt desc="Description of the parameter">
+          <fbt:param name="value">{<>{identity(props.text)}</>}</fbt:param>%
+        </fbt>
+      }
+    />
+  );
+}
diff --git a/compiler/packages/sprout/src/SproutTodoFilter.ts b/compiler/packages/sprout/src/SproutTodoFilter.ts
index fbae8134c3..9ff3b3e406 100644
--- a/compiler/packages/sprout/src/SproutTodoFilter.ts
+++ b/compiler/packages/sprout/src/SproutTodoFilter.ts
@@ -456,6 +456,7 @@ const skipFilter = new Set([
   "class-component-with-render-helper",
   "fbtparam-with-jsx-element-content",
   "fbtparam-text-must-use-expression-container",
+  "fbtparam-with-jsx-fragment-value",
 ]);
 
 export default skipFilter;