[Bug]: jsx-curly-brace-presence template literal fix can break things

[akx]

Is there an existing issue for this?

• I have searched the existing issues and my issue is unique
• My issue appears in the command-line and not only in the text editor

Description Overview

#3538 (see #3537) fixes a template literal with a single placeholder to just be that placeholder.

This can change the semantics of the prop:

const foo = 123;
<Component foo={`${foo}`} />

casts foo to a string (and thus passes "123"), while the "fixed"

const foo = 123;
<Component foo={foo} />

passes foo as a number 123; when using TypeScript and Component expects foo: string, that's a type error. When not using TypeScript, if Component behaves differently with a string prop cf. a number prop, this changes that behavior.

This also stands for children:

<span>An error occurred: {`${err}`}</span>

will be changed to

<span>An error occurred: {err}</span>

which can be a type error if err is not a valid React child (and when not using TypeScript, it can cause e.g. false not to get rendered as text.

Expected Behavior

Whether template literals with a single placeholder are unwrapped should be configurable.

eslint-plugin-react version

v7.33.0

eslint version

v8.45.0

node version

v20.3.0

[akx]

cc @taozhou-glean

[taozhou-glean]

did not realize use case like this until now, thanks for raising and fixing!

[ljharb]

Indeed, I think #3538 needs to be reverted.