React 19 Compatibility and Migration Plan

[vishnuravi]

React 19 Compatibility and Migration Plan

Current State

The library currently supports React ^18.2.0 and needs updates for React 19 compatibility. Main issues center around class components using defaultProps and potential react-dnd compatibility concerns.

Critical Issues

1. defaultProps Usage

Files: src/react-sortable-tree.tsx, src/tree-node.tsx

Both main components use defaultProps on class components. While React 19 keeps defaultProps for classes (unlike function components), migration to modern patterns is recommended.

Reference: React 19 Upgrade Guide

2. React-DnD Compatibility

Current version: react-dnd v14.0.4

Community reports mixed results with React 19. Need to verify compatibility and potentially upgrade. The react-dnd team has an open issue tracking React 19 support.

Reference: React-DnD React 19 Support Issue

3. Class Component Architecture

Components: ReactSortableTree, TreeNodeComponent

Both main components are class-based and could benefit from conversion to functional components with hooks for better React 19 compatibility.

Migration Tasks

Phase 1: Basic Compatibility

• Update peer dependencies to support React 19: "react": "^18.2.0 || ^19.0.0"
• Test react-dnd v14.0.4 with React 19
• Verify basic functionality works

Phase 2: Modernization

• Convert ReactSortableTree class to functional component
• Convert TreeNodeComponent class to functional component
• Replace DndContext.Consumer with useContext hook
• Remove defaultProps usage

Phase 3: Testing

• Comprehensive testing with React 19
• Update CI to test against React 19
• Update documentation

Dependencies

• react-dnd: v14.0.4 (verify React 19 compatibility)
• virtua: v0.33.7 (check for React 19 updates)
• @types/react: v18.3.3 (update when React 19 types are stable)

Risk Assessment

• Low: defaultProps removal
• Medium: Class component migration
• High: react-dnd external dependency compatibility

The library is in relatively good shape for React 19 migration. No usage of deprecated APIs like PropTypes, legacy context, or problematic lifecycle methods was found.

References

• React v19 Release
• React 19 Upgrade Guide
• React-DnD React 19 Support Issue
• React-beautiful-dnd Deprecation

---

This analysis was done by an AI agent and reviewed by @vishnuravi