diff --git a/2. reactjs-concepts-2024/src/App.jsx b/2. reactjs-concepts-2024/src/App.jsx
index e90b8e6..00120db 100644
--- a/2. reactjs-concepts-2024/src/App.jsx	
+++ b/2. reactjs-concepts-2024/src/App.jsx	
@@ -19,7 +19,7 @@ function App() {
       {/* <ClassBasedComponent /> */}
       {/* <FunctionalComponent /> */}
 
-      {/* <ProductList listOfProducts={dummyProductData} name="Roxy" city="ABC" /> */}
+      <ProductList listOfProducts={dummyProductData} name="Roxy" city="ABC" />
       {/* <Users /> */}
       {/* <UseReducerExample /> */}
       {/* <ContextButtonComponent />
diff --git a/2. reactjs-concepts-2024/src/components/products/components/product-item.jsx b/2. reactjs-concepts-2024/src/components/products/components/product-item.jsx
index 60abd6e..833bdd6 100644
--- a/2. reactjs-concepts-2024/src/components/products/components/product-item.jsx	
+++ b/2. reactjs-concepts-2024/src/components/products/components/product-item.jsx	
@@ -1,7 +1,19 @@
 import styles from "./product-item.module.css";
+import { useState } from "react";
 
 function ButtonComponent() {
-  return <button className={styles.buttonStyle}>Click</button>;
+  function handleToggle() {
+    setFlag(!flag);
+  }
+  const [flag, setFlag] = useState(false);
+  return (
+    <button
+      className={flag ? styles.buttonStyle : styles.buttonStyle2}
+      onClick={handleToggle}
+    >
+      Click to see changes
+    </button>
+  );
 }
 
 function ProductItem({ singleProductItem, key }) {
diff --git a/2. reactjs-concepts-2024/src/components/products/components/product-item.module.css b/2. reactjs-concepts-2024/src/components/products/components/product-item.module.css
index d62161a..d37835e 100644
--- a/2. reactjs-concepts-2024/src/components/products/components/product-item.module.css	
+++ b/2. reactjs-concepts-2024/src/components/products/components/product-item.module.css	
@@ -5,6 +5,13 @@
   color: white;
 }
 
+.buttonStyle2 {
+  background-color: rgb(194, 57, 57);
+  font-weight: bolder;
+  font-size: 18px;
+  color: rgb(20, 11, 11);
+}
+
 .productTitle {
   font-size: 20px;
   color: rgb(109, 12, 12);
diff --git a/2. reactjs-concepts-2024/src/components/products/index.jsx b/2. reactjs-concepts-2024/src/components/products/index.jsx
index 1880769..01a5b2f 100644
--- a/2. reactjs-concepts-2024/src/components/products/index.jsx	
+++ b/2. reactjs-concepts-2024/src/components/products/index.jsx	
@@ -44,7 +44,6 @@ function ProductList({ name, city, listOfProducts }) {
       ) : (
         <h4>Hello</h4>
       )}
-
       <div>
         <button
           style={{