From dc4d67a7661d94cba2d096467307b0fabb00fa17 Mon Sep 17 00:00:00 2001
From: Hashim1999164 <sardarhashim30@gmail.com>
Date: Thu, 23 Jul 2026 21:59:45 +0500
Subject: [PATCH] docs: show todo.done in useImmer checkbox example

The linked CodeSandbox used todo.finished for checked while the state
uses done. Inline the full example with checked={todo.done} instead.
---
 website/docs/example-setstate.mdx             | 23 ++++++++++++++++---
 .../current/example-setstate.mdx              | 23 ++++++++++++++++---
 2 files changed, 40 insertions(+), 6 deletions(-)

diff --git a/website/docs/example-setstate.mdx b/website/docs/example-setstate.mdx
index e58b2b01..e41accd7 100644
--- a/website/docs/example-setstate.mdx
+++ b/website/docs/example-setstate.mdx
@@ -117,11 +117,28 @@ const TodoList = () => {
     });
   }, []);
 
-  // etc
+  return (
+    <ul>
+      {todos.map((todo) => (
+        <li key={todo.id}>
+          <label>
+            <input
+              type="checkbox"
+              checked={todo.done}
+              onChange={() => handleToggle(todo.id)}
+            />
+            {todo.title}
+          </label>
+        </li>
+      ))}
+      <button type="button" onClick={handleAdd}>
+        Add todo
+      </button>
+    </ul>
+  );
+};
 ```
 
-For the full demo see [CodeSandbox](https://codesandbox.io/s/use-immer-bvd5v?file=/src/index.js).
-
 ## useReducer + Immer
 
 Similarly to `useState`, `useReducer` combines neatly with Immer as well, as demonstrated in this [CodeSandbox](https://codesandbox.io/s/immer-usereducer-bqpzn?file=/src/index.js:0-1018):
diff --git a/website/i18n/zh-CN/docusaurus-plugin-content-docs/current/example-setstate.mdx b/website/i18n/zh-CN/docusaurus-plugin-content-docs/current/example-setstate.mdx
index 884c4273..82fc0eb6 100644
--- a/website/i18n/zh-CN/docusaurus-plugin-content-docs/current/example-setstate.mdx
+++ b/website/i18n/zh-CN/docusaurus-plugin-content-docs/current/example-setstate.mdx
@@ -117,11 +117,28 @@ const TodoList = () => {
     });
   }, []);
 
-  // etc
+  return (
+    <ul>
+      {todos.map((todo) => (
+        <li key={todo.id}>
+          <label>
+            <input
+              type="checkbox"
+              checked={todo.done}
+              onChange={() => handleToggle(todo.id)}
+            />
+            {todo.title}
+          </label>
+        </li>
+      ))}
+      <button type="button" onClick={handleAdd}>
+        Add todo
+      </button>
+    </ul>
+  );
+};
 ```
 
-完整的 demo 请参阅 [CodeSandbox](https://codesandbox.io/s/use-immer-bvd5v?file=/src/index.js)
-
 ## useReducer + Immer
 
 与 `useState` 类似，`useReducer` 也与 Immer 巧妙结合，如 [CodeSandbox](https://codesandbox.io/s/immer-usereducer-bqpzn?file=/src/index.js:0-1018) 所示：