You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
IMPORTANT: A codemod (`react-declassify`) has ALREADY attempted to transform React class components to function components in this repository.
30
-
Most files are COMPLETE, but `react-declassify` has known limitations and leaves markers where it fails. Your job is to REVIEW, FIX, and FINISH the transformations.
29
+
You are reviewing React component migrations.
30
+
Only if you see `react-declassify-disable` or `TODO_this` in the provided files, fix the component to use Hooks.
31
+
If the file looks fine and does not have these markers, return immediately with no changes. Do not output any verbose explanations.
31
32
32
-
CRITICAL: You MUST provide verbose output explaining what you're doing at each step!
33
-
Output your progress as you work so users can see what's happening.
34
-
35
-
Step 1: Search for Hard Errors and Soft Errors
36
-
- Search the project for `react-declassify-disable Cannot perform transformation`. This indicates a HARD ERROR where the tool gave up. You MUST manually convert this entire class to a function component with Hooks yourself!
37
-
- Search the project for `TODO_this`. This indicates a SOFT ERROR where the tool didn't know how to bind or resolve `this`. Fix the scoping and state/prop references.
38
-
39
-
Step 2: Address react-declassify's Known Limitations
40
-
- Class Refs: If the old class was receiving refs or being instantiated via `useRef`, the new functional component will break. You MUST wrap the component in `React.forwardRef` and use `useImperativeHandle` to expose the necessary methods/properties!
41
-
- Stricter Render Types: If the component returns a bare string/number and TypeScript complains about `FC<Props>`, wrap the return statement in a fragment `<> ... </>`.
42
-
43
-
Step 3: Review common transformation issues
44
-
- Fix missing or incorrect dependency arrays in useEffect hooks
45
-
- Ensure all setState calls use the functional updater when depending on previous state
46
-
- Add missing cleanup functions in useEffect where needed
47
-
48
-
Step 4: ALWAYS output a clear summary
49
-
You MUST provide a detailed summary at the end including:
50
-
- Total files reviewed
51
-
- List of ACTUAL files you modified (use real file paths)
52
-
- Specific changes made to each file (e.g., "Resolved TODO_this", "Added forwardRef")
0 commit comments