Fix peer dependencies issues

[gonzaloriestra]

WHY are these changes introduced?

pnpm install shows a bunch of peer dependencies issues:

❯ pnpm i
Scope: all 14 workspace projects
packages/app                             |  WARN  deprecated @shopify/function-runner@4.1.1
packages/ui-extensions-dev-console       |  WARN  deprecated @shopify/react-testing@3.3.10
packages/ui-extensions-dev-console       |  WARN  deprecated @vitejs/plugin-react-refresh@1.3.6
packages/ui-extensions-dev-console       |  WARN  deprecated @shopify/react-i18n@6.4.0
packages/ui-extensions-server-kit        |  WARN  deprecated vi-fetch@0.8.0
 WARN  deprecated rimraf@3.0.2: Rimraf versions prior to v4 are no longer supported
 WARN  20 deprecated subdependencies found: @babel/plugin-proposal-class-properties@7.18.6, @babel/plugin-proposal-object-rest-spread@7.20.7, @graphql-tools/prisma-loader@8.0.17, @shopify/dates@1.1.5, @shopify/decorators@2.0.8, @shopify/function-enhancers@2.0.8, @shopify/i18n@1.0.9, @shopify/react-effect@4.1.12, @shopify/react-hooks@2.1.19, @shopify/useful-types@4.0.3, abab@2.0.6, boolean@3.2.0, domexception@4.0.0, glob@10.4.5, glob@11.0.3, glob@7.2.3, glob@8.1.0, inflight@1.0.6, node-domexception@1.0.0, whatwg-encoding@2.0.0
Packages: +1
+
Progress: resolved 2113, reused 1966, downloaded 0, added 1, done
 WARN  Issues with peer dependencies found
.
└─┬ knip 5.59.1
  └─┬ zod-validation-error 3.4.1
    └── ✕ unmet peer zod@^3.24.4: found 3.24.1

packages/app
└─┬ @shopify/polaris 12.27.0
  ├── ✕ unmet peer react@^18.0.0: found 19.2.4
  └── ✕ unmet peer react-dom@^18.0.0: found 19.2.4

packages/cli
├─┬ react-dom 19.2.4
│ └── ✕ unmet peer react@^19.2.4: found 18.3.1
└─┬ @shopify/cli-hydrogen 11.1.5
  └─┬ use-resize-observer 9.1.0
    └── ✕ unmet peer react-dom@"16.8.0 - 18": found 19.2.4

packages/cli-kit
└─┬ typedoc 0.27.9
  └── ✕ unmet peer typescript@"5.0.x || 5.1.x || 5.2.x || 5.3.x || 5.4.x || 5.5.x || 5.6.x || 5.7.x || 5.8.x": found 5.9.3

packages/eslint-plugin-cli
├─┬ @shopify/eslint-plugin 50.0.0
│ └─┬ eslint-plugin-prettier 5.5.1
│   └── ✕ unmet peer prettier@>=3.0.0: found 2.8.8
└─┬ eslint-plugin-prettier 5.5.1
  └── ✕ unmet peer prettier@>=3.0.0: found 2.8.8

packages/ui-extensions-server-kit
├─┬ react-dom 19.2.4
│ └── ✕ unmet peer react@^19.2.4: found 17.0.2
└─┬ @shopify/react-testing 3.3.10
  └── ✕ unmet peer react-dom@">=16.8.0 <18.0.0": found 19.2.4
Done in 5s using pnpm v10.11.1

WHAT is this pull request doing?

Cleans all the issues:

❯ pnpm i
Scope: all 14 workspace projects
packages/app                             |  WARN  deprecated @shopify/function-runner@4.1.1
packages/ui-extensions-dev-console       |  WARN  deprecated @shopify/react-testing@5.4.0
packages/ui-extensions-dev-console       |  WARN  deprecated @shopify/react-i18n@7.14.0
packages/ui-extensions-test-utils        |  WARN  deprecated @shopify/react-testing@3.3.10
 WARN  20 deprecated subdependencies found: @babel/plugin-proposal-class-properties@7.18.6, @babel/plugin-proposal-object-rest-spread@7.20.7, @shopify/dates@2.1.1, @shopify/function-enhancers@3.1.0, @shopify/i18n@2.1.0, @shopify/name@1.3.0, @shopify/react-effect@5.2.0, @shopify/react-hooks@4.1.2, @shopify/useful-types@4.0.3, @shopify/useful-types@5.3.0, abab@2.0.6, boolean@3.2.0, domexception@4.0.0, glob@10.5.0, glob@7.2.3, glob@8.1.0, inflight@1.0.6, node-domexception@1.0.0, rimraf@3.0.2, whatwg-encoding@2.0.0
