Order Placed Successfully!

\n Your order has been sent to the kitchen. You'll be notified when it's ready.\n

Table: {table.name}

Customer: {customerName}

\n {\n setOrderPlaced(false);\n setCustomerName('');\n setCustomerPhone('');\n }}\n className=\"w-full bg-blue-600 text-white py-3 px-4 rounded-lg font-semibold hover:bg-blue-700 transition-colors\"\n >\n Place Another Order\n \n \n Back to QR Scanner\n \n

\n );\n }\n\n return (\n

\n {/* Header */}\n

\n \n \n \n

\n {categories.map(category => (\n setSelectedCategory(category)}\n className={`px-4 py-2 rounded-full text-sm font-medium whitespace-nowrap transition-colors ${\n selectedCategory === category\n ? 'bg-blue-600 text-white'\n : 'bg-gray-100 text-gray-700 hover:bg-gray-200'\n }`}\n >\n {category}\n \n ))}\n

\n\n {/* Menu Items */}\n

\n {filteredItems.map(item => (\n

{item.name}

\n ₹{item.price}\n

{item.description}

\n \n {item.category}\n \n addToCart(item)}\n className=\"bg-blue-600 text-white px-4 py-2 rounded-lg text-sm font-medium hover:bg-blue-700 transition-colors\"\n >\n Add to Cart\n \n

\n ))}\n

\n\n {/* Cart Modal */}\n {showCart && (\n

Your Cart

\n setShowCart(false)}\n className=\"p-2 text-gray-600 hover:text-gray-800\"\n >\n \n \n

\n \n

\n {cart.length === 0 ? (\n

Your cart is empty

\n ) : (\n

\n {cart.map(item => (\n

{item.menu_item.name}

₹{item.menu_item.price} each

\n updateCartQuantity(item.menu_item.id, item.quantity - 1)}\n className=\"w-8 h-8 rounded-full bg-gray-200 flex items-center justify-center text-gray-600 hover:bg-gray-300\"\n >\n -\n \n {item.quantity}\n updateCartQuantity(item.menu_item.id, item.quantity + 1)}\n className=\"w-8 h-8 rounded-full bg-gray-200 flex items-center justify-center text-gray-600 hover:bg-gray-300\"\n >\n +\n \n

\n ))}\n

\n )}\n

\n \n {cart.length > 0 && (\n

\n Total:\n ₹{getTotalPrice()}\n

\n {\n setShowCart(false);\n setShowCheckout(true);\n }}\n className=\"w-full bg-green-600 text-white py-3 px-4 rounded-lg font-semibold hover:bg-green-700 transition-colors\"\n >\n Proceed to Checkout\n \n

\n )}\n

\n )}\n\n {/* Checkout Modal */}\n {showCheckout && (\n

Checkout

\n setShowCheckout(false)}\n className=\"p-2 text-gray-600 hover:text-gray-800\"\n >\n \n \n

\n \n

\n \n Your Name *\n \n setCustomerName(e.target.value)}\n required\n className=\"w-full px-3 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500\"\n placeholder=\"Enter your name\"\n />\n

\n \n

\n \n Phone Number *\n \n setCustomerPhone(e.target.value)}\n required\n className=\"w-full px-3 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500\"\n placeholder=\"Enter your phone number\"\n />\n

\n \n

Order Summary

\n {cart.map(item => (\n

\n {item.menu_item.name} x{item.quantity}\n ₹{item.menu_item.price * item.quantity}\n

\n ))}\n

\n Total:\n ₹{getTotalPrice()}\n

\n \n \n {placingOrder ? 'Placing Order...' : 'Place Order'}\n \n \n

\n )}\n

\n );\n};\n\nexport default CustomerInterface;","deleted","label",[169,170,171,152],"frontend","components","Customer","permalink","https://www.val.town/x/Pratham211/canteen/code/frontend/components/Customer/CustomerInterface.tsx","extension","actionData","errors"]