fix: resolve React 19 hook lint errors from eslint-config-next 16.2#14
Open
iot-rocket wants to merge 3 commits into
Open
fix: resolve React 19 hook lint errors from eslint-config-next 16.2#14iot-rocket wants to merge 3 commits into
iot-rocket wants to merge 3 commits into
Conversation
Bumps all minor/patch updates from npm outdated. Holds to Node 20, ESLint 9, and TypeScript 5.8 per project constraints; skips the corresponding majors (@types/node@25, eslint@10, typescript@6). Adjusts the axios response-header access in the hawkbit proxy route to satisfy the narrower header value type introduced in axios 1.15.
The React 19 hook rules shipped with eslint-config-next 16.2 flag three categories of anti-patterns in this codebase: - react-hooks/refs: refs read during render in Collapsible, the deployment DnD container, and the distribution-sets layout. Refactored each site to store the relevant values in state instead of refs so rendering observes updates correctly. - react-hooks/set-state-in-effect: setState called synchronously in useEffect in configuration-form, the three tag/type forms, and the create-rollout select-target-filter container. Switched to the documented prop-to-state "store prev value in render" pattern for configuration-form and the rollout container, and migrated the tag/type forms from react-hook-form's one-shot defaultValues to its values prop so the form syncs automatically when defaultValues change. - react-hooks/immutability: total-targets-per-status-cell deleted keys off a prop object; replaced with an immutable Object.entries().filter() transform matching the pattern used elsewhere in the project.
- use-filter-multiple-select: add missing useEffect deps (getOptionLabel, filters, setFilters, onFilterChanged) to satisfy react-hooks/exhaustive-deps, and drop the stale "Selected options changed" debug console.log. - auth-options: switch the authorize() failure handler from `catch (error)` to a bare `catch` (tsconfig targets ES2022), removing the unused binding.
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
1 participant
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
react-hooks/refs,react-hooks/set-state-in-effect, andreact-hooks/immutabilityrules that ship witheslint-config-next@16.2(pulled in by the base branch).useEffectdeps inuse-filter-multiple-select, and an unusedcatchbinding inauth-options.react-hooks/incompatible-librarynotices remain intentionally — informational, caused by TanStack Table'suseReactTableand react-hook-form'swatch()returning non-memoizable references. React Compiler handles this gracefully.Base branch is
chore/update-dependencies; GitHub will auto-retarget tomainonce that PR merges.Notable refactors
collapsible: height measurement andcontentRefmoved from the shared context into theContentsubcomponent.useReffor the dragged-items state converted touseStateso theDragOverlaypreview re-renders correctly.configuration-form& rolloutSelectTargetFilterContainer: prop-to-state sync uses the documented "storing information from previous renders" pattern instead of setState-in-useEffect.distribution-tag-form,target-tag-form,target-type-form: migrated from react-hook-form's one-shotdefaultValuesto itsvaluesprop so the form syncs automatically when the incoming default data changes.total-targets-per-status-cell:delete-on-prop replaced withObject.entries(...).filter(...), matching the pattern insrc/utils/columns-visibility.ts.