Packages: +1
+
Progress: resolved 2020, reused 1870, downloaded 0, added 1, done
Done in 3.2s using pnpm v10.11.1

Changes:

React 17 → 18 migration (UI packages)

Upgraded ui-extensions-dev-console, ui-extensions-server-kit, and ui-extensions-test-utils from React 17 to 18. This includes bumping react, react-dom, @types/react, @shopify/react-testing, and @shopify/react-i18n, switching ReactDOM.render to the createRoot API, and updating qrcode.react to v4 (named QRCodeCanvas export).

Vite plugin and config updates

Replaced the deprecated @vitejs/plugin-react-refresh with @vitejs/plugin-react v5. Vite config files were renamed from .config.ts to .config.mts so they are explicitly treated as ES modules — these packages don't set "type": "module" in their package.json, so without the .mts extension Node.js would treat the config as CommonJS, which conflicts with the import/export syntax used in the file.

Dependency bumps

• typedoc ^0.27.6 → ^0.28.17 (adds TypeScript 5.9.x peer support)
• prettier 2.8.8 → 3.8.1 (removed @types/prettier)
• rimraf ^3.0.2 → ^6.1.3 (updated import to rimrafSync, removed @types/rimraf)
• zod pinned to 3.24.4

Removed vi-fetch

Dropped the unmaintained vi-fetch library from ui-extensions-server-kit; test setup now uses vi.restoreAllMocks().

pnpm configuration

Added pnpm.peerDependencyRules (to allow a specific @graphql-codegen/cli version) and pnpm.onlyBuiltDependencies (explicit allowlist for packages with build scripts) to the root package.json.

How to test your changes?

pnpm i

Measuring impact

How do we know this change was effective? Please choose one:

• n/a - this doesn't need measurement, e.g. a linting rule or a bug-fix
• Existing analytics will cater for this addition
• PR includes analytics changes to measure impact

Checklist

• I've considered possible cross-platform impacts (Mac, Linux, Windows)
• I've considered possible documentation changes

[github-actions]

Coverage report

St.❔	Category	Percentage	Covered / Total
🟡	Statements	76.91%	14518/18877
🟡	Branches	70.62%	7219/10222
🟡	Functions	75.93%	3693/4864
🟡	Lines	78.42%	13717/17492

Test suite run success

3788 tests passing in 1448 suites.

Report generated by 🧪jest coverage report action from b6c765d

[gonzaloriestra]

• Remove @shopify/react-testing #6920
• Remove @shopify/react-i18n #6919
• Remove some deprecated dependencies #6918
• Fix peer dependencies issues #6898 👈 (View in Graphite)
• main

This stack of pull requests is managed by Graphite. Learn more about stacking.

[github-actions]

We detected some changes at packages/*/src and there are no updates in the .changeset.
If the changes are user-facing, run pnpm changeset add to track your changes and include them in the next release CHANGELOG.

Caution

DO NOT create changesets for features which you do not wish to be included in the public changelog of the next CLI release.

[binks-code-reviewer]

⚠️ Findings outside the diff

These findings are in files not modified by this PR and cannot be posted as inline comments.

---

packages/ui-extensions-server-kit/vite.config.mts:45 — Vite config .mts uses __dirname which is undefined in ESM

The Vite configs were renamed to .mts to be treated as ES modules. In ESM, Node does not provide __dirname/__filename by default. This config uses __dirname in multiple places (root, outDir, entry, setupFiles, aliases). If Vite loads the file as ESM, it can fail at load time with ReferenceError: __dirname is not defined, breaking builds/tests for this package and any Nx target invoking it (hard CI/release workflow failure).

[binks-code-reviewer]

🤖 Code Review · #projects-dev-ai for questions
React with 👍/👎 or reply — all feedback helps improve the agent.

✅ Complete - No issues

📋 History

✅ No issues