diff --git a/.changeset/drop-react-17-packages-ui.md b/.changeset/drop-react-17-packages-ui.md new file mode 100644 index 0000000000..710f6e5b42 --- /dev/null +++ b/.changeset/drop-react-17-packages-ui.md @@ -0,0 +1,5 @@ +--- +'@backstage/ui': minor +--- + +**BREAKING**: Dropped support for React 17. The minimum supported React version is now 18. diff --git a/.changeset/repo-tools-peer-deps-react18.md b/.changeset/repo-tools-peer-deps-react18.md new file mode 100644 index 0000000000..7d24da45a6 --- /dev/null +++ b/.changeset/repo-tools-peer-deps-react18.md @@ -0,0 +1,5 @@ +--- +'@backstage/repo-tools': patch +--- + +Added support for packages that only support React 18+ in the `peer-deps` command. diff --git a/packages/repo-tools/src/commands/peer-deps/peer-deps.ts b/packages/repo-tools/src/commands/peer-deps/peer-deps.ts index b6f73a7d44..7fc022a8eb 100644 --- a/packages/repo-tools/src/commands/peer-deps/peer-deps.ts +++ b/packages/repo-tools/src/commands/peer-deps/peer-deps.ts @@ -39,6 +39,16 @@ const peerDependencies = { 'react-router-dom': '^6.30.2', }; +// Packages that have dropped React 17 support and only support React 18+ +const peerDependenciesReact18Only = { + '@types/react': '^18.0.0', + react: '^18.0.0', + 'react-dom': '^18.0.0', + 'react-router-dom': '^6.30.2', +}; + +const react18OnlyPackages = new Set(['@backstage/ui']); + const groupsOfPeerDependencies = [['@types/react', 'react', 'react-dom']]; const optionalPeerDependencies = new Set(['@types/react']); @@ -79,14 +89,21 @@ const matchesDependency = (dep: string, packageJson: ExtendedPackageJSON) => { ); }; +const getExpectedPeerDependencies = (packageJson: ExtendedPackageJSON) => { + if (react18OnlyPackages.has(packageJson.name!)) { + return peerDependenciesReact18Only; + } + return peerDependencies; +}; + const matchesPeerDependency = ( dep: string, packageJson: ExtendedPackageJSON, ) => { + const expected = getExpectedPeerDependencies(packageJson); return ( packageJson.peerDependencies && - packageJson.peerDependencies[dep] === - peerDependencies[dep as keyof typeof peerDependencies] + packageJson.peerDependencies[dep] === expected[dep as keyof typeof expected] ); }; @@ -125,6 +142,7 @@ export default async ({ fix }: { fix: boolean }) => { for (const pkg of packagesWithRelevantDependencies) { const packageJson = pkg.packageJson as ExtendedPackageJSON; + const expectedPeerDeps = getExpectedPeerDependencies(packageJson); for (const dep of Object.keys(peerDependencies)) { // Validate that the peer dependencies are present. if (isPeerDependency(dep, packageJson)) { @@ -182,7 +200,7 @@ export default async ({ fix }: { fix: boolean }) => { packageJson.peerDependencies = packageJson.peerDependencies || {}; packageJson.peerDependencies[groupDep] = - peerDependencies[groupDep as keyof typeof peerDependencies]; + expectedPeerDeps[groupDep as keyof typeof expectedPeerDeps]; }); } } @@ -209,7 +227,7 @@ export default async ({ fix }: { fix: boolean }) => { attemptToApplyFix(() => { packageJson.peerDependencies = packageJson.peerDependencies || {}; packageJson.peerDependencies[dep] = - peerDependencies[dep as keyof typeof peerDependencies]; + expectedPeerDeps[dep as keyof typeof expectedPeerDeps]; }); } } else { @@ -219,7 +237,7 @@ export default async ({ fix }: { fix: boolean }) => { attemptToApplyFix(() => { packageJson.peerDependencies = packageJson.peerDependencies || {}; packageJson.peerDependencies[dep] = - peerDependencies[dep as keyof typeof peerDependencies]; + expectedPeerDeps[dep as keyof typeof expectedPeerDeps]; }); } } diff --git a/packages/ui/package.json b/packages/ui/package.json index e62add25ac..6eaa903c90 100644 --- a/packages/ui/package.json +++ b/packages/ui/package.json @@ -67,9 +67,9 @@ "storybook": "^10.3.0-alpha.1" }, "peerDependencies": { - "@types/react": "^17.0.0 || ^18.0.0", - "react": "^17.0.0 || ^18.0.0", - "react-dom": "^17.0.0 || ^18.0.0", + "@types/react": "^18.0.0", + "react": "^18.0.0", + "react-dom": "^18.0.0", "react-router-dom": "^6.30.2" }, "peerDependenciesMeta": { diff --git a/yarn.lock b/yarn.lock index fd201d7eea..df1ee4033c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -7949,9 +7949,9 @@ __metadata: storybook: "npm:^10.3.0-alpha.1" use-sync-external-store: "npm:^1.4.0" peerDependencies: - "@types/react": ^17.0.0 || ^18.0.0 - react: ^17.0.0 || ^18.0.0 - react-dom: ^17.0.0 || ^18.0.0 + "@types/react": ^18.0.0 + react: ^18.0.0 + react-dom: ^18.0.0 react-router-dom: ^6.30.2 peerDependenciesMeta: "@types/react":