LINK-2463 | Upgrade HDS to v6 and React to v19#299
Merged
Conversation
Refs: LINK-2463
add missing runtime packages: - @juggle/resize-observer - @sentry/browser - @sentry/core - date-fns - react-merge-refs - react-use-measure add vite to devDependencies for vitest config usage Refs: LINK-2463
|
Warning Review limit reached
More reviews will be available in 8 minutes and 47 seconds. Learn how PR review limits work. Your organization has run out of usage credits. Purchase more in the billing tab. ⌛ How to resolve this issue?After more reviews become available, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans include higher PR review limits than trial, open-source, and free plans. In all cases, reviews become available again over time. During sustained high-volume PR review activity, CodeRabbit may temporarily slow when the next review becomes available. Please see our Fair Usage Limits Policy for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Run ID: ⛔ Files ignored due to path filters (2)
📒 Files selected for processing (22)
📝 WalkthroughWalkthroughUpgrades core dependencies (React 19, HDS 6, React Query 5), adds a postinstall shim script, adapts Select typings and ServerErrorSummary to HDS 6 API, refactors MenuDropdown keyboard/focus logic, tightens React Query hook option generics, and relaxes dehydrated-state test assertions. ChangesReact 19 and HDS 6.0 Upgrade
Estimated code review effort🎯 4 (Complex) | ⏱️ ~45 minutes Possibly related PRs
Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In
`@src/domain/signup/modals/confirmDeleteSignupModal/ConfirmDeleteSignupModal.tsx`:
- Around line 40-42: The explicit cast on focusAfterCloseRef is redundant—remove
the "as React.RefObject<HTMLElement>" assertion and pass
openConfirmationButtonRef directly to Dialog's focusAfterCloseRef prop in
ConfirmDeleteSignupModal; if the ref declaration differs, change the
openConfirmationButtonRef creation to React.useRef<HTMLElement>(null) so its
type already matches Dialog's focusAfterCloseRef?: RefObject<HTMLElement>.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 57270fd6-11af-4654-8dfc-5a0c4b2d4acb
⛔ Files ignored due to path filters (2)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yamlsrc/domain/attendanceList/searchRow/__tests__/__snapshots__/SearchRow.test.tsx.snapis excluded by!**/*.snap
📒 Files selected for processing (12)
package.jsonsrc/__tests__/Pages.test.tsxsrc/common/components/formFields/SingleSelectField.tsxsrc/common/components/menuDropdown/MenuDropdown.tsxsrc/common/components/serverErrorSummary/ServerErrorSummary.tsxsrc/common/components/singleSelect/SingleSelect.tsxsrc/domain/registration/__tests__/query.test.tssrc/domain/signup/__tests__/query.test.tssrc/domain/signup/modals/confirmDeleteSignupModal/ConfirmDeleteSignupModal.tsxsrc/domain/signupGroup/__tests__/query.test.tssrc/utils/getEnvValue.tstsconfig.tsbuildinfo
jorilindell
force-pushed
the
LINK-2463-react-19-and-hds-6
branch
2 times, most recently
from
d051f52 to
b8eaa2a
Compare
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
src/common/components/menuDropdown/MenuDropdown.tsx (1)
100-100: ⚡ Quick winPass the memoized callback directly instead of wrapping it.
The arrow function
(event) => onDropdownKeyDown(event)creates a new function reference on every render, which defeats the purpose of memoizingonDropdownKeyDownwithuseCallback(lines 103-138). IfuseDropdownKeyboardNavigationuses this callback as a dependency, the navigation setup may re-run on every render.⚡ Recommended change
} = useDropdownKeyboardNavigation({ container: containerRef, disabledIndices: disabledIndices, listLength: items.length, - onKeyDown: (event) => onDropdownKeyDown(event), + onKeyDown: onDropdownKeyDown, });🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/common/components/menuDropdown/MenuDropdown.tsx` at line 100, The onKeyDown handler is being wrapped in a new arrow function which defeats the memoized onDropdownKeyDown callback; change the prop assignment to pass the memoized function directly (i.e., replace onKeyDown: (event) => onDropdownKeyDown(event) with onKeyDown: onDropdownKeyDown) so useDropdownKeyboardNavigation and any dependency checks see a stable reference to onDropdownKeyDown.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@scripts/fix-hds-core-cookie-consent.js`:
- Around line 17-29: Change the script to treat missing hds-core cookie-consent
assets as an error instead of a successful no-op: when targetDir (the
cookie-consent directory) or cssFile (cookieConsent.css) do not exist, log a
clear error via console.error and terminate the process with a non-zero exit
(e.g., process.exit(1) or throw an Error) so the postinstall fails; update the
checks around targetDir and cssFile in fix-hds-core-cookie-consent.js to use
console.error + process.exit(1) (or throw) rather than console.warn +
process.exit(0) and include a message that indicates which asset is missing.
---
Nitpick comments:
In `@src/common/components/menuDropdown/MenuDropdown.tsx`:
- Line 100: The onKeyDown handler is being wrapped in a new arrow function which
defeats the memoized onDropdownKeyDown callback; change the prop assignment to
pass the memoized function directly (i.e., replace onKeyDown: (event) =>
onDropdownKeyDown(event) with onKeyDown: onDropdownKeyDown) so
useDropdownKeyboardNavigation and any dependency checks see a stable reference
to onDropdownKeyDown.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 35bbe384-087a-4e20-b6fa-db0793fa6f3f
⛔ Files ignored due to path filters (2)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yamlsrc/domain/attendanceList/searchRow/__tests__/__snapshots__/SearchRow.test.tsx.snapis excluded by!**/*.snap
📒 Files selected for processing (21)
package.jsonscripts/fix-hds-core-cookie-consent.jssrc/__tests__/Pages.test.tsxsrc/common/components/formFields/SingleSelectField.tsxsrc/common/components/menuDropdown/MenuDropdown.tsxsrc/common/components/serverErrorSummary/ServerErrorSummary.tsxsrc/common/components/singleSelect/SingleSelect.tsxsrc/domain/event/query.tssrc/domain/order/query.tssrc/domain/payment/query.tssrc/domain/registration/__tests__/query.test.tssrc/domain/registration/query.tssrc/domain/signup/__tests__/query.test.tssrc/domain/signup/modals/confirmDeleteSignupModal/ConfirmDeleteSignupModal.tsxsrc/domain/signup/query.tssrc/domain/signupGroup/__tests__/query.test.tssrc/domain/signupGroup/query.tssrc/domain/singups/query.tssrc/domain/user/query.tssrc/pages/_app.tsxsrc/utils/getEnvValue.ts
✅ Files skipped from review due to trivial changes (7)
- src/domain/user/query.ts
- src/pages/_app.tsx
- src/domain/signupGroup/tests/query.test.ts
- src/utils/getEnvValue.ts
- src/domain/registration/query.ts
- src/domain/signup/modals/confirmDeleteSignupModal/ConfirmDeleteSignupModal.tsx
- src/common/components/formFields/SingleSelectField.tsx
🚧 Files skipped from review as they are similar to previous changes (6)
- src/domain/signup/tests/query.test.ts
- src/common/components/serverErrorSummary/ServerErrorSummary.tsx
- src/domain/registration/tests/query.test.ts
- src/tests/Pages.test.tsx
- src/common/components/singleSelect/SingleSelect.tsx
- package.json
jorilindell
force-pushed
the
LINK-2463-react-19-and-hds-6
branch
from
b8eaa2a to
438984b
Compare
![sentry[bot]](https://avatars.githubusercontent.com/in/12637?s=60&v=4){kind=small}
|
LINKEDREGISTRATIONS-UI branch is deployed to platta: https://linkedregistrations-pr299-ui.dev.hel.ninja 🚀🚀🚀 |
e2e tests result is success for https://linkedregistrations-pr299-ui.dev.hel.ninja 😆🎉🎉🎉 |
- upgrade react and react-dom to v19 - upgrade @types/react to v19 - refine MenuDropdown listener/effect handling for React 19-safe behavior Refs: LINK-2463
- bump hds-core, hds-design-tokens, and hds-react to v6 - replace ErrorSummary with Notification in server error summary UI - migrate SingleSelect and SingleSelectField typing to ComponentProps<typeof Select> - update SearchRow snapshot for HDS v6 class and id output Refs: LINK-2463
HDS 6.0.2 ships cookieConsent.ts but not cookieConsent.js at the path required by hds-react, causing build failures. Add fix-hds-shim script that creates a compatible shim from cookieConsent.css. The shim uses an ES module-shaped export and avoids Node built-ins so webpack/browser bundling works. Refs: LINK-2463
- upgrade @testing-library/react from 14.2.1 to 16.3.2 - upgrade @testing-library/user-event from 14.5.2 to 14.6.1 - update lockfile after testing dependency refresh Refs: LINK-2463
- bump @tanstack/react-query to ^5.101.0 - bump react-scroll to ^1.9.3 - bump eslint-plugin-react-hooks to ^7.1.1 Refs: LINK-2463
jorilindell
force-pushed
the
LINK-2463-react-19-and-hds-6
branch
from
438984b to
0486a9f
Compare
|
|
LINKEDREGISTRATIONS-UI branch is deployed to platta: https://linkedregistrations-pr299-ui.dev.hel.ninja 🚀🚀🚀 |
e2e tests result is success for https://linkedregistrations-pr299-ui.dev.hel.ninja 😆🎉🎉🎉 |
mikkojamG
approved these changes
Jun 11, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
This PR upgrades the UI stack to React 19 and HDS 6, and applies the compatibility fixes required for build, runtime, and tests.
Changes
Refs: LINK-2463
Summary by CodeRabbit
New Features
Bug Fixes
Chores
Refactor
Tests