ok

src/pages/Cart.js

@@ -140,6 +140,37 @@ export default function Invoice({ table, sendParam, deviceType, socket }) {
     console.log(table);
   }, [table]);
 
+  useEffect(() => {
+    console.log(localStorage.getItem('cart'))
+    console.log(cartItems)
+
+    // Parse the local storage cart
+    const localStorageCart = JSON.parse(localStorage.getItem('cart'));
+
+    // Create a set of itemIds from the local storage cart for quick lookup
+    const localStorageItemIds = new Set(localStorageCart[0].items.map(item => item.itemId));
+
+    // Filter out items from cartItems that do not exist in the local storage cart
+    const updatedCartItems = cartItems.map(itemType => ({
+        ...itemType,
+        itemList: itemType.itemList.filter(item => localStorageItemIds.has(item.itemId))
+    }));
+
+    setCartItems(updatedCartItems);
+
+
+    const totalPrice = updatedCartItems.reduce((total, itemType) => {
+      return (
+        total +
+        itemType.itemList.reduce((subtotal, item) => {
+          return subtotal + item.qty * item.price;
+        }, 0)
+      );
+    }, 0);
+    setTotalPrice(totalPrice);
+  }, [localStorage.getItem('cart')]);
+
+
   const handleOrderTypeChange = (event) => {
     setOrderType(event.target.value);
   };

src/pages/Transactions.module.css

@@ -4,7 +4,7 @@
   display: flex;
   flex-direction: column;
   justify-content: flex-start;
-  font-size: calc(10px + 2vmin);
+  font-size: calc(8px + 2vmin);
   color: rgba(88, 55, 50, 1);
   background-color: #e9e9e9;
   border-radius: 15px;