diff --git a/src/components/Item.js b/src/components/Item.js
index 5c19fe2..2f03fa7 100644
--- a/src/components/Item.js
+++ b/src/components/Item.js
@@ -7,6 +7,7 @@ const Item = ({
   name: initialName,
   description: initialDescription,
   price: initialPrice,
+  promoPrice,
   qty: initialQty,
   imageUrl,
   imageFile,
@@ -30,16 +31,13 @@ const Item = ({
   useEffect(() => {
     console.log(imageUrl);
     console.log(selectedImage);
-    if (selectedImage) {
-      const reader = new FileReader();
-      reader.onloadend = () => {
-        setPreviewUrl(reader.result);
-      };
-      reader.readAsDataURL(selectedImage);
+    console.log(imageFile)
+    if (imageFile) {
+      setPreviewUrl(imageFile);
     } else {
       setPreviewUrl(imageUrl);
     }
-  }, [selectedImage, imageUrl]);
+  }, [imageFile, imageUrl]);
 
   const handlePlusClick = () => {
     if (!blank) onPlusClick(id);
@@ -89,67 +87,49 @@ const Item = ({
   const handleNameChange = (event) => {
     setItemName(event.target.value);
   };
-    
+
   return (
     <div>
-    <div className={`${styles.item} ${forInvoice ? styles.itemInvoice : ""}`}>
-      {!forInvoice && (
-        <div className={styles.imageContainer}>
-          <img
-            src={
-              blank || previewUrl || isBeingEdit
-                ? previewUrl
-                : "https://png.pngtree.com/png-vector/20221125/ourmid/pngtree-no-image-available-icon-flatvector-illustration-pic-design-profile-vector-png-image_40966566.jpg"
-            }
-            onError={({ currentTarget }) => {
-              currentTarget.onerror = null; // prevents looping
-              currentTarget.src =
-                "https://png.pngtree.com/png-vector/20221125/ourmid/pngtree-no-image-available-icon-flatvector-illustration-pic-design-profile-vector-png-image_40966566.jpg";
-            }}
-            alt={itemName}
-            style={{
-              filter: !isAvailable ? "grayscale(100%)" : "none",
-            }}
-            className={styles.itemImage}
-          />
-
-          {(isBeingEdit || blank) && (
-            <div className={styles.overlay} onClick={handleImageClick}>
-              <span>
-                {previewUrl ? "Ganti gambar" : "Tambah gambar"}
-              </span>
-            </div>
-          )}
-          <input
-            type="file"
-            ref={fileInputRef}
-            className={styles.fileInput}
-            onChange={handleFileChange}
-            accept="image/*"
-            style={{ display: "none" }}
-          />
-        </div>
-      )}
-      <div className={styles.itemDetails}>
-        {forInvoice &&
-              <svg
-                className={styles.plusNegative2}
-                onClick={onRemoveClick}
-                clipRule="evenodd"
-                fillRule="evenodd"
-                strokeLinejoin="round"
-                strokeMiterlimit="2"
-                viewBox="0 0 24 24"
-                xmlns="http://www.w3.org/2000/svg"
-              >
+      <div className={`${styles.item} ${forInvoice ? styles.itemInvoice : ""}`}>
+        {!forInvoice && (
+          <div className={styles.imageContainer}>
+            <img
+              src={
+                previewUrl
+              }
+              onError={({ currentTarget }) => {
+                currentTarget.onerror = null; // prevents looping
+                currentTarget.src =
+                  "https://png.pngtree.com/png-vector/20221125/ourmid/pngtree-no-image-available-icon-flatvector-illustration-pic-design-profile-vector-png-image_40966566.jpg";
+              }}
+              alt={itemName}
+              style={{
+                filter: !isAvailable ? "grayscale(100%)" : "none",
+              }}
+              className={styles.itemImage}
+            />
+          </div>
+        )}
+        <div className={styles.itemDetails}>
+          {forInvoice &&
+            <svg
+              className={styles.plusNegative2}
+              onClick={onRemoveClick}
+              clipRule="evenodd"
+              fillRule="evenodd"
+              strokeLinejoin="round"
+              strokeMiterlimit="2"
+              viewBox="0 0 24 24"
+              xmlns="http://www.w3.org/2000/svg"
+            >
               <path
                 d="m12.002 2c5.518 0 9.998 4.48 9.998 9.998 0 5.517-4.48 9.997-9.998 9.997-5.517 0-9.997-4.48-9.997-9.997 0-5.518 4.48-9.998 9.997-9.998zm0 1.5c-4.69 0-8.497 3.808-8.497 8.498s3.807 8.497 8.497 8.497 8.498-3.807 8.498-8.497-3.808-8.498-8.498-8.498zm-.747 7.75h-3.5c-.414 0-.75.336-.75.75s.336.75.75.75h3.5v3.5c0 .414.336.75.75.75s.75-.336.75-.75v-3.5h3.5c.414 0 .75-.336.75-.75s-.336-.75-.75-.75h-3.5v-3.5c0-.414-.336-.75-.75-.75s-.75.336-.75.75z"
                 fillRule="nonzero"
               />
-              </svg>
-              
-}
-        <input
+            </svg>
+
+          }
+          {/* <input
           className={`${
             forInvoice ? styles.itemInvoiceName : styles.itemName
           } ${isBeingEdit || blank ? styles.blank : styles.notblank} ${
@@ -159,117 +139,160 @@ const Item = ({
           placeholder="Nama item"
           onChange={handleNameChange}
           disabled={!blank && !isBeingEdit}
-        />
+        /> */}
+          <h3 style={{ textTransform: 'capitalize', margin: '5px 0px 10px 10px', fontSize: '17px' }}>{itemName}</h3>
+          {forInvoice && (
+            <>
+              <p className={styles.multiplySymbol}>x</p>
+              <p className={styles.qtyInvoice}>{itemQty}</p>
+            </>
+          )}
+          {!forInvoice && (
+            // <input
+            //   className={`${styles.itemPrice} ${
+            //     isBeingEdit || blank ? styles.blank : styles.notblank
+            //   } ${!isAvailable ? styles.disabled : ""}`}
+            //   value={itemPrice}
+            //   placeholder="Harga"
+            //   onChange={handlePriceChange}
+            //   disabled={!blank && !isBeingEdit}
+            // />
 
-        {forInvoice && (
-          <>
-            <p className={styles.multiplySymbol}>x</p>
-            <p className={styles.qtyInvoice}>{itemQty}</p>
-          </>
-        )}
-        {!forInvoice && (
-          <input
-            className={`${styles.itemPrice} ${
-              isBeingEdit || blank ? styles.blank : styles.notblank
-            } ${!isAvailable ? styles.disabled : ""}`}
-            value={itemPrice}
-            placeholder="Harga"
-            onChange={handlePriceChange}
-            disabled={!blank && !isBeingEdit}
-          />
-        )}
+            <div style={{
+              display: 'flex',
+              flexWrap: 'wrap',
+              alignItems: 'center',
+              color: 'rgb(28, 29, 29)',
+              fontSize: '0.875rem',
+              fontWeight: 600,
+              lineHeight: '1rem',
+              marginLeft: 10
+            }}>
+              {promoPrice && promoPrice != 0 && promoPrice != '' &&
+              <div style={{
+                position: 'relative',
+                marginTop: '0.125rem',
+                display: 'flex',
+                width: 'max-content',
+                alignItems: 'center',
+                whiteSpace: 'nowrap',
+                borderRadius: '9999px',
+                backgroundImage: 'linear-gradient(to right, #e52535, #eb525e)',
+                padding: '0.25rem 0.75rem',
+                color: 'rgb(255, 255, 255)',
+                fontSize: '0.75rem',
+                fontWeight: 600,
+                lineHeight: '1rem'
+              }}>
+                Promo
+              </div>
+}
+              <div style={{ display: 'flex' }}>
+                <span style={{
+                  marginLeft: '1rem',
+                  marginRight: '0.5rem',
+                  marginTop: '0.125rem'
+                }}>{promoPrice}</span>
+                <span style={{
+                  marginTop: '0.125rem',
+                  color: 'rgb(114, 114, 114)',
+                  textDecoration: 'line-through'
+                }}>{initialPrice}</span>
+              </div>
+            </div>
+          )}
 
-        {!forInvoice &&
-          (!isBeingEdit && itemQty != 0 ? (
-            <div className={styles.itemQty}>
-              <svg
-                className={styles.plusNegative}
-                onClick={handleNegativeClick}
-                clipRule="evenodd"
-                fillRule="evenodd"
-                strokeLinejoin="round"
-                strokeMiterlimit="2"
-                viewBox="0 0 24 24"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <path
-                  d="m12.002 2.005c5.518 0 9.998 4.48 9.998 9.997 0 5.518-4.48 9.998-9.998 9.998-5.517 0-9.997-4.48-9.997-9.998 0-5.517 4.48-9.997 9.997-9.997zm0 1.5c-4.69 0-8.497 3.807-8.497 8.497s3.807 8.498 8.497 8.498 8.498-3.808 8.498-8.498-3.808-8.497-8.498-8.497zm4.253 7.75h-8.5c-.414 0-.75.336-.75.75s.336.75.75.75h8.5c.414 0 .75-.336.75-.75s-.336-.75-.75-.75z"
-                  fillRule="nonzero"
-                />
-              </svg>
-              {!blank && !isBeingEdit ? (
-                <p className={styles.itemQtyValue}>{itemQty}</p>
-              ) : (
-                <input
-                  className={styles.itemQtyInput}
-                  value={itemQty}
-                  onChange={handleQtyChange}
-                  disabled={!blank && !isBeingEdit}
-                />
-              )}
-              <svg
-                className={styles.plusNegative}
-                onClick={handlePlusClick}
-                clipRule="evenodd"
-                fillRule="evenodd"
-                strokeLinejoin="round"
-                strokeMiterlimit="2"
-                viewBox="0 0 24 24"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <path
-                  d="m12.002 2c5.518 0 9.998 4.48 9.998 9.998 0 5.517-4.48 9.997-9.998 9.997-5.517 0-9.997-4.48-9.997-9.997 0-5.518 4.48-9.998 9.997-9.998zm0 1.5c-4.69 0-8.497 3.808-8.497 8.498s3.807 8.497 8.497 8.497 8.498-3.807 8.498-8.497-3.808-8.498-8.498-8.498zm-.747 7.75h-3.5c-.414 0-.75.336-.75.75s.336.75.75.75h3.5v3.5c0 .414.336.75.75.75s.75-.336.75-.75v-3.5h3.5c.414 0 .75-.336.75-.75s-.336-.75-.75-.75h-3.5v-3.5c0-.414-.336-.75-.75-.75s-.75.336-.75.75z"
-                  fillRule="nonzero"
-                />
-              </svg>
-            </div>
-          ) : !blank && !isBeingEdit ? (
-            <div className={styles.itemQty}>
-              <button
-                className={styles.addButton}
-                style={{ backgroundColor: !isAvailable ? "" : "inherit", border: `2px solid ${isAvailable? 'inherit': 'gray'}`, color: `${isAvailable? '#73a585': 'gray'}`}}
-                onClick={handlePlusClick}
-                disabled={!isAvailable} // Optionally disable the button if not available
-              >
-                Pesan
-              </button>
-            </div>
-          ) : (
-            <div className={styles.itemQty}>
-              <button
-                className={styles.addButton}
-                style={{
-                  backgroundColor: "white",
-                  width: "150px",
-                  color: '#73a585'
-                }}
-                onClick={isBeingEdit ? handleUpdate : handleCreate}
-              >
-                {isBeingEdit ? "Simpan" : "Buat"}
-              </button>
-            </div>
-          ))}
+          {!forInvoice &&
+            (!isBeingEdit && itemQty != 0 ? (
+              <div className={styles.itemQty}>
+                <svg
+                  className={styles.plusNegative}
+                  onClick={handleNegativeClick}
+                  clipRule="evenodd"
+                  fillRule="evenodd"
+                  strokeLinejoin="round"
+                  strokeMiterlimit="2"
+                  viewBox="0 0 24 24"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="m12.002 2.005c5.518 0 9.998 4.48 9.998 9.997 0 5.518-4.48 9.998-9.998 9.998-5.517 0-9.997-4.48-9.997-9.998 0-5.517 4.48-9.997 9.997-9.997zm0 1.5c-4.69 0-8.497 3.807-8.497 8.497s3.807 8.498 8.497 8.498 8.498-3.808 8.498-8.498-3.808-8.497-8.498-8.497zm4.253 7.75h-8.5c-.414 0-.75.336-.75.75s.336.75.75.75h8.5c.414 0 .75-.336.75-.75s-.336-.75-.75-.75z"
+                    fillRule="nonzero"
+                  />
+                </svg>
+                {!blank && !isBeingEdit ? (
+                  <p className={styles.itemQtyValue}>{itemQty}</p>
+                ) : (
+                  <input
+                    className={styles.itemQtyInput}
+                    value={itemQty}
+                    onChange={handleQtyChange}
+                    disabled={!blank && !isBeingEdit}
+                  />
+                )}
+                <svg
+                  className={styles.plusNegative}
+                  onClick={handlePlusClick}
+                  clipRule="evenodd"
+                  fillRule="evenodd"
+                  strokeLinejoin="round"
+                  strokeMiterlimit="2"
+                  viewBox="0 0 24 24"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="m12.002 2c5.518 0 9.998 4.48 9.998 9.998 0 5.517-4.48 9.997-9.998 9.997-5.517 0-9.997-4.48-9.997-9.997 0-5.518 4.48-9.998 9.997-9.998zm0 1.5c-4.69 0-8.497 3.808-8.497 8.498s3.807 8.497 8.497 8.497 8.498-3.807 8.498-8.497-3.808-8.498-8.498-8.498zm-.747 7.75h-3.5c-.414 0-.75.336-.75.75s.336.75.75.75h3.5v3.5c0 .414.336.75.75.75s.75-.336.75-.75v-3.5h3.5c.414 0 .75-.336.75-.75s-.336-.75-.75-.75h-3.5v-3.5c0-.414-.336-.75-.75-.75s-.75.336-.75.75z"
+                    fillRule="nonzero"
+                  />
+                </svg>
+              </div>
+            ) : !blank && !isBeingEdit ? (
+              <div className={styles.itemQty}>
+                <button
+                  className={styles.addButton}
+                  style={{ backgroundColor: !isAvailable ? "" : "inherit", border: `2px solid ${isAvailable ? 'inherit' : 'gray'}`, color: `${isAvailable ? '#73a585' : 'gray'}` }}
+                  onClick={handlePlusClick}
+                  disabled={!isAvailable} // Optionally disable the button if not available
+                >
+                  Pesan
+                </button>
+              </div>
+            ) : (
+              <div className={styles.itemQty}>
+                <button
+                  className={styles.addButton}
+                  style={{
+                    backgroundColor: "white",
+                    width: "150px",
+                    color: '#73a585'
+                  }}
+                  onClick={isBeingEdit ? handleUpdate : handleCreate}
+                >
+                  {isBeingEdit ? "Simpan" : "Buat"}
+                </button>
+              </div>
+            ))}
 
-        {forInvoice && (
-          <p className={styles.itemPriceInvoice}>Rp {itemQty * itemPrice}</p>
-        )}
-      </div>
-      {forCart && (
-        <div className={styles.remove} onClick={handleRemoveClick}>
-          ⓧ
+          {forInvoice && (
+            <p className={styles.itemPriceInvoice}>Rp {itemQty * itemPrice}</p>
+          )}
         </div>
-      )}
-      {/* {blank && (
+        {forCart && (
+          <div className={styles.remove} onClick={handleRemoveClick}>
+            ⓧ
+          </div>
+        )}
+        {/* {blank && (
         <button className={styles.createItem} onClick={handleCreate}>
           Create Item
         </button>
       )} */}
-    </div>
-    {itemDescription && itemDescription != 'undefined'  && itemDescription?.length &&
-    <div>
-      <p style={{color: '#5f5f5f', fontSize: '3.2vw', padding: '5px'}}>{itemDescription}</p>
-    </div>
-}
+      </div>
+      {itemDescription && itemDescription != 'undefined' && itemDescription?.length &&
+        <div>
+          <p style={{ color: '#5f5f5f', fontSize: '3.2vw', padding: '5px' }}>{itemDescription}</p>
+        </div>
+      }
     </div>
   );
 };
diff --git a/src/components/ItemConfig.js b/src/components/ItemConfig.js
index a246a30..98fc935 100644
--- a/src/components/ItemConfig.js
+++ b/src/components/ItemConfig.js
@@ -27,17 +27,19 @@ const ItemConfig = ({
 
         // Prevent scrolling when modal is open
         document.body.style.overflow = "hidden";
-
-        if (selectedImage) {
+        if(selectedImage){
             const reader = new FileReader();
             reader.onloadend = () => {
                 setPreviewUrl(reader.result);
             };
             reader.readAsDataURL(selectedImage);
+        }
+        else if (imageFile) {
+            setPreviewUrl(imageFile);
         } else {
             setPreviewUrl(imageUrl);
         }
-    }, [selectedImage, imageUrl]);
+    }, [selectedImage, imageFile, imageUrl]);
 
     const handleOverlayClick = (event) => {
         // Prevent scrolling when modal is open
@@ -78,11 +80,11 @@ const ItemConfig = ({
     }, [textareaRef.current]);
 
     const handleCreate = () => {
-        handleCreateItem(itemName, itemPrice, selectedImage, itemDescription);
+        handleCreateItem(itemName, itemPrice, selectedImage, itemDescription, itemPromoPrice);
       };
       const handleUpdate = () => {
         console.log(itemDescription)
-        handleUpdateItem(itemName, itemPrice, selectedImage, itemDescription);
+        handleUpdateItem(itemName, itemPrice, selectedImage, itemDescription, itemPromoPrice);
       };
 
     return (
diff --git a/src/components/ItemLister.js b/src/components/ItemLister.js
index a6077eb..66fca59 100644
--- a/src/components/ItemLister.js
+++ b/src/components/ItemLister.js
@@ -210,44 +210,45 @@ const ItemLister = ({
     name,
     price,
     selectedImage,
-    previewUrl
+    description,
+    promoPrice
   ) => {
     setItemsToCreate((prevItems) =>
       prevItems.map((item) =>
         item.itemId === itemId
-          ? { ...item, name, price, selectedImage, image: previewUrl }
+          ? { ...item, name, price, selectedImage, description, promoPrice } //image: previewUrl
           : item
       )
     );
     setisEditItem(0);
   };
-  const onUpdateItem = (itemId, name, price, image, description) => {
+  const onUpdateItem = (itemId, name, price, image, description, promoPrice) => {
     if (isEdit)
-      setItemsToUpdate((prev) => [...prev, { itemId, name, price, image, description }]);
+      setItemsToUpdate((prev) => [...prev, { itemId, name, price,promoPrice, image, description }]);
     else {
       console.log(itemId, name, price, image, description)
-      handleUpdateItem(itemId, name, price, image, description);
-
+      handleUpdateItem(itemId, name, price, image, description, promoPrice);
+    }
       const itemIndex = items.findIndex((item) => item.itemId === itemId);
       if (itemIndex === -1) return; // Item not found
 
       // Create a copy of the current items array
       const updatedItems = [...items];
       const item = updatedItems[itemIndex];
-      console.log(updatedItems)
+      console.log(items)
       // Toggle the availability locally
       if(image){
         const reader = new FileReader();
         reader.onloadend = () => {
-          updatedItems[itemIndex].image = reader.result;
+          updatedItems[itemIndex].selectedImage = reader.result;
           console.log(reader.result)
         };
         reader.readAsDataURL(image);
 
   
       }
-      const newAvailability = !item.availability;
       updatedItems[itemIndex] = {
+        itemId: item.itemId,
         name,
         price,
         availability: item.availability
@@ -258,7 +259,7 @@ const ItemLister = ({
       setItems(updatedItems);
       setRandomKey(randomKey + 1);
 
-    }
+    
     console.log(itemsToUpdate);
   };
 
@@ -375,7 +376,8 @@ const ItemLister = ({
           name,
           price,
           image,
-          description
+          description,
+          promoPrice
         } of itemsToUpdate) {
           if (newAvailability != undefined) {
             await executeUpdateAvailability(
@@ -409,7 +411,7 @@ const ItemLister = ({
           else {
 
             // Call the handleUpdateItem function
-            const updatedItem = await handleUpdateItem(itemId, name, price, image, description);
+            const updatedItem = await handleUpdateItem(itemId, name, price, image, description, promoPrice);
 
             // Update shopItems state
             setShopItems((prevShopItems) => {
@@ -842,7 +844,7 @@ const ItemLister = ({
                             imageUrl={item.image}
                             imageFile={item.selectedImage}
                             cancelEdit={() => editItem(0)}
-                            handleUpdateItem={(name, price, image, description) => { updateItemInCreate(item.itemId, name, price, image, description); setRandomKey(randomKey + 1); console.log(image) }
+                            handleUpdateItem={(name, price, image, description, promoPrice) => { updateItemInCreate(item.itemId, name, price, image, description, promoPrice); setRandomKey(randomKey + 1); console.log(image) }
                             }
                           />
                         )}
@@ -902,6 +904,7 @@ const ItemLister = ({
                             forInvoice={forInvoice}
                             name={item.name}
                             price={item.price}
+                            promoPrice={item.promoPrice}
                             qty={item.qty}
                             imageUrl={item.image}
                             imageFile={item.selectedImage}
@@ -910,8 +913,8 @@ const ItemLister = ({
                             onRemoveClick={() => handleRemoveClick(item.itemId)}
                             isBeingEdit={isEditItem == item.itemId}
                             isAvailable={item.availability}
-                            handleUpdateItem={(name, price, image, description) =>
-                              updateItemInCreate(item.itemId, name, price, image, description)
+                            handleUpdateItem={(name, price, image, description, promoPrice) =>
+                              updateItemInCreate(item.itemId, name, price, image, description, promoPrice)
                             }
                           />
                         </div>
@@ -940,12 +943,12 @@ const ItemLister = ({
                             imageUrl={
                               itemTypeId ? getImageUrl(item.image) : item.image
                             }
+                            imageFile={item.selectedImage}
                             cancelEdit={() => editItem(0)}
                             handleCreateItem={onCreateItem}
-                            handleUpdateItem={(name, price, image, description) => {
+                            handleUpdateItem={(name, price, image, description, promoPrice) => {
                               console.log(description)
-                              onUpdateItem(item.itemId, name, price, image, description);
-                              setRandomKey(randomKey + 1); console.log(image);
+                              onUpdateItem(item.itemId, name, price, image, description, promoPrice);
                             }
                             }
                           />
@@ -1005,18 +1008,20 @@ const ItemLister = ({
                             forInvoice={forInvoice}
                             name={item.name}
                             price={item.price}
+                            promoPrice={item.promoPrice}
                             qty={item.qty}
                             description={item.description}
                             imageUrl={
                               itemTypeId ? getImageUrl(item.image) : item.image
                             }
+                            imageFile={item.selectedImage}
                             onPlusClick={() => handlePlusClick(item.itemId)}
                             onNegativeClick={() => handleNegativeClick(item.itemId)}
                             onRemoveClick={() => handleRemoveClick(item.itemId)}
                             isBeingEdit={isEditItem == item.itemId}
                             isAvailable={item.availability}
-                            handleUpdateItem={(name, price, image, description) =>
-                              onUpdateItem(item.itemId, name, price, image, description)
+                            handleUpdateItem={(name, price, image, description, promoPrice) =>
+                              onUpdateItem(item.itemId, name, price, image, description, promoPrice)
                             }
                           />
                         </div>
diff --git a/src/helpers/itemHelper.js b/src/helpers/itemHelper.js
index 14f0813..3d388a4 100644
--- a/src/helpers/itemHelper.js
+++ b/src/helpers/itemHelper.js
@@ -110,7 +110,8 @@ export async function updateItem(
   name,
   price,
   selectedImage,
-  description
+  description,
+  promoPrice
 ) {
   try {
     console.log(
@@ -124,6 +125,7 @@ export async function updateItem(
     formData.append("price", price);
     formData.append("image", selectedImage);
     formData.append("description", description);
+    formData.append("promoPrice", promoPrice);
 
     const response = await fetch(`${API_BASE_URL}/item/set-item/${itemId}`, {
       method: "PUT",
diff --git a/src/pages/CafePage.js b/src/pages/CafePage.js
index eb6cb31..a3ea60b 100644
--- a/src/pages/CafePage.js
+++ b/src/pages/CafePage.js
@@ -278,8 +278,8 @@ function CafePage({
                           description
                         )
                       }
-                      handleUpdateItem={(itemId, name, price, selectedImage, description) =>
-                        updateItem(itemId, name, price, selectedImage, description)
+                      handleUpdateItem={(itemId, name, price, selectedImage, description, promoPrice) =>
+                        updateItem(itemId, name, price, selectedImage, description, promoPrice)
                       }
                     />
                   ))}