From 8b51eef2770d273b640daf1c4dc86422eed0ce5b Mon Sep 17 00:00:00 2001
From: Akul Srivastava <akulsr0@gmail.com>
Date: Mon, 5 Dec 2022 15:05:07 +0530
Subject: [PATCH] [Fix] `jsx-no-leaked-render`: fix removing parentheses for
 conditionals

Fixes #3502.
---
 CHANGELOG.md                            |  1 +
 lib/rules/jsx-no-leaked-render.js       |  3 +++
 tests/lib/rules/jsx-no-leaked-render.js | 18 ++++++++++++++++++
 3 files changed, 22 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 3bf878aaa4..0d242f583b 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -18,6 +18,7 @@ This change log adheres to standards from [Keep a CHANGELOG](https://keepachange
 * [`jsx-newline`]: No newline between comments and jsx elements ([#3493][] @justmejulian)
 * [`jsx-no-leaked-render`]: Don't report errors on empty strings if React >= v18 ([#3488][] @himanshu007-creator)
 * [`no-invalid-html-attribute`]: convert autofix to suggestion ([#3474][] @himanshu007-creator @ljharb)
+ * [`jsx-no-leaked-render`]: fix removing parentheses for conditionals ([#3502][] @akulsr0)
 
 ### Changed
 * [Docs] [`jsx-no-leaked-render`]: Remove mentions of empty strings for React 18 ([#3468][] @karlhorky)
diff --git a/lib/rules/jsx-no-leaked-render.js b/lib/rules/jsx-no-leaked-render.js
index 618b721baa..dccba5b695 100644
--- a/lib/rules/jsx-no-leaked-render.js
+++ b/lib/rules/jsx-no-leaked-render.js
@@ -64,6 +64,9 @@ function ruleFixer(context, fixStrategy, fixer, reportedNode, leftNode, rightNod
       return `${getIsCoerceValidNestedLogicalExpression(node) ? '' : '!!'}${nodeText}`;
     }).join(' && ');
 
+    if (rightNode.type === 'ConditionalExpression') {
+      return fixer.replaceText(reportedNode, `${newText} && (${rightSideText})`);
+    }
     return fixer.replaceText(reportedNode, `${newText} && ${rightSideText}`);
   }
 
diff --git a/tests/lib/rules/jsx-no-leaked-render.js b/tests/lib/rules/jsx-no-leaked-render.js
index c760c8c118..cd9a1f982c 100644
--- a/tests/lib/rules/jsx-no-leaked-render.js
+++ b/tests/lib/rules/jsx-no-leaked-render.js
@@ -829,5 +829,23 @@ ruleTester.run('jsx-no-leaked-render', rule, {
         column: 24,
       }],
     },
+    {
+      code: `
+        const MyComponent = () => {
+          return <div>{maybeObject && (isFoo ? <Aaa /> : <Bbb />)}</div>
+        }
+      `,
+      output: `
+        const MyComponent = () => {
+          return <div>{!!maybeObject && (isFoo ? <Aaa /> : <Bbb />)}</div>
+        }
+      `,
+      options: [{ validStrategies: ['coerce'] }],
+      errors: [{
+        message: 'Potential leaked value that might cause unintentionally rendered values or rendering crashes',
+        line: 3,
+        column: 24,
+      }],
+    },
   ]),
 });