Remove invalid React Compiler expectedErrors annotations

src/content/learn/describing-the-ui.md

@@ -474,7 +474,7 @@ h2 { font-size: 20px; }
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [5]}}
+```js
 let guest = 0;
 
 function Cup() {

src/content/learn/escape-hatches.md

@@ -201,7 +201,7 @@ Effect হল React এর জগত থেকে একটি escape hatch। 
 
 উদাহরণস্বরূপ, একটা state এর উপর নির্ভর করে আরেকটা state পরিবর্তন করতে আপনার Effect এর প্রয়োজন নেইঃ
 
-```js {expectedErrors: {'react-compiler': [8]}} {5-9}
+```js {5-9}
 function Form() {
   const [firstName, setFirstName] = useState('Taylor');
   const [lastName, setLastName] = useState('Swift');

src/content/learn/keeping-components-pure.md

@@ -93,7 +93,7 @@ React এর রেন্ডারিং প্রসেস সবসময় ব
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [5]}}
+```js
 let guest = 0;
 
 function Cup() {
@@ -380,7 +380,7 @@ The buggy code is in `Profile.js`. Make sure you read it all from top to bottom!
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [7]}} src/Profile.js
+```js src/Profile.js
 import Panel from './Panel.js';
 import { getImageUrl } from './utils.js';
 
@@ -602,7 +602,7 @@ export default function StoryTray({ stories }) {
 }
 ```
 
-```js {expectedErrors: {'react-compiler': [16]}} src/App.js hidden
+```js src/App.js hidden
 import { useState, useEffect } from 'react';
 import StoryTray from './StoryTray.js';
 
@@ -698,7 +698,7 @@ export default function StoryTray({ stories }) {
 }
 ```
 
-```js {expectedErrors: {'react-compiler': [16]}} src/App.js hidden
+```js src/App.js hidden
 import { useState, useEffect } from 'react';
 import StoryTray from './StoryTray.js';
 
@@ -790,7 +790,7 @@ export default function StoryTray({ stories }) {
 }
 ```
 
-```js {expectedErrors: {'react-compiler': [16]}} src/App.js hidden
+```js src/App.js hidden
 import { useState, useEffect } from 'react';
 import StoryTray from './StoryTray.js';
 

src/content/learn/lifecycle-of-reactive-effects.md

@@ -1131,7 +1131,7 @@ If you see a linter rule being suppressed, remove the suppression! That's where
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [16]}}
+```js
 import { useState, useEffect } from 'react';
 
 export default function App() {
@@ -1374,7 +1374,7 @@ export default function App() {
 }
 ```
 
-```js {expectedErrors: {'react-compiler': [8]}} src/ChatRoom.js active
+```js src/ChatRoom.js active
 import { useState, useEffect } from 'react';
 
 export default function ChatRoom({ roomId, createConnection }) {

src/content/learn/preserving-and-resetting-state.md

@@ -704,7 +704,7 @@ Here, the `MyTextField` component function is defined *inside* `MyComponent`:
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [7]}}
+```js
 import { useState } from 'react';
 
 export default function MyComponent() {

src/content/learn/react-compiler/introduction.md

@@ -28,7 +28,7 @@ React Compiler automatically optimizes your React application at build time. Rea
 
 Without the compiler, you need to manually memoize components and values to optimize re-renders:
 
-```js {expectedErrors: {'react-compiler': [4]}}
+```js
 import { useMemo, useCallback, memo } from 'react';
 
 const ExpensiveComponent = memo(function ExpensiveComponent({ data, onClick }) {

src/content/learn/referencing-values-with-refs.md

@@ -211,7 +211,7 @@ export default function Counter() {
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [13]}}
+```js
 import { useRef } from 'react';
 
 export default function Counter() {
@@ -313,7 +313,7 @@ console.log(ref.current); // 5
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [10]}}
+```js
 import { useState } from 'react';
 
 export default function Chat() {
@@ -418,7 +418,7 @@ export default function Chat() {
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [10]}}
+```js
 import { useRef } from 'react';
 
 export default function Toggle() {

src/content/learn/removing-effect-dependencies.md

@@ -303,7 +303,7 @@ Suppressing the linter leads to very unintuitive bugs that are hard to find and
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [14]}}
+```js
 import { useState, useEffect } from 'react';
 
 export default function Timer() {
@@ -794,7 +794,7 @@ It is important to declare it as a dependency! This ensures, for example, that i
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [10]}}
+```js
 import { useState, useEffect } from 'react';
 import { createConnection } from './chat.js';
 

src/content/learn/responding-to-events.md

