fix(lint/useJsxKeyInIterable): fix a false positive when key is in th…

…e return statement, but not any variable declarations (#3031)

Co-authored-by: Emanuele Stoppa <[email protected]>

crates/biome_js_analyze/src/lint/correctness/use_jsx_key_in_iterable.rs

@@ -184,6 +184,28 @@ fn handle_function_body(
     model: &SemanticModel,
     is_inside_jsx: bool,
 ) -> Vec<TextRange> {
+    // if the return statement definitely has a key prop, don't need to check the rest of the function
+    let return_statement = node
+        .statements()
+        .iter()
+        .find_map(|statement| statement.as_js_return_statement().cloned());
+    let is_return_component = return_statement
+        .as_ref()
+        .and_then(|ret| {
+            let returned_value = ret.argument()?;
+            Some(ReactComponentExpression::can_cast(
+                returned_value.syntax().kind(),
+            ))
+        })
+        .unwrap_or_default();
+    let ranges = return_statement.and_then(|ret| {
+        let returned_value = ret.argument()?;
+        handle_potential_react_component(returned_value, model, is_inside_jsx)
+    });
+    if ranges.is_none() && is_return_component {
+        return vec![];
+    }
+
     node.statements()
         .iter()
         .filter_map(|statement| {

crates/biome_js_analyze/tests/specs/correctness/useJsxKeyInIterable/valid.jsx

@@ -91,3 +91,8 @@ React.Children.map(c => React.cloneElement(c, {key: c}));
 	const div = <div key={item.id}>{x}</div>;
 	return div;
 });
+
+[].map((item) => {
+	const node = <button type="button">{item.label}</button>;
+	return <Fragment key={item.label}>{node}</Fragment>;
+})

crates/biome_js_analyze/tests/specs/correctness/useJsxKeyInIterable/valid.jsx.snap

@@ -98,4 +98,9 @@ React.Children.map(c => React.cloneElement(c, {key: c}));
 	return div;
 });
 
+[].map((item) => {
+	const node = <button type="button">{item.label}</button>;
+	return <Fragment key={item.label}>{node}</Fragment>;
+})
+
 ```