feat(api): integrated /cart and /order api's

assets/js/checkout.js

@@ -33,11 +33,53 @@ document.addEventListener("DOMContentLoaded", () => {
 	totalEl.textContent = `₹${total.toFixed(2)}`;
 
 	// Unlock QR on valid form submit
-	form.addEventListener("submit", (e) => {
+	form.addEventListener("submit", async (e) => {
 		e.preventDefault();
 
 		if (!form.checkValidity()) return;
 
-		qrWrapper.classList.remove("blurred");
+		const orderBtn = document.getElementById("btn-order");
+
+		orderBtn.classList.add("loading");
+		orderBtn.disabled = true;
+
+		const formData = new FormData(form);
+
+		const orderPayload = {
+			first_name: formData.get("first_name"),
+			last_name: formData.get("last_name"),
+			email: formData.get("email"),
+			phone: formData.get("phone"),
+			address: formData.get("address"),
+			city: formData.get("city"),
+			state: formData.get("state"),
+			post_code: formData.get("post_code"),
+			order: Cart.getCart(),
+		};
+
+		try {
+			const res = await fetch(".netlify/functions/order", {
+				method: "POST",
+				headers: {
+					"Content-Type": "application/json",
+				},
+				body: JSON.stringify(orderPayload),
+			});
+
+			console.log(res);
+
+			if (!res.ok) throw new Error("Order failed");
+
+			// unlock payment QR
+			qrWrapper.classList.remove("blurred");
+
+			console.log("Order created");
+		} catch (err) {
+			console.error(err);
+			alert("Unable to place order. Please try again.");
+		} finally {
+			orderBtn.classList.remove("loading");
+			orderBtn.disabled = false;
+		}
 	});
 });