Skip to content

Fix lint error: Remove async keyword from useMemo callback#125

Merged
Wintus merged 2 commits intotrunkfrom
fix-lint-of-react
Oct 19, 2025
Merged

Fix lint error: Remove async keyword from useMemo callback#125
Wintus merged 2 commits intotrunkfrom
fix-lint-of-react

Conversation

@Wintus
Copy link
Owner

@Wintus Wintus commented Oct 19, 2025

Summary

  • Fixed ESLint error in PageTitleInput.tsx where useMemo callback was using async keyword
  • Rewrote the async function to return a Promise using .then()/.catch() pattern instead
  • Added documentation comment explaining the linter rule and rationale

Details

The React compiler doesn't allow async functions as useMemo callbacks. While semantically equivalent, React prefers explicit Promise returns to make it clear the callback itself runs synchronously even though it returns async work.

see https://github.com/facebook/react/blob/v19.2.0/compiler/packages/babel-plugin-react-compiler/src/Validation/ValidateUseMemo.ts#L90-L105

The ESLint has started alerting this since v7

Changes

  • Converted useMemo(async () => {...}) to useMemo(() => Promise.resolve(...).then())
  • Added clarifying comment about the linter rule requirement

Test plan

  • npm run lint passes without errors
  • Existing tests still pass

🤖 Generated with Claude Code

@Wintus Wintus merged commit b6fe73b into trunk Oct 19, 2025
3 checks passed
@Wintus Wintus deleted the fix-lint-of-react branch October 19, 2025 03:42
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant