From 71c77ccb74dc9c1c6372966b07ac8e8e855e3b6d Mon Sep 17 00:00:00 2001
From: "Stanislav (Stanley) Modrak"
 <44023416+smith558@users.noreply.github.com>
Date: Mon, 18 Dec 2023 17:29:24 +0000
Subject: [PATCH 1/2] Add guiding note

---
 src/content/learn/thinking-in-react.md | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/content/learn/thinking-in-react.md b/src/content/learn/thinking-in-react.md
index eec4ae336aa..267b83f631e 100644
--- a/src/content/learn/thinking-in-react.md
+++ b/src/content/learn/thinking-in-react.md
@@ -492,6 +492,8 @@ Inside the `SearchBar`, you will add the `onChange` event handlers and set the p
   onChange={(e) => onFilterTextChange(e.target.value)} />
 ```
 
+(Set up changing state for the checkbox using `onInStockOnlyChange` yourself.)
+
 Now the application fully works!
 
 <Sandpack>

From bd21028f9d442c8147f9b2d4706fd564df44b124 Mon Sep 17 00:00:00 2001
From: "Stanislav (Stanley) Modrak"
 <44023416+smith558@users.noreply.github.com>
Date: Sat, 27 Jan 2024 20:37:42 +0000
Subject: [PATCH 2/2] Update sandbox to include event handlers

---
 src/content/learn/thinking-in-react.md | 28 ++++++++++++++++++--------
 1 file changed, 20 insertions(+), 8 deletions(-)

diff --git a/src/content/learn/thinking-in-react.md b/src/content/learn/thinking-in-react.md
index 267b83f631e..0f05a0569f6 100644
--- a/src/content/learn/thinking-in-react.md
+++ b/src/content/learn/thinking-in-react.md
@@ -484,16 +484,28 @@ function FilterableProductTable({ products }) {
 
 Inside the `SearchBar`, you will add the `onChange` event handlers and set the parent state from them:
 
-```js {5}
-<input 
-  type="text" 
-  value={filterText} 
-  placeholder="Search..." 
-  onChange={(e) => onFilterTextChange(e.target.value)} />
+```js {4,5,13,19}
+function SearchBar({
+  filterText,
+  inStockOnly,
+  onFilterTextChange,
+  onInStockOnlyChange
+}) {
+  return (
+    <form>
+      <input
+        type="text"
+        value={filterText}
+        placeholder="Search..."
+        onChange={(e) => onFilterTextChange(e.target.value)}
+      />
+      <label>
+        <input
+          type="checkbox"
+          checked={inStockOnly}
+          onChange={(e) => onInStockOnlyChange(e.target.checked)}
 ```
 
-(Set up changing state for the checkbox using `onInStockOnlyChange` yourself.)
-
 Now the application fully works!
 
 <Sandpack>