@@ -546,7 +546,7 @@ Clicking this button is supposed to switch the page background between white and
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [5, 7]}}
+```js
 export default function LightSwitch() {
   function handleClick() {
     let bodyStyle = document.body.style;

src/content/learn/separating-events-from-effects.md

@@ -711,7 +711,7 @@ Here, `url` inside `onVisit` corresponds to the *latest* `url` (which could have
 
 In the existing codebases, you may sometimes see the lint rule suppressed like this:
 
-```js {expectedErrors: {'react-compiler': [8]}} {7-9}
+```js {7-9}
 function Page({ url }) {
   const { items } = useContext(ShoppingCartContext);
   const numberOfItems = items.length;
@@ -735,7 +735,7 @@ Can you see why?
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [16]}}
+```js
 import { useState, useEffect } from 'react';
 
 export default function App() {
@@ -990,7 +990,7 @@ To fix this code, it's enough to follow the rules.
 ```
 
 
-```js {expectedErrors: {'react-compiler': [14]}}
+```js
 import { useState, useEffect } from 'react';
 
 export default function Timer() {

src/content/learn/state-a-components-memory.md

@@ -23,7 +23,7 @@ title: "State: কম্পোনেন্ট এর মেমোরি"
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [7]}}
+```js
 import { sculptureList } from './data.js';
 
 export default function Gallery() {
@@ -1228,7 +1228,7 @@ img { width: 120px; height: 120px; }
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [6]}}
+```js
 export default function Form() {
   let firstName = '';
   let lastName = '';
@@ -1336,7 +1336,7 @@ _কোথায়_ হুক কল করা যাবে, সেটার ক
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [9]}}
+```js
 import { useState } from 'react';
 
 export default function FeedbackForm() {

src/content/learn/synchronizing-with-effects.md

@@ -95,7 +95,7 @@ function VideoPlayer({ src, isPlaying }) {
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [7, 9]}}
+```js
 import { useState, useRef, useEffect } from 'react';
 
 function VideoPlayer({ src, isPlaying }) {
@@ -1469,7 +1469,7 @@ body {
 <Sandpack>
 
 {/* not the most efficient, but this validation is enabled in the linter only, so it's fine to ignore it here since we know what we're doing */}
-```js {expectedErrors: {'react-compiler': [9]}} src/App.js
+```js src/App.js
 import { useState, useEffect } from 'react';
 import { fetchBio } from './api.js';
 
@@ -1543,7 +1543,7 @@ export async function fetchBio(person) {
 <Sandpack>
 
 {/* not the most efficient, but this validation is enabled in the linter only, so it's fine to ignore it here since we know what we're doing */}
-```js {expectedErrors: {'react-compiler': [9]}} src/App.js
+```js src/App.js
 import { useState, useEffect } from 'react';
 import { fetchBio } from './api.js';
 

src/content/learn/updating-objects-in-state.md

@@ -55,7 +55,7 @@ This example holds an object in state to represent the current pointer position.
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [11]}}
+```js
 import { useState } from 'react';
 
 export default function MovingDot() {
@@ -209,7 +209,7 @@ These input fields don't work because the `onChange` handlers mutate the state:
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [11, 15, 19]}}
+```js
 import { useState } from 'react';
 
 export default function Form() {
@@ -832,7 +832,7 @@ Your task is to fix all of these bugs. As you fix them, explain why each of them
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [11]}}
+```js
 import { useState } from 'react';
 
 export default function Scoreboard() {
@@ -988,7 +988,7 @@ If something unexpected changes, there is a mutation. Find the mutation in `App.
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [17]}} src/App.js
+```js src/App.js
 import { useState } from 'react';
 import Background from './Background.js';
 import Box from './Box.js';
@@ -1293,7 +1293,7 @@ This is the same buggy example as in the previous challenge. This time, fix the
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [18]}} src/App.js
+```js src/App.js
 import { useState } from 'react';
 import { useImmer } from 'use-immer';
 import Background from './Background.js';

src/content/learn/you-might-not-need-an-effect.md

@@ -34,7 +34,7 @@ To help you gain the right intuition, let's look at some common concrete example
 
 Suppose you have a component with two state variables: `firstName` and `lastName`. You want to calculate a `fullName` from them by concatenating them. Moreover, you'd like `fullName` to update whenever `firstName` or `lastName` change. Your first instinct might be to add a `fullName` state variable and update it in an Effect:
 
-```js {expectedErrors: {'react-compiler': [8]}} {5-9}
+```js {5-9}
 function Form() {
   const [firstName, setFirstName] = useState('Taylor');
   const [lastName, setLastName] = useState('Swift');
@@ -66,7 +66,7 @@ function Form() {
 
 This component computes `visibleTodos` by taking the `todos` it receives by props and filtering them according to the `filter` prop. You might feel tempted to store the result in state and update it from an Effect:
 
-```js {expectedErrors: {'react-compiler': [7]}} {4-8}
+```js {4-8}
 function TodoList({ todos, filter }) {
   const [newTodo, setNewTodo] = useState('');
 
@@ -165,7 +165,7 @@ Also note that measuring performance in development will not give you the most a
 
 This `ProfilePage` component receives a `userId` prop. The page contains a comment input, and you use a `comment` state variable to hold its value. One day, you notice a problem: when you navigate from one profile to another, the `comment` state does not get reset. As a result, it's easy to accidentally post a comment on a wrong user's profile. To fix the issue, you want to clear out the `comment` state variable whenever the `userId` changes:
 
-```js {expectedErrors: {'react-compiler': [6]}} {4-7}
+```js {4-7}
 export default function ProfilePage({ userId }) {
   const [comment, setComment] = useState('');
 
@@ -208,7 +208,7 @@ Sometimes, you might want to reset or adjust a part of the state on a prop chang
 
 This `List` component receives a list of `items` as a prop, and maintains the selected item in the `selection` state variable. You want to reset the `selection` to `null` whenever the `items` prop receives a different array:
 
-```js {expectedErrors: {'react-compiler': [7]}} {5-8}
+```js {5-8}
 function List({ items }) {
   const [isReverse, setIsReverse] = useState(false);
   const [selection, setSelection] = useState(null);
@@ -819,7 +819,7 @@ Simplify this component by removing all the unnecessary state and Effects.
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [12, 16, 20]}}
+```js
 import { useState, useEffect } from 'react';
 import { initialTodos, createTodo } from './todos.js';
 
