[EuiSideNav] Migrate from class to function component#9533
Open
CollegeRideOut wants to merge 2 commits into
Open
[EuiSideNav] Migrate from class to function component#9533CollegeRideOut wants to merge 2 commits into
CollegeRideOut wants to merge 2 commits into
Conversation
|
👋 Since this is a community submitted pull request, a Buildkite build has not been started automatically. Would an Elastic organization member please verify the contents of this pull request and kick off a build manually? |
github-actions
Bot
added
the
community contribution
weronikaolejniczak
added
the
skip-changelog
Contributor
There was a problem hiding this comment.
Pull request overview
Migrates EuiSideNav from a stateless class component using withEuiTheme to a function component using hooks, aligning it with modern EUI patterns and closing #9475.
Changes:
- Converted
EuiSideNavfrom class to function component - Replaced
withEuiThemewithuseEuiTheme - Replaced
defaultPropswith default values in props destructuring
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Co-authored-by: Weronika Olejniczak <32842468+weronikaolejniczak@users.noreply.github.com>
Collaborator
💔 Build Failed
Failed CI StepsHistory
|
Collaborator
💔 Build Failed
Failed CI StepsHistory
|
weronikaolejniczak
requested changes
Apr 1, 2026
weronikaolejniczak
left a comment
weronikaolejniczak
left a comment
Contributor
There was a problem hiding this comment.
The CI is failing at the Linting step. It's because there's a syntax issue in packages/eui/src/components/side_nav/side_nav.tsx. @CollegeRideOut could you update it? 🙏🏻
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.
Summary
What: Convert
EuiSideNavfrom a class component to a function component.Why: Closes #9475
How:
Replaced the class component with a function component using hooks
Removed
withEuiThemeHOC and replaced it withuseEuiThemePreserved existing behavior and structure
Replaced
defaultPropswith default values in props destructuringAPI Changes
component / parent | prop / child | change | description -- | -- | -- | -- N/A | | None | No public API changesImpact Assessment
🔴 Breaking changes
💅 Visual changes
🧪 Test impact
🔧 Hard to integrate
Impact level: 🟢 None
QA instructions for reviewer
Verify
EuiSideNavrenders as expectedConfirm navigation items expand/collapse correctly
Ensure no visual or behavioral regressions
Checklist before marking Ready for Review
## SummaryFilled out all sections above
What: Convert
EuiSideNavfrom a class component to a function component.Why: Closes [#9475](#9475)
How:
withEuiThemeHOC and replaced it withuseEuiThemedefaultPropswith default values in props destructuringAPI Changes
Impact level: 🟢 None
QA instructions for reviewer
EuiSideNavrenders as expectedChecklist before marking Ready for Review
This Message was generated by AI. Also I used AI tools when working on this but I did all the changes myself (locally my yarn lint was not working, but I did run prettier before commiting)