ok

src/pages/Transactions.js

@@ -109,6 +109,12 @@ export default function Transactions({ propsShopId, sendParam, deviceType }) {
                 setSelectedTable(transaction.Table || { tableId: 0 })
               }
             >
+              {transaction.paymentClaimed && (
+                <div className={styles.RibbonBanner}>
+                  <img src={"https://i.imgur.com/yt6osgL.png"}></img>
+                  <h1>payment claimed</h1>
+                </div>
+              )}
               <h2 className={styles["Transactions-detail"]}>
                 Transaction ID: {transaction.transactionId}
               </h2>
@@ -148,6 +154,8 @@ export default function Transactions({ propsShopId, sendParam, deviceType }) {
                     "Confirm has paid" // Display "Confirm has paid" if the transaction is confirmed (1)
                   ) : transaction.confirmed === -1 ? (
                     "Declined" // Display "Declined" if the transaction is declined (-1)
+                  ) : transaction.confirmed === -2 ? (
+                    "Canceled" // Display "Declined" if the transaction is declined (-1)
                   ) : transaction.confirmed === 2 ? (
                     "Confirm item has ready" // Display "Item ready" if the transaction is ready (2)
                   ) : transaction.confirmed === 3 ? (