\n \n \n \n\n",[],[220,222],"d775d2d0-411c-11f1-9115-42b51c65c3df","StudentView.tsx","d775d384-411c-11f1-9115-42b51c65c3df","a691df88-411c-11f1-86e8-42b51c65c3df",13,["D",1777172755445],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\n\nconst STATUS_COLORS: Record = {\n pending: \"bg-yellow-100 text-yellow-800\",\n accepted: \"bg-blue-100 text-blue-800\",\n rejected: \"bg-red-100 text-red-800\",\n printing: \"bg-purple-100 text-purple-800\",\n ready: \"bg-indigo-100 text-indigo-800\",\n delivering: \"bg-orange-100 text-orange-800\",\n delivered: \"bg-green-100 text-green-800\",\n};\n\nconst STATUS_ICONS: Record = {\n pending: \"fa-clock\",\n accepted: \"fa-thumbs-up\",\n rejected: \"fa-times-circle\",\n printing: \"fa-print\",\n ready: \"fa-box\",\n delivering: \"fa-truck\",\n delivered: \"fa-check-circle\",\n};\n\nconst PRICING = { bw: 0.50, color: 2.00, delivery: 3.00, commission: 0.15 };\n\nexport function StudentView({ userId }: { userId: number }) {\n const [tab, setTab] = useState<\"order\" | \"history\">(\"order\");\n const [orders, setOrders] = useState([]);\n const [loading, setLoading] = useState(false);\n\n // Order form state\n const [inputMode, setInputMode] = useState<\"text\" | \"file\">(\"text\");\n const [textContent, setTextContent] = useState(\"\");\n const [file, setFile] = useState(null);\n const [printType, setPrintType] = useState<\"bw\" | \"color\">(\"bw\");\n const [copies, setCopies] = useState(1);\n const [pages, setPages] = useState(1);\n const [location, setLocation] = useState(\"\");\n const [notes, setNotes] = useState(\"\");\n const [submitting, setSubmitting] = useState(false);\n const [success, setSuccess] = useState(false);\n\n const fetchOrders = async () => {\n setLoading(true);\n try {\n const res = await fetch(\"/api/orders/my\");\n const data = await res.json();\n setOrders(data.orders || []);\n } catch { /* ignore */ }\n setLoading(false);\n };\n\n useEffect(() => { fetchOrders(); }, []);\n\n const pricePerPage = printType === \"bw\" ? PRICING.bw : PRICING.color;\n const printCost = pricePerPage * pages * copies;\n const platformFee = Math.round(printCost * PRICING.commission * 100) / 100;\n const totalCost = printCost + PRICING.delivery + platformFee;\n\n const handleSubmit = async (e: Event) => {\n e.preventDefault();\n setSubmitting(true);\n setSuccess(false);\n\n try {\n let fileName = null;\n let blobKey = null;\n\n if (inputMode === \"file\" && file) {\n const formData = new FormData();\n formData.append(\"file\", file);\n const uploadRes = await fetch(\"/api/upload\", { method: \"POST\", body: formData });\n const uploadData = await uploadRes.json();\n if (!uploadRes.ok) throw new Error(uploadData.error);\n fileName = uploadData.fileName;\n blobKey = uploadData.blobKey;\n }\n\n const res = await fetch(\"/api/orders\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({\n text_content: inputMode === \"text\" ? textContent : undefined,\n file_name: fileName,\n file_blob_key: blobKey,\n print_type: printType,\n copies,\n pages,\n delivery_location: location,\n notes: notes || undefined,\n }),\n });\n\n const data = await res.json();\n if (!res.ok) throw new Error(data.error);\n\n setSuccess(true);\n setTextContent(\"\");\n setFile(null);\n setCopies(1);\n setPages(1);\n setLocation(\"\");\n setNotes(\"\");\n fetchOrders();\n } catch (err: any) {\n alert(err.message);\n }\n setSubmitting(false);\n };\n\n return (\n

\n {/* Tab nav */}\n

