function FramerMotion(props) { const [mounted, setMounted] = useState(false); const ref = useRef(null); useEffect(()=>{ const checkRef = setInterval(()=>{ if (window.Motion) { clearInterval(checkRef); } if (ref.current) { clearInterval(checkRef); window.React = React; const script = document.createElement("script"); script.src = "https://cdn.jsdelivr.net/npm/framer-motion@11.11.17/dist/framer-motion.min.js"; script.type = "module"; script.onload = ()=>{ setMounted(true); }; ref.current.appendChild(script); } }, 100); return ()=>{ clearInterval(checkRef); if (ref.current) { const script = ref.current.querySelector("script"); if (script) { ref.current.removeChild(script); } } delete window.motion; }; }, []); const mountElm = /*#__PURE__*/ React.createElement("div", { className: "hidden", ref: ref, __source: { fileName: "", lineNumber: 35, columnNumber: 20 }, __self: this }); return mounted ? /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(window.Motion.motion.div, { ...props, __source: { fileName: "", lineNumber: 38, columnNumber: 7 }, __self: this }), mountElm) : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", { ...props, __source: { fileName: "", lineNumber: 43, columnNumber: 7 }, __self: this }), mountElm); } function FramerMotionStory() { return /*#__PURE__*/ React.createElement(FramerMotion, { __source: { fileName: "", lineNumber: 50, columnNumber: 10 }, __self: this }); } function MainComponent() { const [authenticated, setAuthenticated] = useState(false); const [password, setPassword] = useState(""); const [error, setError] = useState(null); const [orders, setOrders] = useState([]); const [stats, setStats] = useState(null); const [sortField, setSortField] = useState("order_date"); const [sortDirection, setSortDirection] = useState("desc"); const [filterStatus, setFilterStatus] = useState("all"); const [filterPaymentStatus, setFilterPaymentStatus] = useState("all"); const handleLogin = async (e)=>{ e.preventDefault(); setError(null); try { const response = await fetch("/api/verify-password", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ password }) }); if (!response.ok) { throw new Error(`Error: ${response.status}`); } const data = await response.json(); if (data.authenticated) { setAuthenticated(true); fetchData(); } else { setError("Invalid password"); } } catch (err) { console.error(err); setError("Failed to authenticate"); } }; const fetchData = async ()=>{ try { const [ordersResponse, statsResponse] = await Promise.all([ fetch("/api/list-orders", { method: "POST", headers: { "Content-Type": "application/json" } }), fetch("/api/get-order-stats", { method: "POST", headers: { "Content-Type": "application/json" } }) ]); if (!ordersResponse.ok || !statsResponse.ok) { throw new Error("Failed to fetch data"); } const ordersData = await ordersResponse.json(); const statsData = await statsResponse.json(); setOrders(ordersData.orders || []); setStats(statsData.stats); } catch (err) { console.error(err); setError("Failed to fetch data"); } }; const handleUpdateStatus = async (orderId, newStatus)=>{ try { const response = await fetch("/api/update-order-status", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ orderId, status: newStatus }) }); if (!response.ok) { throw new Error("Failed to update status"); } fetchData(); } catch (err) { console.error(err); setError("Failed to update order status"); } }; if (!authenticated) { return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#171717] text-white font-poppins p-8", __source: { fileName: "", lineNumber: 90, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-md mx-auto", __source: { fileName: "", lineNumber: 91, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold text-center mb-8", __source: { fileName: "", lineNumber: 92, columnNumber: 11 }, __self: this }, "Admin Login"), /*#__PURE__*/ React.createElement("p", { className: "text-[#A4A4A4] text-center mb-8", __source: { fileName: "", lineNumber: 93, columnNumber: 11 }, __self: this }, "This area is password protected and only accessible to administrators managing t-shirt orders."), /*#__PURE__*/ React.createElement("form", { onSubmit: handleLogin, className: "space-y-4", __source: { fileName: "", lineNumber: 97, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 98, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "password", value: password, onChange: (e)=>setPassword(e.target.value), placeholder: "Enter password", className: "w-full p-3 rounded-lg bg-[#2D2D2D] text-white border border-[#A4A4A4] focus:outline-none focus:border-[#0496FB]", name: "password", __source: { fileName: "", lineNumber: 99, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full bg-[#0496FB] text-white py-3 rounded-lg hover:bg-[#037acc] transition-colors duration-300", __source: { fileName: "", lineNumber: 108, columnNumber: 13 }, __self: this }, "Login"), error && /*#__PURE__*/ React.createElement("p", { className: "text-red-500 text-center", __source: { fileName: "", lineNumber: 114, columnNumber: 23 }, __self: this }, error)), /*#__PURE__*/ React.createElement("div", { className: "mt-8 text-center", __source: { fileName: "", lineNumber: 116, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "text-[#0496FB] hover:text-white transition-colors duration-300", __source: { fileName: "", lineNumber: 117, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-arrow-left mr-2", __source: { fileName: "", lineNumber: 121, columnNumber: 15 }, __self: this }), "Back to Home")))); } const filteredOrders = orders.filter((order)=>{ if (filterStatus !== "all" && order.status !== filterStatus) return false; if (filterPaymentStatus !== "all" && order.payment_status !== filterPaymentStatus) return false; return true; }).sort((a, b)=>{ const aValue = a[sortField]; const bValue = b[sortField]; return sortDirection === "asc" ? aValue > bValue ? 1 : -1 : aValue < bValue ? 1 : -1; }); const orderRows = filteredOrders.map((order)=>/*#__PURE__*/ React.createElement("tr", { key: order.id, className: "border-b border-[#A4A4A4] hover:bg-[#3D3D3D]", __source: { fileName: "", lineNumber: 153, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("td", { className: "p-4", __source: { fileName: "", lineNumber: 154, columnNumber: 7 }, __self: this }, order.id), /*#__PURE__*/ React.createElement("td", { className: "p-4", __source: { fileName: "", lineNumber: 155, columnNumber: 7 }, __self: this }, order.customer?.name || "N/A"), /*#__PURE__*/ React.createElement("td", { className: "p-4", __source: { fileName: "", lineNumber: 156, columnNumber: 7 }, __self: this }, order.customer?.email || "N/A"), /*#__PURE__*/ React.createElement("td", { className: "p-4", __source: { fileName: "", lineNumber: 157, columnNumber: 7 }, __self: this }, order.customer?.phone || "N/A"), /*#__PURE__*/ React.createElement("td", { className: "p-4", __source: { fileName: "", lineNumber: 158, columnNumber: 7 }, __self: this }, order.style || "N/A"), /*#__PURE__*/ React.createElement("td", { className: "p-4", __source: { fileName: "", lineNumber: 159, columnNumber: 7 }, __self: this }, order.size || "N/A"), /*#__PURE__*/ React.createElement("td", { className: "p-4", __source: { fileName: "", lineNumber: 160, columnNumber: 7 }, __self: this }, order.quantity || 0), /*#__PURE__*/ React.createElement("td", { className: "p-4", __source: { fileName: "", lineNumber: 161, columnNumber: 7 }, __self: this }, "$", (order.total || 0).toFixed(2)), /*#__PURE__*/ React.createElement("td", { className: "p-4", __source: { fileName: "", lineNumber: 162, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("select", { value: order.status, onChange: (e)=>handleUpdateStatus(order.id, e.target.value), className: "bg-[#171717] text-white rounded p-1 border border-[#A4A4A4]", __source: { fileName: "", lineNumber: 163, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "pending", __source: { fileName: "", lineNumber: 168, columnNumber: 11 }, __self: this }, "Pending"), /*#__PURE__*/ React.createElement("option", { value: "confirmed", __source: { fileName: "", lineNumber: 169, columnNumber: 11 }, __self: this }, "Confirmed"), /*#__PURE__*/ React.createElement("option", { value: "processing", __source: { fileName: "", lineNumber: 170, columnNumber: 11 }, __self: this }, "Processing"), /*#__PURE__*/ React.createElement("option", { value: "shipped", __source: { fileName: "", lineNumber: 171, columnNumber: 11 }, __self: this }, "Shipped"), /*#__PURE__*/ React.createElement("option", { value: "delivered", __source: { fileName: "", lineNumber: 172, columnNumber: 11 }, __self: this }, "Delivered"), /*#__PURE__*/ React.createElement("option", { value: "cancelled", __source: { fileName: "", lineNumber: 173, columnNumber: 11 }, __self: this }, "Cancelled"))), /*#__PURE__*/ React.createElement("td", { className: "p-4", __source: { fileName: "", lineNumber: 176, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: `px-3 py-1 rounded-full ${order.payment_status === "paid" ? "bg-green-500" : order.payment_status === "pending" ? "bg-yellow-500" : order.payment_status === "failed" ? "bg-red-500" : "bg-gray-500"} text-white`, __source: { fileName: "", lineNumber: 177, columnNumber: 9 }, __self: this }, order.payment_status || "N/A")), /*#__PURE__*/ React.createElement("td", { className: "p-4", __source: { fileName: "", lineNumber: 191, columnNumber: 7 }, __self: this }, new Date(order.order_date).toLocaleDateString("en-US", { year: "numeric", month: "short", day: "numeric", hour: "2-digit", minute: "2-digit" })))); return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#171717] text-white font-poppins p-8", __source: { fileName: "", lineNumber: 204, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-7xl mx-auto", __source: { fileName: "", lineNumber: 205, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-8", __source: { fileName: "", lineNumber: 206, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 207, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold", __source: { fileName: "", lineNumber: 208, columnNumber: 13 }, __self: this }, "T-Shirt Orders Dashboard"), /*#__PURE__*/ React.createElement("p", { className: "text-[#A4A4A4] mt-2", __source: { fileName: "", lineNumber: 209, columnNumber: 13 }, __self: this }, "Manage and track t-shirt orders")), /*#__PURE__*/ React.createElement("div", { className: "flex gap-4", __source: { fileName: "", lineNumber: 213, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/t-shirt-order", className: "text-[#0496FB] hover:text-white transition-colors duration-300", __source: { fileName: "", lineNumber: 214, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-tshirt mr-2", __source: { fileName: "", lineNumber: 218, columnNumber: 15 }, __self: this }), "Order Form"), /*#__PURE__*/ React.createElement("button", { onClick: fetchData, className: "text-[#0496FB] hover:text-white transition-colors duration-300", __source: { fileName: "", lineNumber: 221, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-sync-alt mr-2", __source: { fileName: "", lineNumber: 225, columnNumber: 15 }, __self: this }), "Refresh"))), stats && /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4 mb-8", __source: { fileName: "", lineNumber: 232, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-[#2D2D2D] p-6 rounded-lg", __source: { fileName: "", lineNumber: 233, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-[#A4A4A4] text-sm uppercase", __source: { fileName: "", lineNumber: 234, columnNumber: 15 }, __self: this }, "Total Orders"), /*#__PURE__*/ React.createElement("p", { className: "text-2xl font-bold", __source: { fileName: "", lineNumber: 235, columnNumber: 15 }, __self: this }, stats.total_orders || 0)), /*#__PURE__*/ React.createElement("div", { className: "bg-[#2D2D2D] p-6 rounded-lg", __source: { fileName: "", lineNumber: 237, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-[#A4A4A4] text-sm uppercase", __source: { fileName: "", lineNumber: 238, columnNumber: 15 }, __self: this }, "Total Revenue"), /*#__PURE__*/ React.createElement("p", { className: "text-2xl font-bold", __source: { fileName: "", lineNumber: 241, columnNumber: 15 }, __self: this }, "$", Number(stats.total_revenue || 0).toFixed(2))), /*#__PURE__*/ React.createElement("div", { className: "bg-[#2D2D2D] p-6 rounded-lg", __source: { fileName: "", lineNumber: 245, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-[#A4A4A4] text-sm uppercase", __source: { fileName: "", lineNumber: 246, columnNumber: 15 }, __self: this }, "Pending Orders"), /*#__PURE__*/ React.createElement("p", { className: "text-2xl font-bold", __source: { fileName: "", lineNumber: 249, columnNumber: 15 }, __self: this }, stats.pending_orders || 0)), /*#__PURE__*/ React.createElement("div", { className: "bg-[#2D2D2D] p-6 rounded-lg", __source: { fileName: "", lineNumber: 251, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-[#A4A4A4] text-sm uppercase", __source: { fileName: "", lineNumber: 252, columnNumber: 15 }, __self: this }, "Completed Orders"), /*#__PURE__*/ React.createElement("p", { className: "text-2xl font-bold", __source: { fileName: "", lineNumber: 255, columnNumber: 15 }, __self: this }, stats.delivered_orders || 0))), /*#__PURE__*/ React.createElement("div", { className: "bg-[#2D2D2D] rounded-lg p-6", __source: { fileName: "", lineNumber: 262, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap gap-4 mb-6", __source: { fileName: "", lineNumber: 263, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("select", { value: filterStatus, onChange: (e)=>setFilterStatus(e.target.value), className: "bg-[#171717] text-white rounded p-2 border border-[#A4A4A4]", __source: { fileName: "", lineNumber: 264, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "all", __source: { fileName: "", lineNumber: 269, columnNumber: 15 }, __self: this }, "All Statuses"), /*#__PURE__*/ React.createElement("option", { value: "pending", __source: { fileName: "", lineNumber: 270, columnNumber: 15 }, __self: this }, "Pending"), /*#__PURE__*/ React.createElement("option", { value: "confirmed", __source: { fileName: "", lineNumber: 271, columnNumber: 15 }, __self: this }, "Confirmed"), /*#__PURE__*/ React.createElement("option", { value: "processing", __source: { fileName: "", lineNumber: 272, columnNumber: 15 }, __self: this }, "Processing"), /*#__PURE__*/ React.createElement("option", { value: "shipped", __source: { fileName: "", lineNumber: 273, columnNumber: 15 }, __self: this }, "Shipped"), /*#__PURE__*/ React.createElement("option", { value: "delivered", __source: { fileName: "", lineNumber: 274, columnNumber: 15 }, __self: this }, "Delivered"), /*#__PURE__*/ React.createElement("option", { value: "cancelled", __source: { fileName: "", lineNumber: 275, columnNumber: 15 }, __self: this }, "Cancelled")), /*#__PURE__*/ React.createElement("select", { value: filterPaymentStatus, onChange: (e)=>setFilterPaymentStatus(e.target.value), className: "bg-[#171717] text-white rounded p-2 border border-[#A4A4A4]", __source: { fileName: "", lineNumber: 277, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "all", __source: { fileName: "", lineNumber: 282, columnNumber: 15 }, __self: this }, "All Payment Statuses"), /*#__PURE__*/ React.createElement("option", { value: "pending", __source: { fileName: "", lineNumber: 283, columnNumber: 15 }, __self: this }, "Pending"), /*#__PURE__*/ React.createElement("option", { value: "paid", __source: { fileName: "", lineNumber: 284, columnNumber: 15 }, __self: this }, "Paid"), /*#__PURE__*/ React.createElement("option", { value: "failed", __source: { fileName: "", lineNumber: 285, columnNumber: 15 }, __self: this }, "Failed"), /*#__PURE__*/ React.createElement("option", { value: "refunded", __source: { fileName: "", lineNumber: 286, columnNumber: 15 }, __self: this }, "Refunded"))), /*#__PURE__*/ React.createElement("div", { className: "overflow-x-auto", __source: { fileName: "", lineNumber: 290, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("table", { className: "w-full", __source: { fileName: "", lineNumber: 291, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("thead", { __source: { fileName: "", lineNumber: 292, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("tr", { className: "border-b border-[#A4A4A4]", __source: { fileName: "", lineNumber: 293, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("th", { className: "text-left p-4", __source: { fileName: "", lineNumber: 294, columnNumber: 19 }, __self: this }, "Order ID"), /*#__PURE__*/ React.createElement("th", { className: "text-left p-4", __source: { fileName: "", lineNumber: 295, columnNumber: 19 }, __self: this }, "Name"), /*#__PURE__*/ React.createElement("th", { className: "text-left p-4", __source: { fileName: "", lineNumber: 296, columnNumber: 19 }, __self: this }, "Email"), /*#__PURE__*/ React.createElement("th", { className: "text-left p-4", __source: { fileName: "", lineNumber: 297, columnNumber: 19 }, __self: this }, "Phone"), /*#__PURE__*/ React.createElement("th", { className: "text-left p-4", __source: { fileName: "", lineNumber: 298, columnNumber: 19 }, __self: this }, "Style"), /*#__PURE__*/ React.createElement("th", { className: "text-left p-4", __source: { fileName: "", lineNumber: 299, columnNumber: 19 }, __self: this }, "Size"), /*#__PURE__*/ React.createElement("th", { className: "text-left p-4", __source: { fileName: "", lineNumber: 300, columnNumber: 19 }, __self: this }, "Quantity"), /*#__PURE__*/ React.createElement("th", { className: "text-left p-4", __source: { fileName: "", lineNumber: 301, columnNumber: 19 }, __self: this }, "Total"), /*#__PURE__*/ React.createElement("th", { className: "text-left p-4", __source: { fileName: "", lineNumber: 302, columnNumber: 19 }, __self: this }, "Status"), /*#__PURE__*/ React.createElement("th", { className: "text-left p-4", __source: { fileName: "", lineNumber: 303, columnNumber: 19 }, __self: this }, "Payment"), /*#__PURE__*/ React.createElement("th", { className: "text-left p-4", __source: { fileName: "", lineNumber: 304, columnNumber: 19 }, __self: this }, "Order Date"))), /*#__PURE__*/ React.createElement("tbody", { __source: { fileName: "", lineNumber: 307, columnNumber: 15 }, __self: this }, orderRows)))))); }