feat: React19 and HDSv6 migration HCRC-196#265
Merged
Conversation
Refs: HCRC-197
Refs: HCRC-197
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (3)
🚧 Files skipped from review as they are similar to previous changes (2)
📝 WalkthroughWalkthroughUpgrades the package to React 19 and HDS React 6. All context providers are migrated from ChangesReact 19 and HDS 6 Upgrade
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Poem
🚥 Pre-merge checks | ✅ 3 | ❌ 2❌ Failed checks (1 warning, 1 inconclusive)
✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches📝 Generate docstrings
🧪 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/apollo/page/useApolloPageContext.tsx`:
- Around line 1-6: Replace the `use()` API with `useContext()` in the
useApolloPageContext hook since this is unconditional context consumption.
Change the import statement to import `useContext` from 'react' instead of
`use`, and update the function body to call `useContext(ApolloPageContext)`
instead of `use(ApolloPageContext)`. This simplifies the code and follows the
recommended React pattern for unconditional context access.
🪄 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: 043908a6-6159-49b4-bf96-bec61282b0d4
⛔ Files ignored due to path filters (2)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yamlsrc/core/pageContent/sidebarContent/__tests__/__snapshots__/SidebarContent.test.tsx.snapis excluded by!**/*.snap
📒 Files selected for processing (30)
package.jsonsrc/apollo/page/useApolloPageContext.tsxsrc/apollo/pageContent/PageContent.tsxsrc/apollo/pageWithTemplateContent/PageWithTemplateContent.tsxsrc/common/components/container/Container.tsxsrc/common/components/list/List.tsxsrc/core/archiveSearchPageContent/ArchiveSearchPageContent.tsxsrc/core/carousel/components/CarouselSliderPage.tsxsrc/core/carousel/components/__tests__/CarouselSlideButton.test.tsxsrc/core/carousel/components/__tests__/CarouselSlider.test.tsxsrc/core/carousel/components/__tests__/CarouselSliderDot.test.tsxsrc/core/carousel/components/__tests__/CarouselSliderPage.test.tsxsrc/core/carousel/context/CarouselContext.tssrc/core/carousel/context/CarouselContextProvider.tsxsrc/core/collection/Collection.tsxsrc/core/configProvider/ConfigProvider.tsxsrc/core/configProvider/configContext.tssrc/core/configProvider/useConfig.tssrc/core/hero/Hero.tsxsrc/core/imageGallery/ImageGalleryProvider.tsxsrc/core/imageGallery/Lightbox.tsxsrc/core/imageGallery/useImageGalleryContext.tssrc/core/link/LinkBase.tsxsrc/core/pageContent/PageContentLayout.tsxsrc/core/pageContent/types.tssrc/core/pageContextProvider/PageContextProvider.tsxsrc/core/pageContextProvider/usePageContext.tsxsrc/core/utils/__tests__/recursiveMap.test.tsxsrc/core/utils/getChildrenByType.tssrc/core/utils/recursiveMap.ts
There was a problem hiding this comment.
Pull request overview
This PR migrates the component library to React 19 and HDS React 6, aligning types and internal patterns (context usage, element typing) with the updated React/HDS ecosystems.
Changes:
- Upgraded React/ReactDOM to
^19and HDS packages to6.0.2(plus associated lockfile updates). - Refactored multiple contexts to use React 19’s
use(Context)and<Context value={...}>provider syntax. - Updated TS/JSX typings from
JSX.ElementtoReact.JSX.Elementand tightened some element/clone typings.
Reviewed changes
Copilot reviewed 31 out of 32 changed files in this pull request and generated 4 comments.
Show a summary per file
| File | Description |
|---|---|
| src/core/utils/recursiveMap.ts | Tightens element typing before accessing props.children. |
| src/core/utils/getChildrenByType.ts | Adjusts __TYPE access typing and normalizes return value. |
| src/core/utils/tests/recursiveMap.test.tsx | Updates cloneElement typing in tests for TS compatibility. |
| src/core/pageContextProvider/usePageContext.tsx | Switches from useContext to React 19 use(Context). |
| src/core/pageContextProvider/PageContextProvider.tsx | Uses React 19 context provider element syntax. |
| src/core/pageContent/types.ts | Updates exported types to use React.JSX.Element. |
| src/core/pageContent/sidebarContent/tests/snapshots/SidebarContent.test.tsx.snap | Snapshot updates due to dependency/style output changes. |
| src/core/pageContent/PageContentLayout.tsx | Updates prop types to React.JSX.Element. |
| src/core/link/LinkBase.tsx | Refactors link prop typing and component shape (notably ref handling). |
| src/core/imageGallery/useImageGalleryContext.ts | Switches to React 19 use(Context). |
| src/core/imageGallery/Lightbox.tsx | Updates return types to React.JSX.Element. |
| src/core/imageGallery/ImageGalleryProvider.tsx | Uses React 19 context provider element syntax. |
| src/core/hero/Hero.tsx | Updates prop types to React.JSX.Element. |
| src/core/configProvider/useConfig.ts | Switches from useContext to React 19 use(Context). |
| src/core/configProvider/ConfigProvider.tsx | Uses React 19 context provider element syntax. |
| src/core/configProvider/configContext.ts | Updates component replacement typings to React.JSX.Element. |
| src/core/collection/Collection.tsx | Updates record value type to React.JSX.Element. |
| src/core/carousel/context/CarouselContextProvider.tsx | Uses React 19 context provider element syntax. |
| src/core/carousel/context/CarouselContext.ts | Switches from useContext to React 19 use(Context). |
| src/core/carousel/components/CarouselSliderPage.tsx | Ref callback adjusted (block body) while toggling inert. |
| src/core/carousel/components/tests/CarouselSliderPage.test.tsx | Updates test provider syntax to <CarouselContext value=...>. |
| src/core/carousel/components/tests/CarouselSliderDot.test.tsx | Updates test provider syntax to <CarouselContext value=...>. |
| src/core/carousel/components/tests/CarouselSlider.test.tsx | Updates test provider syntax to <CarouselContext value=...>. |
| src/core/carousel/components/tests/CarouselSlideButton.test.tsx | Updates test provider syntax to <CarouselContext value=...>. |
| src/core/archiveSearchPageContent/ArchiveSearchPageContent.tsx | Updates prop typing to React.JSX.Element. |
| src/common/components/list/List.tsx | Updates element typings to React.JSX.Element. |
| src/common/components/container/Container.tsx | Updates prop typing to React.JSX.Element. |
| src/apollo/pageWithTemplateContent/PageWithTemplateContent.tsx | Updates prop typing to React.JSX.Element. |
| src/apollo/pageContent/PageContent.tsx | Updates prop typing to React.JSX.Element. |
| src/apollo/page/useApolloPageContext.tsx | Switches from useContext to React 19 use(Context). |
| pnpm-lock.yaml | Locks updated dependency tree for React 19 + HDS 6. |
| package.json | Updates peer/dev deps to React 19 and HDS 6. |
Files not reviewed (1)
- pnpm-lock.yaml: Generated file
Comments suppressed due to low confidence (2)
src/core/imageGallery/useImageGalleryContext.ts:11
ImageGalleryContextis created with a non-null default value, souse(ImageGalleryContext)will always return a truthy object and thisif (!context)branch will never run. If the intent is to throw when used outside the provider, the context should be initialized withundefined(and typed accordingly) rather than a default object.
const context = use(ImageGalleryContext);
if (!context) {
throw new Error(
`Image gallery components cannot be used outside the ImageGalleryProvider`,
);
}
src/core/carousel/context/CarouselContext.ts:40
CarouselContextis created with a non-null default object, souse(CarouselContext)will never return a falsy value and this guard (if (!context) throw ...) is effectively dead code. If you want a clear error when used outside the provider, initialize the context withundefined/nullinstead of a default object (and update the type accordingly).
const context = use(CarouselContext);
if (!context) {
throw new Error(
`Carousel components cannot be rendered outside the CarouselContextProvider`,
);
}
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Refs: HCRC-197
Riippi
changed the title
Refs: HCRC-197
|
tjgofore
approved these changes
Jun 22, 2026
mikkojamG
approved these changes
Jul 9, 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
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.
Description
Reacr 19 and HDS 6 update.
https://helsinkisolutionoffice.atlassian.net/browse/HCRC-196
Summary by CodeRabbit