\n setTab(\"order\")}\n class={`flex-1 py-3 rounded-xl font-semibold transition-all ${\n tab === \"order\"\n ? \"bg-blue-600 text-white shadow-lg\"\n : \"bg-white text-gray-600 hover:bg-gray-100\"\n }`}\n >\n New Order\n \n { setTab(\"history\"); fetchOrders(); }}\n class={`flex-1 py-3 rounded-xl font-semibold transition-all ${\n tab === \"history\"\n ? \"bg-blue-600 text-white shadow-lg\"\n : \"bg-white text-gray-600 hover:bg-gray-100\"\n }`}\n >\n My Orders\n {orders.length > 0 && (\n {orders.length}\n )}\n \n

\n\n {/* NEW ORDER TAB */}\n {tab === \"order\" && (\n

\n Submit a Print Request\n

\n\n {success && (\n

\n Order submitted successfully! Check \"My Orders\" for updates.\n

\n )}\n\n

\n {/* Input mode toggle */}\n

\n What do you want to print?\n

\n setInputMode(\"text\")}\n class={`flex-1 py-2.5 rounded-lg border-2 font-medium transition-all ${\n inputMode === \"text\" ? \"border-blue-500 bg-blue-50 text-blue-700\" : \"border-gray-200\"\n }`}\n >\n Paste Text\n \n setInputMode(\"file\")}\n class={`flex-1 py-2.5 rounded-lg border-2 font-medium transition-all ${\n inputMode === \"file\" ? \"border-blue-500 bg-blue-50 text-blue-700\" : \"border-gray-200\"\n }`}\n >\n Upload File\n \n

\n\n {inputMode === \"text\" ? (\n setTextContent(e.target.value)}\n placeholder=\"Paste your assignment text here...\"\n class=\"w-full h-40 px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 outline-none resize-none\"\n required\n />\n ) : (\n

\n setFile(e.target.files?.[0] || null)}\n class=\"hidden\"\n id=\"file-input\"\n />\n \n \n

{file ? file.name : \"Click to upload (PDF, DOC, TXT, Images)\"}

\n \n

\n )}\n\n {/* Print options */}\n

\n Print Type\n

\n setPrintType(\"bw\")}\n class={`flex-1 py-2.5 rounded-lg border-2 text-sm font-medium transition-all ${\n printType === \"bw\" ? \"border-gray-700 bg-gray-100 text-gray-800\" : \"border-gray-200\"\n }`}\n >\n ⚫ B&W\n \n setPrintType(\"color\")}\n class={`flex-1 py-2.5 rounded-lg border-2 text-sm font-medium transition-all ${\n printType === \"color\" ? \"border-blue-500 bg-blue-50 text-blue-700\" : \"border-gray-200\"\n }`}\n >\n 🌈 Color\n \n

\n\n

\n Copies\n

\n \n {copies}\n \n

\n\n

\n Number of Pages\n setPages(Math.max(1, parseInt(e.target.value) || 1))}\n class=\"w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 outline-none\"\n />\n

\n\n

\n \n Delivery Location\n \n setLocation(e.target.value)}\n placeholder=\"e.g. Akuafo Hall Room 204, UGBS Lecture Hall 3\"\n class=\"w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 outline-none\"\n required\n />\n

\n\n

\n Notes (optional)\n setNotes(e.target.value)}\n placeholder=\"e.g. Staple please, Double-sided...\"\n class=\"w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 outline-none\"\n />\n

\n\n {/* Price breakdown */}\n

Cost Breakdown

Printing ({pages}p × {copies}c × GHS {pricePerPage.toFixed(2)})GHS {printCost.toFixed(2)}

Delivery FeeGHS {PRICING.delivery.toFixed(2)}

Platform Fee (15%)GHS {platformFee.toFixed(2)}

TotalGHS {totalCost.toFixed(2)}

\n\n \n {submitting ? <>Submitting... : <>Submit Print Request}\n \n \n

\n )}\n\n {/* HISTORY TAB */}\n {tab === \"history\" && (\n

\n {loading ? (\n

\n ) : orders.length === 0 ? (\n

\n \n

No orders yet. Submit your first print request!

\n ) : (\n orders.map((order: any) => (\n

\n Order #{order.id}\n \n \n {order.status.charAt(0).toUpperCase() + order.status.slice(1)}\n \n

{order.print_type === \"bw\" ? \"B&W\" : \"Color\"} · {order.copies} copies · {order.pages} pages

{order.delivery_location}

\n {order.file_name &&

{order.file_name}

}\n

\n {new Date(order.created_at).toLocaleDateString()}\n GHS {order.total_cost.toFixed(2)}\n

\n ))\n )}\n

\n )}\n

\n );\n}\n",[],[220,238,230],"components","e64bea1a-411c-11f1-9115-42b51c65c3df","ShopDashboard.tsx","e64beaec-411c-11f1-9115-42b51c65c3df",14,["D",1777172780373],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\n\nconst STATUS_COLORS: Record = {\n pending: \"bg-yellow-100 text-yellow-800\",\n accepted: \"bg-blue-100 text-blue-800\",\n printing: \"bg-purple-100 text-purple-800\",\n ready: \"bg-green-100 text-green-800\",\n};\n\nexport function ShopDashboard({ userId }: { userId: number }) {\n const [tab, setTab] = useState<\"pending\" | \"myorders\">(\"pending\");\n const [pendingOrders, setPendingOrders] = useState([]);\n const [myOrders, setMyOrders] = useState([]);\n const [loading, setLoading] = useState(false);\n\n const fetchPending = async () => {\n setLoading(true);\n try {\n const res = await fetch(\"/api/orders/pending\");\n const data = await res.json();\n setPendingOrders(data.orders || []);\n } catch { /* ignore */ }\n setLoading(false);\n };\n\n const fetchMyOrders = async () => {\n setLoading(true);\n try {\n const res = await fetch(\"/api/orders/shop\");\n const data = await res.json();\n setMyOrders(data.orders || []);\n } catch { /* ignore */ }\n setLoading(false);\n };\n\n useEffect(() => { fetchPending(); fetchMyOrders(); }, []);\n\n const updateStatus = async (orderId: number, status: string) => {\n try {\n await fetch(`/api/orders/${orderId}/status`, {\n method: \"PATCH\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ status }),\n });\n fetchPending();\n fetchMyOrders();\n } catch (err: any) {\n alert(err.message);\n }\n };\n\n const OrderCard = ({ order, actions }: { order: any; actions: any }) => (\n

\n Order #{order.id}\n \n {order.status.toUpperCase()}\n \n

\n\n

