Skip to content

Conversation

@kanikaa88
Copy link

Summary

Adds TypeScript types to all logger examples in the React Compiler logger documentation to provide better IntelliSense and type safety throughout.

Problem

The current examples don't include TypeScript types, which means:

  • No autocomplete/IntelliSense in editors
  • No type checking to catch errors early
  • Less helpful for TypeScript users

Solution

Added TypeScript types to all three examples:

  1. Intro example - Simple logger demonstration
  2. Basic logging - Success/failure tracking
  3. Detailed error logging - Comprehensive error information

Each example now includes:

  • import type { Logger } from 'babel-plugin-react-compiler'
  • satisfies Logger for type safety

Changes

  • Added TypeScript import to all examples
  • Added satisfies Logger to all logger objects
  • Changed all code blocks from js to ts

Why satisfies?

The satisfies keyword ensures type safety without losing the inferred types of filename and event parameters. This gives developers the best of both worlds - type checking and helpful autocomplete.

Testing

✅ Verified all code syntax is correct
✅ All examples follow consistent pattern
✅ Follows the pattern suggested in the issue

Fixes #8245

Improve the explanation in the 'Fetching data' section to clearly
distinguish when an Effect is needed (synchronization with external
system) versus when it's not needed (user events, data transformation).

Closes reactjs#8226
Add import type and satisfies Logger to the basic logging example
to provide better IntelliSense and type safety for users.

Fixes reactjs#8245
@github-actions
Copy link

Size changes

Details

📦 Next.js Bundle Analysis for react-dev

This analysis was generated by the Next.js Bundle Analysis action. 🤖

This PR introduced no changes to the JavaScript bundle! 🙌

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Suggestion]: Add types to React compiler debugging example

1 participant