@@ -1022,7 +1022,7 @@ One solution is to add a `useMemo` call to cache the visible todos. There is als
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [11]}}
+```js
 import { useState, useEffect } from 'react';
 import { initialTodos, createTodo, getVisibleTodos } from './todos.js';
 
@@ -1106,7 +1106,7 @@ Remove the state variable and the Effect, and instead add a `useMemo` call to ca
 
 <Sandpack>
 
-```js {expectedErrors: {'react-compiler': [8]}}
+```js
 import { useState, useMemo } from 'react';
 import { initialTodos, createTodo, getVisibleTodos } from './todos.js';
 
@@ -1363,7 +1363,7 @@ export default function ContactList({
 }
 ```
 
-```js {expectedErrors: {'react-compiler': [8, 9]}} src/EditContact.js active
+```js src/EditContact.js active
 import { useState, useEffect } from 'react';
 
 export default function EditContact({ savedContact, onSave }) {

src/content/reference/eslint-plugin-react-hooks/lints/component-hook-factories.md

@@ -16,7 +16,7 @@ Defining components or hooks inside other functions creates new instances on eve
 
 Examples of incorrect code for this rule:
 
-```js {expectedErrors: {'react-compiler': [14]}}
+```js
 // ❌ Factory function creating components
 function createComponent(defaultValue) {
   return function Component() {

src/content/reference/eslint-plugin-react-hooks/lints/error-boundaries.md

@@ -16,7 +16,7 @@ Try/catch blocks can't catch errors that happen during React's rendering process
 
 Examples of incorrect code for this rule:
 
-```js {expectedErrors: {'react-compiler': [4]}}
+```js
 // ❌ Try/catch won't catch render errors
 function Parent() {
   try {
@@ -48,7 +48,7 @@ function Parent() {
 
 The `use` hook doesn't throw errors in the traditional sense, it suspends component execution. When `use` encounters a pending promise, it suspends the component and lets React show a fallback. Only Suspense and Error Boundaries can handle these cases. The linter warns against `try`/`catch` around `use` to prevent confusion as the `catch` block would never run.
 
-```js {expectedErrors: {'react-compiler': [5]}}
+```js
 // ❌ Try/catch around `use` hook
 function Component({promise}) {
   try {

src/content/reference/eslint-plugin-react-hooks/lints/purity.md

@@ -57,7 +57,7 @@ function Component() {
 
 Calling `Date.now()` during render makes your component impure:
 
-```js {expectedErrors: {'react-compiler': [3]}}
+```js
 // ❌ Wrong: Time changes every render
 function Clock() {
   return <div>Current time: {Date.now()}</div>;

src/content/reference/eslint-plugin-react-hooks/lints/set-state-in-effect.md

@@ -71,7 +71,7 @@ function Component({selectedId, items}) {
 
 Examples of correct code for this rule:
 
-```js {expectedErrors: {'react-compiler': [8]}}
+```js
 // ✅ setState in an effect is fine if the value comes from a ref
 function Tooltip() {
   const ref = useRef(null);