{order.print_type === \"bw\" ? \"B&W\" : \"Color\"}

{order.copies} copies, {order.pages} pages

{order.delivery_location}

\n {order.file_name &&

{order.file_name}

}\n {order.text_content && (\n

\n {order.text_content.slice(0, 200)}{order.text_content.length > 200 ? \"...\" : \"\"}\n

\n )}\n {order.notes &&

{order.notes}

}\n

\n\n

\n GHS {order.total_cost?.toFixed(2)}\n

{actions}

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

\n { setTab(\"pending\"); fetchPending(); }}\n class={`flex-1 py-3 rounded-xl font-semibold transition-all ${\n tab === \"pending\" ? \"bg-blue-600 text-white shadow-lg\" : \"bg-white text-gray-600 hover:bg-gray-100\"\n }`}\n >\n Incoming\n {pendingOrders.length > 0 && (\n {pendingOrders.length}\n )}\n \n { setTab(\"myorders\"); fetchMyOrders(); }}\n class={`flex-1 py-3 rounded-xl font-semibold transition-all ${\n tab === \"myorders\" ? \"bg-blue-600 text-white shadow-lg\" : \"bg-white text-gray-600 hover:bg-gray-100\"\n }`}\n >\n My Orders\n \n

\n\n {loading ? (\n

\n ) : tab === \"pending\" ? (\n pendingOrders.length === 0 ? (\n

\n \n

No pending orders. You're all caught up!

\n ) : (\n pendingOrders.map((order) => (\n \n updateStatus(order.id, \"rejected\")}\n class=\"px-4 py-2 bg-red-100 text-red-700 rounded-lg text-sm font-medium hover:bg-red-200 transition\"\n >\n Reject\n \n updateStatus(order.id, \"accepted\")}\n class=\"px-4 py-2 bg-green-600 text-white rounded-lg text-sm font-medium hover:bg-green-700 transition\"\n >\n Accept\n \n \n }\n />\n ))\n )\n ) : (\n myOrders.length === 0 ? (\n

\n \n

No accepted orders yet.

\n ) : (\n myOrders.map((order) => (\n \n {order.status === \"accepted\" && (\n updateStatus(order.id, \"printing\")}\n class=\"px-4 py-2 bg-purple-600 text-white rounded-lg text-sm font-medium hover:bg-purple-700 transition\"\n >\n Start Printing\n \n )}\n {order.status === \"printing\" && (\n updateStatus(order.id, \"ready\")}\n class=\"px-4 py-2 bg-green-600 text-white rounded-lg text-sm font-medium hover:bg-green-700 transition\"\n >\n Mark Ready\n \n )}\n {(order.status === \"ready\" || order.status === \"delivering\" || order.status === \"delivered\") && (\n \n {order.status === \"ready\" ? \"Waiting for rider...\" : order.status === \"delivering\" ? \"Out for delivery\" : \"Delivered ✓\"}\n \n )}\n \n }\n />\n ))\n )\n )}\n

\n );\n}\n",[],[220,238,240],"bcaac23a-411c-11f1-843f-42b51c65c3df","LoginScreen.tsx","bcaac2f8-411c-11f1-843f-42b51c65c3df",12,["D",1777172710529],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\n\nconst ROLES = [\n { value: \"student\", label: \"Student\", icon: \"fa-graduation-cap\", desc: \"Submit print orders\" },\n { value: \"shop\", label: \"Print Shop\", icon: \"fa-store\", desc: \"Accept & print orders\" },\n { value: \"rider\", label: \"Delivery Rider\", icon: \"fa-motorcycle\", desc: \"Deliver documents\" },\n { value: \"admin\", label: \"Admin\", icon: \"fa-shield-halved\", desc: \"Manage platform\" },\n];\n\nexport function LoginScreen({ onLogin }: { onLogin: (user: any) => void }) {\n const [isRegister, setIsRegister] = useState(false);\n const [name, setName] = useState(\"\");\n const [phone, setPhone] = useState(\"\");\n const [email, setEmail] = useState(\"\");\n const [password, setPassword] = useState(\"\");\n const [role, setRole] = useState(\"student\");\n const [error, setError] = useState(\"\");\n const [loading, setLoading] = useState(false);\n\n const handleSubmit = async (e: Event) => {\n e.preventDefault();\n setError(\"\");\n setLoading(true);\n\n try {\n const url = isRegister ? \"/api/register\" : \"/api/login\";\n const body = isRegister\n ? { name, phone, email: email || undefined, password, role }\n : { phone, password };\n\n const res = await fetch(url, {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify(body),\n });\n\n const data = await res.json();\n if (!res.ok) throw new Error(data.error || \"Something went wrong\");\n onLogin(data.user);\n } catch (err: any) {\n setError(err.message);\n } finally {\n setLoading(false);\n }\n };\n\n return (\n

\n {/* Logo */}\n

🖨️

PrintPal

Campus Printing & Delivery

\n\n {/* Form Card */}\n

\n {isRegister ? \"Create Account\" : \"Welcome Back\"}\n

\n\n {error && (\n

\n {error}\n

\n )}\n\n

\n {isRegister && (\n <>\n

\n Full Name\n setName(e.target.value)}\n placeholder=\"Kwame Mensah\"\n class=\"w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent outline-none transition\"\n required\n />\n

\n\n

\n Email (optional)\n setEmail(e.target.value)}\n placeholder=\"kwame@university.edu\"\n class=\"w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent outline-none transition\"\n />\n

\n\n {/* Role selector */}\n

\n I am a...\n

\n {ROLES.map((r) => (\n setRole(r.value)}\n class={`p-3 rounded-lg border-2 text-left transition-all ${\n role === r.value\n ? \"border-blue-500 bg-blue-50 text-blue-700\"\n : \"border-gray-200 hover:border-gray-300\"\n }`}\n >\n \n

{r.label}

\n \n ))}\n

\n \n )}\n\n

\n Phone Number\n setPhone(e.target.value)}\n placeholder=\"0241234567\"\n class=\"w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent outline-none transition\"\n required\n />\n

\n\n

\n Password\n setPassword(e.target.value)}\n placeholder=\"••••••••\"\n class=\"w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent outline-none transition\"\n required\n />\n

\n\n \n {loading ? (\n <>Please wait...\n ) : isRegister ? (\n <>Create Account\n ) : (\n <>Log In\n )}\n \n \n\n

\n { setIsRegister(!isRegister); setError(\"\"); }}\n class=\"text-blue-600 hover:text-blue-700 text-sm font-medium\"\n >\n {isRegister ? \"Already have an account? Log In\" : \"New here? Create Account\"}\n \n

\n );\n}\n",[],[220,238,248],"efd35e6a-411c-11f1-9563-42b51c65c3df","DeliveryView.tsx","efd35f14-411c-11f1-9563-42b51c65c3df",15,["D",1777172796312],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\n\nexport function DeliveryView({ userId }: { userId: number }) {\n const [tab, setTab] = useState<\"available\" | \"active\">(\"available\");\n const [readyOrders, setReadyOrders] = useState([]);\n const [activeOrders, setActiveOrders] = useState([]);\n const [loading, setLoading] = useState(false);\n\n const fetchReady = async () => {\n setLoading(true);\n try {\n const res = await fetch(\"/api/orders/ready\");\n const data = await res.json();\n setReadyOrders(data.orders || []);\n } catch { /* ignore */ }\n setLoading(false);\n };\n\n const fetchActive = async () => {\n setLoading(true);\n try {\n const res = await fetch(\"/api/orders/delivering\");\n const data = await res.json();\n setActiveOrders(data.orders || []);\n } catch { /* ignore */ }\n setLoading(false);\n };\n\n useEffect(() => { fetchReady(); fetchActive(); }, []);\n\n const updateStatus = async (orderId: number, status: string) => {\n try {\n await fetch(`/api/orders/${orderId}/status`, {\n method: \"PATCH\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ status }),\n });\n fetchReady();\n fetchActive();\n } catch (err: any) {\n alert(err.message);\n }\n };\n\n return (\n

\n { setTab(\"available\"); fetchReady(); }}\n class={`flex-1 py-3 rounded-xl font-semibold transition-all ${\n tab === \"available\" ? \"bg-blue-600 text-white shadow-lg\" : \"bg-white text-gray-600 hover:bg-gray-100\"\n }`}\n >\n Available Pickups\n {readyOrders.length > 0 && (\n {readyOrders.length}\n )}\n \n { setTab(\"active\"); fetchActive(); }}\n class={`flex-1 py-3 rounded-xl font-semibold transition-all ${\n tab === \"active\" ? \"bg-blue-600 text-white shadow-lg\" : \"bg-white text-gray-600 hover:bg-gray-100\"\n }`}\n >\n My Deliveries\n \n

\n\n {loading ? (\n

\n ) : tab === \"available\" ? (\n readyOrders.length === 0 ? (\n

\n \n

No orders ready for pickup right now.

\n ) : (\n readyOrders.map((order) => (\n

\n Order #{order.id}\n GHS {order.delivery_fee?.toFixed(2)} delivery\n

Deliver to: {order.delivery_location}

{order.print_type === \"bw\" ? \"B&W\" : \"Color\"} · {order.copies} copies · {order.pages} pages

\n {order.notes &&

{order.notes}

}\n

\n updateStatus(order.id, \"delivering\")}\n class=\"w-full py-2.5 bg-orange-500 hover:bg-orange-600 text-white rounded-lg font-semibold transition\"\n >\n Pick Up & Deliver\n \n

\n ))\n )\n ) : (\n activeOrders.length === 0 ? (\n

\n \n

No active deliveries.

\n ) : (\n activeOrders.map((order) => (\n

\n Order #{order.id}\n \n In Transit\n \n

\n \n Deliver to: {order.delivery_location}\n

\n updateStatus(order.id, \"delivered\")}\n class=\"w-full py-2.5 bg-green-600 hover:bg-green-700 text-white rounded-lg font-semibold transition\"\n >\n Mark as Delivered\n \n

\n ))\n )\n )}\n

\n );\n}\n",[],[220,238,256],"afc83692-411c-11f1-a498-42b51c65c3df","App.tsx","afc83840-411c-11f1-a498-42b51c65c3df",11,["D",1777172688579],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useEffect, useCallback } from \"https://esm.sh/react@18.2.0\";\nimport { LoginScreen } from \"./LoginScreen.tsx\";\nimport { StudentView } from \"./StudentView.tsx\";\nimport { ShopDashboard } from \"./ShopDashboard.tsx\";\nimport { DeliveryView } from \"./DeliveryView.tsx\";\nimport { AdminPanel } from \"./AdminPanel.tsx\";\n\ninterface UserSession {\n userId: number;\n role: string;\n name: string;\n}\n\nexport function App() {\n const [user, setUser] = useState(null);\n const [loading, setLoading] = useState(true);\n\n const checkSession = useCallback(async () => {\n try {\n const res = await fetch(\"/api/me\");\n const data = await res.json();\n setUser(data.user);\n } catch {\n setUser(null);\n } finally {\n setLoading(false);\n }\n }, []);\n\n useEffect(() => { checkSession(); }, [checkSession]);\n\n const handleLogout = async () => {\n await fetch(\"/api/logout\", { method: \"POST\" });\n setUser(null);\n };\n\n if (loading) {\n return (\n

🖨️

Loading PrintPal...

\n );\n }\n\n if (!user) {\n return ;\n }\n\n return (\n

\n {/* Header */}\n

\n 🖨️\n

PrintPal

\n \n \n {user.name}\n ({user.role})\n \n \n Logout\n \n

\n\n {/* Main content */}\n

\n {user.role === \"student\" && }\n {user.role === \"shop\" && }\n {user.role === \"rider\" && }\n {user.role === \"admin\" && }\n

\n\n {/* Footer */}\n \n

\n );\n}\n",[],[220,238,264],"06787a10-411d-11f1-843f-42b51c65c3df","AdminPanel.tsx","06787ae2-411d-11f1-843f-42b51c65c3df",16,["D",1777172834351],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\n\nconst STATUS_COLORS: Record = {\n pending: \"bg-yellow-100 text-yellow-800\",\n accepted: \"bg-blue-100 text-blue-800\",\n rejected: \"bg-red-100 text-red-800\",\n printing: \"bg-purple-100 text-purple-800\",\n ready: \"bg-indigo-100 text-indigo-800\",\n delivering: \"bg-orange-100 text-orange-800\",\n delivered: \"bg-green-100 text-green-800\",\n};\n\nconst ROLE_COLORS: Record = {\n student: \"bg-blue-100 text-blue-800\",\n shop: \"bg-green-100 text-green-800\",\n rider: \"bg-orange-100 text-orange-800\",\n admin: \"bg-purple-100 text-purple-800\",\n};\n\nexport function AdminPanel() {\n const [tab, setTab] = useState<\"overview\" | \"orders\" | \"users\" | \"shops\">(\"overview\");\n const [analytics, setAnalytics] = useState(null);\n const [orders, setOrders] = useState([]);\n const [users, setUsers] = useState([]);\n const [shops, setShops] = useState([]);\n const [loading, setLoading] = useState(false);\n\n const fetchAnalytics = async () => {\n try {\n const res = await fetch(\"/api/admin/analytics\");\n setAnalytics(await res.json());\n } catch { /* ignore */ }\n };\n\n const fetchOrders = async () => {\n setLoading(true);\n try {\n const res = await fetch(\"/api/admin/orders\");\n setOrders((await res.json()).orders || []);\n } catch { /* ignore */ }\n setLoading(false);\n };\n\n const fetchUsers = async () => {\n setLoading(true);\n try {\n const res = await fetch(\"/api/admin/users\");\n setUsers((await res.json()).users || []);\n } catch { /* ignore */ }\n setLoading(false);\n };\n\n const fetchShops = async () => {\n setLoading(true);\n try {\n const res = await fetch(\"/api/admin/shops\");\n setShops((await res.json()).shops || []);\n } catch { /* ignore */ }\n setLoading(false);\n };\n\n useEffect(() => { fetchAnalytics(); }, []);\n\n const tabs = [\n { key: \"overview\", label: \"Overview\", icon: \"fa-chart-pie\", action: fetchAnalytics },\n { key: \"orders\", label: \"Orders\", icon: \"fa-list\", action: fetchOrders },\n { key: \"users\", label: \"Users\", icon: \"fa-users\", action: fetchUsers },\n { key: \"shops\", label: \"Shops\", icon: \"fa-store\", action: fetchShops },\n ];\n\n const StatCard = ({ icon, label, value, color }: any) => (\n

\n \n

{value}

{label}

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

\n {/* Tab nav */}\n

\n {tabs.map((t) => (\n { setTab(t.key as any); t.action(); }}\n class={`flex-1 py-2.5 rounded-lg text-sm font-semibold transition-all ${\n tab === t.key ? \"bg-blue-600 text-white\" : \"text-gray-600 hover:bg-gray-100\"\n }`}\n >\n {t.label}\n \n ))}\n

\n\n {/* OVERVIEW */}\n {tab === \"overview\" && analytics && (\n

\n \n \n \n s + (r.count || 0), 0) || 0}\n color=\"border-purple-600\"\n />\n

\n\n {/* Users by role */}\n

Users by Role

\n {(analytics.usersByRole || []).map((r: any) => (\n

\n \n {r.role}\n \n {r.count}\n

\n ))}\n

\n\n {/* Orders by status */}\n

Orders by Status

\n {(analytics.ordersByStatus || []).map((s: any) => (\n

\n \n {s.status}\n \n

\n {s.count}\n

\n ))}\n

\n )}\n\n {/* ORDERS */}\n {tab === \"orders\" && (\n loading ? (\n

\n ) : (\n

\n \n \n \n \n \n \n \n \n \n \n \n \n {orders.map((o) => (\n \n \n \n \n \n \n \n \n ))}\n \n

ID	Type	Location	Status	Total	Date
#{o.id}	{o.print_type === \"bw\" ? \"B&W\" : \"Color\"} · {o.copies}c · {o.pages}p	{o.delivery_location}	\n {o.status}\n	GHS {o.total_cost?.toFixed(2)}	{new Date(o.created_at).toLocaleDateString()}

\n {orders.length === 0 &&

No orders yet

}\n

\n )\n )}\n\n {/* USERS */}\n {tab === \"users\" && (\n loading ? (\n

\n ) : (\n

\n \n \n \n \n \n \n \n \n \n \n \n {users.map((u) => (\n \n \n \n \n \n \n \n ))}\n \n

ID	Name	Phone	Role	Joined
#{u.id}	{u.name}	{u.phone}	\n {u.role}\n	{new Date(u.created_at).toLocaleDateString()}

\n {users.length === 0 &&

No users yet

}\n

\n )\n )}\n\n {/* SHOPS */}\n {tab === \"shops\" && (\n loading ? (\n

\n ) : (\n

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

\n \n

No printing shops registered yet.

\n ) : (\n shops.map((s) => (\n

\n \n

{s.name}

{s.phone} · {s.email || \"No email\"}

#{s.id}

\n ))\n )}\n

