[Bug]: cli-kit React dependency version mismatch

[nboliver-ventureweb]

Please confirm that you have:

• Searched existing issues to see if your issue is a duplicate. (If you’ve found a duplicate issue, feel free to add additional information in a comment on it.)
• Reproduced the issue in the latest CLI version.

In which of these areas are you experiencing a problem?

Theme

Expected behavior

cli-kit and its deps should have matching React versions

Actual behavior

cli-kit has React pinned at v18.2.0
ink has it listed as ^18.0.0
This is causing ink to install v18.3.0 and cli-kit to install 18.2.0

Verbose output

n/a

Reproduction steps

1. Install @shopify/cli-kit
2. Run npm list react
3. See different React versions
4. Run a command and get the You might have more than one copy of React in the same app error

Operating System

Mac OS

Shopify CLI version (check your project's package.json if you're not sure)

3.59.1

Shell

No response

Node version (run node -v if you're not sure)

No response

What language and version are you using in your application?

No response

[imrostom]

I also face this issue, how solved this issue ?

[isaacroldan]

Hi @nboliver-ventureweb @imrostom, is having 2 versions of react affecting your project?

Do you have Shopify CLI installed globally in your system?

[nboliver-ventureweb]

Yes having two versions is affecting the project. I have used overrides in package.json to fix it for now.
I have Shopify CLI installed globally with Homebrew, but this project is using Shopify CLI installed local to the project to ensure everyone is on the same version. Commands are being run with npx.

[michenly]

Related issue for using npm create @shopify/hydrogen@latest

When creating Hydrogen project, react version 18.3.1 is install (we use "react": "^18.2.0").
However, @shopify/cli-kit is pinning to react version 18.2.0

This create a react version miss-match and the create script gets error out with "Warning: Invalid hook call" error.

---

The new react version released 3 days ago likely cause all the issues to come out suddenly.

[frandiox]

So a simple installation using cli-kit results in the following tree:

[email protected]
node_modules/@shopify/cli-kit/node_modules/react
  react@"18.2.0" from @shopify/[email protected]
  ...
[email protected] peer
node_modules/react
  peer react@">=18.0.0" from [email protected]
  node_modules/ink
    ink@"4.4.1" from @shopify/[email protected]
    ...

This is even independent of what other packages like Hydrogen might require. cli-kit installs 18.2.0 and its dependency ink installs 18.3.1.

Therefore, I think we need a patch release changing cli-kit to ^18.2.0 or ^18.0.0 like ink requires?

[michenly]

Fixed by #3813 with @shopify/[email protected]