Skip to content

DEPS: Update node to v22 and npm to 10#1881

Open
travjenkins wants to merge 134 commits intomainfrom
travjenkins/deps/node_update_v22
Open

DEPS: Update node to v22 and npm to 10#1881
travjenkins wants to merge 134 commits intomainfrom
travjenkins/deps/node_update_v22

Conversation

@travjenkins
Copy link
Member

@travjenkins travjenkins commented Jan 30, 2026

Issues

NPM/Node - #1882
MUI - #1880
React 18 - #1584

Changes

NPM/Node

  • Upgrade package.json to mark new versions
  • Added devEngines as this helps empower the node GitHub action cache
  • Update the GitHub actions

React

Migration Guide

  • ran codemod migration
  • removed StrictMode as out hydration does not work with it
  • Added IS_REACT_ACT_ENVIRONMENT for testing

Zustand

Migration Guide

  • Switched to useShallow or removed single item arrays (infinite loading)
  • Storing default object and arrays as const (infinite loading)
  • Setting persist manually
  • Had to really refactor how Dekaf loads in the endpoint config
  • Did not force persist set

MUI

Migration Guide V6
Migration Guide V7

  • ran codemod migration for V6 and V7 (in order)
  • switched off SafeLoadingButton
  • updated to new Grid (sizing and growth)
  • switching over to slotProps
  • Fixing issues with key especially when spreading props
  • Switched to new class name approach and used variables from MUI
  • Not referencing Emotion directly anymore
  • Some general clean up

JsonForms

  • Remove use of Hidden component
  • Rebuild file uploader for multi line secret
  • Refactored the date, time, and date-time pickers

Misc (unrelated to upgrade)

  • Cleaning up StyledEngineProvider
  • Added more docs for the application - mainly targeting LLMs
  • Replace some component translations
  • Disabling editor when form is active
  • Adding Error Boundary for bindings on list and editor

Tests

Manually tested

  • scenarios you manually tested

Automated tests

  • unit testing covered

Playwright tests ran locally

  • Admin
  • Captures
  • Collections
  • HomePage
  • Login
  • Materialization

Screenshots

React

Updating the typing (no major impact)
image

travis@pop-os:~/code/ui$ npx types-react-codemod preset-18 ./src
Need to install the following packages:
types-react-codemod@3.5.3
Ok to proceed? (y) y
✔ Pick transforms to apply context-any, deprecated-react-type, deprecated-sfc-element, deprecated-sfc, deprecated-stateless-component, implicit-children, useCallback-implicit-any
executing "node /home/travis/.npm/_npx/07333c78fb78394f/node_modules/jscodeshift/bin/jscodeshift.js --extensions=tsx,ts "--ignore-pattern=**/node_modules/**" --no-babel --transform /home/travis/.npm/_npx/07333c78fb78394f/node_modules/types-react-codemod/transforms/preset-18.js --preset18Transforms="context-any,deprecated-react-type,deprecated-sfc-element,deprecated-sfc,deprecated-stateless-component,implicit-children,useCallback-implicit-any" ./src"
Processing 1320 files... 
Spawning 7 workers...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 50 files to free worker...
Sending 20 files to free worker...
All done. 
Results: 
0 errors
1318 unmodified
0 skipped
2 ok
Time elapsed: 8.793seconds 
travis@pop-os:~/code/ui$ 

MUI

Date / Time

Time
image

DateTime
image
image

Icons

File Upload
Removed old dependency and replace with new in-house one
image

Keyboard interactive
image

Now has a "loading" status while uploading the file (might need CPU throttle to test)
image

Updating the node action
Marking new devEngine props
@travjenkins travjenkins added dependencies Pull requests that update a dependency file change:planned This is a planned change labels Jan 30, 2026
@travjenkins travjenkins marked this pull request as ready for review March 2, 2026 20:13
@travjenkins travjenkins requested a review from a team as a code owner March 2, 2026 20:13
useBindingsEditorStore_populateSkimProjectionResponse();
const editModeEnabled = useBindingsEditorStore_editModeEnabled();
const disableSchemaEditing = useDisableSchemaEditing();
const formActive = useFormStateStore_isActive();
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Need to disable editor when active as this was allowing edits to look saved even though they were not.

/>
</Stack>
</StyledEngineProvider>
<Stack sx={{ ...jsonFormsPadding }}>
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Cleaning up this provider as I think it was left over cruft from the past when JsonForms included different MUI version

}
details={
<BindingsEditor itemType={itemType} readOnly={readOnly} />
<ErrorBoundryWrapper>
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This made debugging easier and on the off chance it happens - I think it makes for a better UX.

Did not wrap the list as if that crashes this entire section is not safe to use.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Was not 100% required - but a cleanup that helps a tiny bit.

Comment on lines +55 to +57
...(variantString === 'standard'
? { disableUnderline: true }
: {}),
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This fixed the annoying issue on the dialog where it complained disableUnderline was getting on the component.

const theme = useTheme();

let ButtonComponent: (props: ProviderButtonProps) => EmotionJSX.Element,
let ButtonComponent: (props: ProviderButtonProps) => ReactElement,
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Not referencing Emotion directly anymore

@travjenkins travjenkins changed the title DEPS: Update node to v22 and npm to 11 DEPS: Update node to v22 and npm to 10 Mar 3, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

change:planned This is a planned change dependencies Pull requests that update a dependency file

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant