From 5a81da70f58f5ad9af12b845bb46545442aa7a05 Mon Sep 17 00:00:00 2001
From: Kishor Kumar Paroi <1703053@student.ruet.ac.bd>
Date: Thu, 22 Feb 2024 07:16:34 +0600
Subject: [PATCH 1/3] Please carefully look up to this here setIsActive is not
 defined yet at line 163, isActive is only passing by props from Accordion, I
 know that what I did it's not best solution,I added this lines for proper
 understanding and updated setIsActive to setCheckActive to remove errors,
 Please take necessary steps so that learners like myself don't get confused
 by ReferenceError of variables which isn't declared yet and got curious about
 why it was like that

---
 src/content/learn/sharing-state-between-components.md | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/content/learn/sharing-state-between-components.md b/src/content/learn/sharing-state-between-components.md
index 52eaf28f85d..aa45dc85539 100644
--- a/src/content/learn/sharing-state-between-components.md
+++ b/src/content/learn/sharing-state-between-components.md
@@ -147,13 +147,20 @@ export default function Accordion() {
 }
 
 function Panel({ title, children, isActive }) {
+  // Please carefully look up to this here setIsActive is not defined yet
+  // isActive is only passing by props
+  // I added this lines and updated setIsActive to setCheckActive to remove errors
+  // Please take necessary step so that learners like myself don't get confused by error
+  
+  const [checkActive, setCheckActive] = useState(isActive);
+
   return (
     <section className="panel">
       <h3>{title}</h3>
       {isActive ? (
         <p>{children}</p>
       ) : (
-        <button onClick={() => setIsActive(true)}>
+        <button onClick={() => setCheckActive(true)}>
           Show
         </button>
       )}

From 789ea4a2844f568b56bf23a97f55a9c2b5094069 Mon Sep 17 00:00:00 2001
From: Kishor Kumar Paroi <1703053@student.ruet.ac.bd>
Date: Thu, 22 Feb 2024 07:27:46 +0600
Subject: [PATCH 2/3] updated some lines

---
 src/content/learn/sharing-state-between-components.md | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/content/learn/sharing-state-between-components.md b/src/content/learn/sharing-state-between-components.md
index aa45dc85539..189d35555fd 100644
--- a/src/content/learn/sharing-state-between-components.md
+++ b/src/content/learn/sharing-state-between-components.md
@@ -149,9 +149,11 @@ export default function Accordion() {
 function Panel({ title, children, isActive }) {
   // Please carefully look up to this here setIsActive is not defined yet
   // isActive is only passing by props
-  // I added this lines and updated setIsActive to setCheckActive to remove errors
-  // Please take necessary step so that learners like myself don't get confused by error
-  
+  // I know that what I did it's not best solution
+  // I added this lines for proper understanding and updated setIsActive to setCheckActive to remove errors
+  // Please take necessary steps so that learners like myself don't get confused by ReferenceError
+  // of variables which isn't declared yet and got curious about why it was like that
+
   const [checkActive, setCheckActive] = useState(isActive);
 
   return (

From bfa9023fedb12776f7f025cd8db94de61f5e137a Mon Sep 17 00:00:00 2001
From: Kishor Kumar Paroi <1703053@student.ruet.ac.bd>
Date: Sun, 25 Feb 2024 16:20:26 +0600
Subject: [PATCH 3/3] commented a message to clarify to learner

---
 .../learn/sharing-state-between-components.md        | 12 ++----------
 1 file changed, 2 insertions(+), 10 deletions(-)

diff --git a/src/content/learn/sharing-state-between-components.md b/src/content/learn/sharing-state-between-components.md
index 189d35555fd..f0fc70fc46b 100644
--- a/src/content/learn/sharing-state-between-components.md
+++ b/src/content/learn/sharing-state-between-components.md
@@ -147,22 +147,14 @@ export default function Accordion() {
 }
 
 function Panel({ title, children, isActive }) {
-  // Please carefully look up to this here setIsActive is not defined yet
-  // isActive is only passing by props
-  // I know that what I did it's not best solution
-  // I added this lines for proper understanding and updated setIsActive to setCheckActive to remove errors
-  // Please take necessary steps so that learners like myself don't get confused by ReferenceError
-  // of variables which isn't declared yet and got curious about why it was like that
-
-  const [checkActive, setCheckActive] = useState(isActive);
-
   return (
     <section className="panel">
       <h3>{title}</h3>
       {isActive ? (
         <p>{children}</p>
       ) : (
-        <button onClick={() => setCheckActive(true)}>
+        <button onClick={() => setIsActive(true)}>
+        // 👆 Be careful, This onClick handler doesn't work yet, because we removed setIsActive in step 1
           Show
         </button>
       )}