\n )\n )}\n \n );\n}\n",[],[220,238,272],"a691deac-411c-11f1-86e8-42b51c65c3df",9,["D",1777172673457],[177,178,179,180,181,182],[220,238],"786eb338-411c-11f1-b9cb-42b51c65c3df",3,["D",1777172596052],[176,183,184],[220],"8c288142-411c-11f1-b9cb-42b51c65c3df","queries.ts","8c288232-411c-11f1-b9cb-42b51c65c3df","780cab70-411c-11f1-929f-42b51c65c3df",6,["D",1777172629147],"import { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\nimport type { Order, User, UserRole, OrderStatus } from \"../shared/types.ts\";\n\n// ---- Users ----\n\nexport async function createUser(name: string, phone: string, email: string | null, role: UserRole, passwordHash: string): Promise {\n const result = await sqlite.execute({\n sql: \"INSERT INTO users (name, phone, email, role, password_hash) VALUES (?, ?, ?, ?, ?) RETURNING *\",\n args: [name, phone, email, role, passwordHash],\n });\n return result.rows[0] as unknown as User;\n}\n\nexport async function getUserByPhone(phone: string): Promise {\n const result = await sqlite.execute({\n sql: \"SELECT * FROM users WHERE phone = ?\",\n args: [phone],\n });\n return (result.rows[0] as unknown as User) ?? null;\n}\n\nexport async function getUserById(id: number): Promise {\n const result = await sqlite.execute({\n sql: \"SELECT * FROM users WHERE id = ?\",\n args: [id],\n });\n return (result.rows[0] as unknown as User) ?? null;\n}\n\nexport async function getAllUsers(): Promise {\n const result = await sqlite.execute(\"SELECT id, name, phone, email, role, created_at FROM users ORDER BY created_at DESC\");\n return result.rows as unknown as User[];\n}\n\nexport async function getUsersByRole(role: UserRole): Promise {\n const result = await sqlite.execute({\n sql: \"SELECT id, name, phone, email, role, created_at FROM users WHERE role = ? ORDER BY created_at DESC\",\n args: [role],\n });\n return result.rows as unknown as User[];\n}\n\n// ---- Orders ----\n\nexport async function createOrder(order: {\n student_id: number;\n file_name: string | null;\n text_content: string | null;\n file_blob_key: string | null;\n print_type: string;\n copies: number;\n pages: number;\n delivery_location: string;\n print_cost: number;\n delivery_fee: number;\n platform_fee: number;\n total_cost: number;\n notes: string | null;\n}): Promise {\n const result = await sqlite.execute({\n sql: `INSERT INTO orders (student_id, file_name, text_content, file_blob_key, print_type, copies, pages, delivery_location, print_cost, delivery_fee, platform_fee, total_cost, notes)\n VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?) RETURNING *`,\n args: [\n order.student_id, order.file_name, order.text_content, order.file_blob_key,\n order.print_type, order.copies, order.pages, order.delivery_location,\n order.print_cost, order.delivery_fee, order.platform_fee, order.total_cost, order.notes,\n ],\n });\n return result.rows[0] as unknown as Order;\n}\n\nexport async function getOrdersByStudent(studentId: number): Promise {\n const result = await sqlite.execute({\n sql: \"SELECT * FROM orders WHERE student_id = ? ORDER BY created_at DESC\",\n args: [studentId],\n });\n return result.rows as unknown as Order[];\n}\n\nexport async function getOrdersByShop(shopId: number): Promise {\n const result = await sqlite.execute({\n sql: \"SELECT * FROM orders WHERE shop_id = ? ORDER BY created_at DESC\",\n args: [shopId],\n });\n return result.rows as unknown as Order[];\n}\n\nexport async function getPendingOrders(): Promise {\n const result = await sqlite.execute(\"SELECT * FROM orders WHERE status = 'pending' ORDER BY created_at ASC\");\n return result.rows as unknown as Order[];\n}\n\nexport async function getReadyOrders(): Promise {\n const result = await sqlite.execute(\"SELECT * FROM orders WHERE status = 'ready' ORDER BY updated_at ASC\");\n return result.rows as unknown as Order[];\n}\n\nexport async function getDeliveringOrders(riderId: number): Promise {\n const result = await sqlite.execute({\n sql: \"SELECT * FROM orders WHERE rider_id = ? AND status = 'delivering' ORDER BY updated_at ASC\",\n args: [riderId],\n });\n return result.rows as unknown as Order[];\n}\n\nexport async function getAllOrders(): Promise {\n const result = await sqlite.execute(\"SELECT * FROM orders ORDER BY created_at DESC\");\n return result.rows as unknown as Order[];\n}\n\nexport async function updateOrderStatus(orderId: number, status: OrderStatus, extra?: { shop_id?: number; rider_id?: number }): Promise {\n let sql = \"UPDATE orders SET status = ?, updated_at = datetime('now')\";\n const args: any[] = [status];\n\n if (extra?.shop_id !== undefined) {\n sql += \", shop_id = ?\";\n args.push(extra.shop_id);\n }\n if (extra?.rider_id !== undefined) {\n sql += \", rider_id = ?\";\n args.push(extra.rider_id);\n }\n\n sql += \" WHERE id = ? RETURNING *\";\n args.push(orderId);\n\n const result = await sqlite.execute({ sql, args });\n return result.rows[0] as unknown as Order;\n}\n\n// ---- Analytics ----\nexport async function getAnalytics() {\n const [ordersRes, usersRes, revenueRes, statusRes] = await Promise.all([\n sqlite.execute(\"SELECT COUNT(*) as total FROM orders\"),\n sqlite.execute(\"SELECT role, COUNT(*) as count FROM users GROUP BY role\"),\n sqlite.execute(\"SELECT SUM(total_cost) as revenue, SUM(platform_fee) as commission FROM orders WHERE status = 'delivered'\"),\n sqlite.execute(\"SELECT status, COUNT(*) as count FROM orders GROUP BY status\"),\n ]);\n\n return {\n totalOrders: (ordersRes.rows[0] as any)?.total ?? 0,\n usersByRole: usersRes.rows as any[],\n revenue: (revenueRes.rows[0] as any)?.revenue ?? 0,\n commission: (revenueRes.rows[0] as any)?.commission ?? 0,\n ordersByStatus: statusRes.rows as any[],\n };\n}\n",[],[298,290],"database","828c3f34-411c-11f1-843f-42b51c65c3df","migrations.ts","828c3fd4-411c-11f1-843f-42b51c65c3df",5,["D",1777172613023],"import { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\n\nexport async function runMigrations() {\n await sqlite.batch([\n {\n sql: `CREATE TABLE IF NOT EXISTS users (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n name TEXT NOT NULL,\n phone TEXT NOT NULL UNIQUE,\n email TEXT,\n role TEXT NOT NULL DEFAULT 'student',\n password_hash TEXT NOT NULL,\n created_at TEXT DEFAULT (datetime('now'))\n )`,\n },\n {\n sql: `CREATE TABLE IF NOT EXISTS orders (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n student_id INTEGER NOT NULL,\n shop_id INTEGER,\n rider_id INTEGER,\n file_name TEXT,\n text_content TEXT,\n file_blob_key TEXT,\n print_type TEXT NOT NULL DEFAULT 'bw',\n copies INTEGER NOT NULL DEFAULT 1,\n pages INTEGER NOT NULL DEFAULT 1,\n delivery_location TEXT NOT NULL,\n status TEXT NOT NULL DEFAULT 'pending',\n print_cost REAL NOT NULL DEFAULT 0,\n delivery_fee REAL NOT NULL DEFAULT 0,\n platform_fee REAL NOT NULL DEFAULT 0,\n total_cost REAL NOT NULL DEFAULT 0,\n notes TEXT,\n created_at TEXT DEFAULT (datetime('now')),\n updated_at TEXT DEFAULT (datetime('now')),\n FOREIGN KEY (student_id) REFERENCES users(id),\n FOREIGN KEY (shop_id) REFERENCES users(id),\n FOREIGN KEY (rider_id) REFERENCES users(id)\n )`,\n },\n ]);\n}\n",[],[298,300],"780caac6-411c-11f1-929f-42b51c65c3df",["D",1777172595407],[173,174],[298],["D",1777172591721],["D",1789531852468],{"_11":12,"_126":71},{"_11":12,"_122":-5,"_70":71,"_31":69,"_123":124,"_125":30},{"_39":113,"_13":16,"_33":36,"_114":75,"_115":-5,"_116":-5,"_117":-5,"_118":-5,"_119":-5,"_120":14,"_121":12},"ctx",{"_53":-5,"_145":349,"_350":351,"_352":353,"_354":30,"_355":30,"_356":30,"_357":24,"_358":-5,"_359":-7,"_360":-7,"_361":26,"_362":30,"_363":30,"_364":-5,"_365":30,"_366":30,"_367":30,"_368":-5},"ENV",{"_320":321,"_322":323,"_324":16,"_325":326,"_327":328,"_329":330,"_331":332,"_333":334,"_335":336,"_337":338,"_339":340,"_341":342,"_343":344,"_345":346,"_347":348},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

History · shared