[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_329":330,"_331":332},"routes/_app.x.$handle.$name",{"_110":109,"_37":50,"_119":96,"_32":120,"_13":14,"_121":-5,"_11":122,"_123":124,"_125":126,"_127":128,"_129":130,"_26":-5,"_131":132,"_133":134,"_135":30,"_136":137,"_138":65,"_139":-5,"_140":-5,"_141":142},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":18,"_19":-5},"project",{"_48":49,"_37":50,"_43":51,"_52":-5,"_53":30,"_54":55,"_56":55,"_57":58,"_59":60,"_19":61,"_62":63,"_64":65,"_66":-5,"_67":-5,"_68":69,"_70":71,"_72":73,"_74":75,"_76":77,"_78":-5,"_79":80,"_81":80,"_82":83,"_84":83,"_85":83,"_86":80,"_87":80,"_88":89,"_90":91,"_92":93,"_94":30},"version",13,"changes",[25],"aiChatInfo",{"_20":21,"_22":-5,"_23":-5,"_24":-5},"userId","aiChatMessageId","5309cf6c-8fa9-4b3d-931b-a60143ec0fcb","aiChatThreadId","aiChatThreadUserId","aiChatThreadTitle",{"_26":27,"_28":-7,"_29":30,"_31":30,"_32":33,"_34":33},"file",{"_35":36,"_37":38,"_39":40,"_41":42,"_43":44,"_45":14,"_46":47,"_29":30},"previous","deleted",false,"deletedHere","path","frontend/components/Calendar.tsx","latestPath","fileId","e4323d8a-7d6a-11f1-9710-1607ee4eb77e","name","Calendar.tsx","fileType","script","content","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\n\ninterface Order {\n id: number;\n retailer: string;\n subject: string;\n email_date: string;\n email_type: string;\n tracking_number: string | null;\n carrier: string | null;\n estimated_arrival: string | null;\n status: string;\n order_total: string | null;\n}\n\ninterface CalendarProps {\n orders: Order[];\n onConfirm: (id: number) => void;\n confirmedId: number | null;\n}\n\nconst STATUS_COLORS: Record = {\n ordered: \"bg-blue-500\",\n shipped: \"bg-purple-500\",\n out_for_delivery: \"bg-orange-500\",\n delivered: \"bg-green-500\",\n confirmed: \"bg-gray-400\",\n};\n\nconst STATUS_DOT: Record = {\n ordered: \"bg-blue-500\",\n shipped: \"bg-purple-500\",\n out_for_delivery: \"bg-orange-500\",\n delivered: \"bg-green-500\",\n confirmed: \"bg-gray-400\",\n};\n\nconst MONTHS = [\"January\", \"February\", \"March\", \"April\", \"May\", \"June\", \"July\", \"August\", \"September\", \"October\", \"November\", \"December\"];\nconst DAYS = [\"Sun\", \"Mon\", \"Tue\", \"Wed\", \"Thu\", \"Fri\", \"Sat\"];\n\nexport function Calendar({ orders, onConfirm, confirmedId }: CalendarProps) {\n const [currentMonth, setCurrentMonth] = useState(new Date());\n const [selectedDate, setSelectedDate] = useState(null);\n\n // Group orders by date\n const ordersByDate: Record = {};\n for (const order of orders) {\n const dateKey = order.estimated_arrival ?? order.email_date?.split(\"T\")[0];\n if (dateKey) {\n if (!ordersByDate[dateKey]) ordersByDate[dateKey] = [];\n ordersByDate[dateKey].push(order);\n }\n }\n\n const year = currentMonth.getFullYear();\n const month = currentMonth.getMonth();\n const firstDay = new Date(year, month, 1).getDay();\n const daysInMonth = new Date(year, month + 1, 0).getDate();\n const today = new Date().toISOString().split(\"T\")[0];\n\n const cells: (number | null)[] = [];\n for (let i = 0; i < firstDay; i++) cells.push(null);\n for (let d = 1; d <= daysInMonth; d++) cells.push(d);\n while (cells.length % 7 !== 0) cells.push(null);\n\n const prevMonth = () => setCurrentMonth(new Date(year, month - 1, 1));\n const nextMonth = () => setCurrentMonth(new Date(year, month + 1, 1));\n const goToday = () => {\n setCurrentMonth(new Date());\n setSelectedDate(today);\n };\n\n const selectedOrders = selectedDate ? ordersByDate[selectedDate] || [] : [];\n\n return (\n

\n {/* Calendar grid */}\n

{MONTHS[month]} {year}

\n \n \n \n

\n\n

\n {DAYS.map(d => (\n

{d}

\n ))}\n {cells.map((day, i) => {\n if (day === null) return

;\n const dateStr = `${year}-${String(month + 1).padStart(2, \"0\")}-${String(day).padStart(2, \"0\")}`;\n const dayOrders = ordersByDate[dateStr] || [];\n const isToday = dateStr === today;\n const isSelected = dateStr === selectedDate;\n const hasPending = dayOrders.some(o => o.status === \"delivered\" || o.status === \"shipped\");\n\n return (\n setSelectedDate(dateStr)}\n class={`min-h-20 p-1.5 rounded-lg border cursor-pointer transition-all ${\n isSelected ? \"border-indigo-400 bg-indigo-50\" : \"border-gray-100 hover:border-gray-300 hover:bg-gray-50\"\n } ${isToday ? \"ring-2 ring-indigo-300\" : \"\"}`}\n >\n

\n {day}\n

\n {dayOrders.slice(0, 3).map(o => (\n

\n {o.retailer}\n

\n ))}\n {dayOrders.length > 3 && (\n

+{dayOrders.length - 3} more

\n )}\n

\n {hasPending && dayOrders.length > 0 && (\n

⏳ Confirm

\n )}\n

\n );\n })}\n

\n\n {/* Side panel: selected date details */}\n

\n {selectedDate ? (\n <>\n

\n {new Date(selectedDate + \"T00:00:00\").toLocaleDateString(\"en-US\", { weekday: \"long\", month: \"long\", day: \"numeric\" })}\n

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

No orders for this date.

\n ) : (\n

\n {selectedOrders.map(order => (\n \n ))}\n

\n )}\n \n ) : (\n

📅

Click a date to see order details

\n )}\n

\n );\n}\n\nfunction OrderDetail({ order, onConfirm, confirmed }: { order: Order; onConfirm: (id: number) => void; confirmed: boolean }) {\n const needsConfirm = order.status === \"delivered\" || (order.status === \"shipped\" && order.estimated_arrival);\n const canConfirm = order.status !== \"confirmed\";\n\n return (\n

{order.retailer}

{order.subject}

\n \n {order.status.replace(/_/g, \" \")}\n \n

\n {order.tracking_number && (\n

\n 🚚 {order.carrier}: {order.tracking_number}\n

\n )}\n {order.order_total && (\n

💰 {order.order_total}

\n )}\n {needsConfirm && canConfirm && (\n onConfirm(order.id)}\n class=\"mt-2 w-full px-3 py-1.5 rounded-lg bg-green-600 text-white text-sm font-medium hover:bg-green-700 transition-colors cursor-pointer\"\n >\n {confirmed ? \"✅ Confirmed!\" : \"✅ Confirm Received\"}\n \n )}\n {order.status === \"confirmed\" && (\n

✅ You confirmed receipt

\n )}\n

\n );\n}\n","createdAt",["D",1783803347166],"branchVersion","branchId","31d32e2d-7e5f-4d55-b267-dc6b8c48ab98","id","b59279da-d98a-4e6c-8850-d4254db64611","order-tracker",["D",1783803158516],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Track orders, shipping, arrival dates in a calendar","imageUrl","https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/64dc00cc-94d9-47dd-81b1-dde02610d900/square512?exp=1789549199&sig=78a5bc27f03474c98a49b09a954e18cc6dd63f22ba19ce3e096717a88d3522b5","bf338674-fda8-4a0e-8fad-7b37cb5cc983","pinnedFileId","019f52f4-2036-751f-8749-2fa9c3c7813a","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","019f52e9-adf8-77fb-83e8-d6c15967a23c","tursoName","b59279dad98a4e6c8850d4254db64611","tursoHostname","b59279dad98a4e6c8850d4254db64611-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789526460011],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_110":109,"_118":114},"org",{"_110":109,"_111":112,"_113":114,"_19":61,"_115":116,"_117":30},"branch",{"_13":95,"_37":96,"_48":47,"_97":49,"_98":99,"_100":101,"_102":55,"_103":104,"_105":106,"_107":50,"_108":109},"isOwned",15,"main","projectId","forkedBranchId","961078ea-f528-11ef-aa68-569c3dd06744","forkedBranchVersion",89,"forkedProjectPrivacy","forkedProjectId","96102714-f528-11ef-aa68-569c3dd06744","forkedProjectOrgId","019aa807-52c2-709c-928b-2029bae9a558","projectName","userHandle","adoran","handle","displayName","Adora N","avatar","https://lh3.googleusercontent.com/a/ACg8ocLX491kPKV6up_39D9RfH3dFN86Q-HlPoXrfwv86VqwOhgDlQ=s96-c","tier","free","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_48":49,"_37":50,"_43":324,"_52":-5,"_53":30,"_54":55,"_56":55,"_57":58,"_59":60,"_19":61,"_62":63,"_64":65,"_66":-5,"_67":-5,"_68":69,"_70":71,"_72":73,"_74":75,"_76":325,"_78":-5,"_79":80,"_81":80,"_82":83,"_84":83,"_85":83,"_86":80,"_87":80,"_88":326,"_90":327,"_92":328,"_94":30},"tree",[223,233,234,235,236,237,238],"files",[223,224,225,226,227,228,229,230,231,232,233,234,235,236,237,238],"counts",{"_213":69,"_214":168,"_215":69,"_216":217,"_218":219},"contents",[154,155,156,157,158,159,160],"upstreamProject",{"_48":104,"_37":150,"_57":151,"_59":60,"_54":55,"_88":152},"upstreamBranch",{"_48":99,"_43":143,"_144":145,"_37":96,"_97":104,"_13":146,"_98":-5,"_100":-5,"_147":148,"_52":-5,"_94":30,"_54":55,"_108":149,"_70":106,"_107":150},"emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},["D",1740674013689],"updatedAt",["D",1785420707976],91,"lockfileKey","1785420708123-esm.town_v_templates_react-hono-starter@91-main","templates","react-hono-starter","Starter template with client-side React & Hono server",{"_110":149,"_118":153},"https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/129cab32-3bd7-4c3e-f39b-f12900c76100/square512?exp=1789549199&sig=85ec03bbe2ae9af315fa5e89fceebe840b59020b3ec43df39e2ab37ef0d215ad",{"_48":207,"_37":208,"_35":209,"_164":-5,"_46":47,"_45":168,"_166":65,"_43":210,"_13":69,"_39":211,"_41":-5,"_29":30,"_170":-5,"_32":212},{"_48":201,"_37":202,"_35":203,"_164":-5,"_46":47,"_45":168,"_166":30,"_43":204,"_13":69,"_39":26,"_41":205,"_29":30,"_170":-5,"_32":206},{"_48":194,"_37":195,"_35":196,"_164":-5,"_46":47,"_45":197,"_166":65,"_43":198,"_13":69,"_39":40,"_41":199,"_29":30,"_170":-5,"_32":200},{"_48":187,"_37":188,"_35":189,"_164":-5,"_46":47,"_45":190,"_166":65,"_43":191,"_13":69,"_39":40,"_41":192,"_29":30,"_170":-5,"_32":193},{"_48":180,"_37":181,"_35":63,"_164":-5,"_46":47,"_45":182,"_166":65,"_43":183,"_13":168,"_39":184,"_41":185,"_29":30,"_170":-5,"_32":186},{"_48":172,"_37":173,"_35":174,"_164":-5,"_46":47,"_45":175,"_166":65,"_43":176,"_13":168,"_39":177,"_41":178,"_29":30,"_170":-5,"_32":179},{"_48":161,"_37":162,"_35":163,"_164":-5,"_46":47,"_45":165,"_166":65,"_43":167,"_13":168,"_39":40,"_41":169,"_29":30,"_170":-5,"_32":171},"d7b13da3-e59a-4621-9476-5777c8132213","send-confirmation-email.ts","a504a22e-7d6a-11f1-946e-1607ee4eb77e","parentId",7,"latest",["D",1783803269182],1,"import nodemailer from \"npm:nodemailer\";\n\nfunction getTransporter() {\n const gmailUser = Deno.env.get(\"GMAIL_USER\");\n const gmailPass = Deno.env.get(\"GMAIL_PASS\");\n\n if (!gmailUser || !gmailPass) {\n throw new Error(\"GMAIL_USER and GMAIL_PASS environment variables are required\");\n }\n\n return nodemailer.createTransport({\n service: \"gmail\",\n auth: { user: gmailUser, pass: gmailPass },\n });\n}\n\nexport async function sendConfirmationEmails(orders: any[], baseUrl: string) {\n const gmailUser = Deno.env.get(\"GMAIL_USER\");\n if (!gmailUser) return;\n\n const transporter = getTransporter();\n\n for (const order of orders) {\n try {\n const confirmUrl = `${baseUrl}/api/orders/${order.id}/confirm`;\n\n await transporter.sendMail({\n from: gmailUser,\n to: gmailUser,\n subject: `📦 Did you receive your ${order.retailer} package?`,\n text: `Hi there!\n\nWe noticed your package from ${order.retailer} should have arrived.\n\nOrder: ${order.subject}\n${order.tracking_number ? `Tracking: ${order.carrier} ${order.tracking_number}` : \"\"}\n${order.estimated_arrival ? `Estimated arrival: ${order.estimated_arrival}` : \"\"}\n\nDid you receive this package?\n✅ Yes, I got it: ${confirmUrl}\n\nIf you haven't received it yet, you can ignore this email — we'll check again later.\n\n— Order Tracker`,\n html: `

📦 Package Confirmation

We noticed your package from ${order.retailer} should have arrived.

\n \n \n ${order.tracking_number ? `` : \"\"}\n ${order.estimated_arrival ? `` : \"\"}\n

Order:	${order.subject}
Tracking:	${order.carrier} ${order.tracking_number}
Est. arrival:	${order.estimated_arrival}

Did you receive this package?

\n ✅ Yes, I got it!\n

If you haven't received it yet, you can ignore this email.

— Order Tracker

`,\n });\n\n console.log(` 📧 Sent confirmation email for order #${order.id} (${order.retailer})`);\n } catch (error) {\n console.error(` ❌ Failed to send email for order #${order.id}:`, error);\n }\n }\n}\n","label",[162],"79d3b1c2-04c6-49fb-aa02-0d52323cb4bc","scan-gmail.ts","a4ff0bde-7d6a-11f1-8d57-1607ee4eb77e",6,["D",1783803269182],"interval","import { scanGmail } from \"./gmail.ts\";\nimport { getOrdersForConfirmation } from \"./db.ts\";\nimport { sendConfirmationEmails } from \"./send-confirmation-email.ts\";\nimport { httpEndpoint } from \"https://esm.town/v/std/utils/index.ts\";\n\nexport default async function (interval: Interval) {\n console.log(`🔄 Gmail scan started at ${new Date().toISOString()}`);\n console.log(` Last run: ${interval.lastRunAt ?? \"first run\"}`);\n\n // Step 1: Scan Gmail for new order/shipping emails\n const scanResult = await scanGmail();\n console.log(` Scan result:`, scanResult);\n\n // Step 2: Send confirmation emails for packages that should have arrived\n if (scanResult.error === null) {\n const pendingOrders = await getOrdersForConfirmation();\n if (pendingOrders.length > 0) {\n console.log(`📬 Sending confirmation emails for ${pendingOrders.length} packages`);\n const baseUrl = httpEndpoint(\"./index.ts\");\n await sendConfirmationEmails(pendingOrders, baseUrl);\n } else {\n console.log(\"✅ No packages pending confirmation\");\n }\n }\n\n console.log(`✅ Done at ${new Date().toISOString()}`);\n}\n",[173],"966ad398-d516-43fb-b5d6-bf0c138be87e","index.ts",8,["D",1783803282701],"http","import { parseVal, serveFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport { Hono } from \"npm:hono\";\nimport {\n initDB,\n getAllOrders,\n getOrderById,\n confirmOrder,\n getStats,\n getScanState,\n} from \"./db.ts\";\nimport { scanGmail } from \"./gmail.ts\";\nimport { sendConfirmationEmails } from \"./send-confirmation-email.ts\";\n\nconst app = new Hono();\n\n// Initialize database on first request\nlet dbReady = false;\nasync function ensureDB() {\n if (!dbReady) {\n await initDB();\n dbReady = true;\n }\n}\n\n// ─── Frontend ──────────────────────────────────────────────\napp.get(\"/\", () => serveFile(\"/frontend/index.html\"));\napp.get(\"/frontend/**/*\", (c) => serveFile(c.req.path));\napp.get(\"/source\", (c) => c.redirect(parseVal().links.self.val));\n\n// ─── API: Orders ──────────────────────────────────────────\napp.get(\"/api/orders\", async (c) => {\n await ensureDB();\n const orders = await getAllOrders();\n return c.json({ orders });\n});\n\napp.get(\"/api/orders/:id\", async (c) => {\n await ensureDB();\n const id = Number(c.req.param(\"id\"));\n const order = await getOrderById(id);\n if (!order) return c.json({ error: \"Order not found\" }, 404);\n return c.json({ order });\n});\n\napp.post(\"/api/orders/:id/confirm\", async (c) => {\n await ensureDB();\n const id = Number(c.req.param(\"id\"));\n const success = await confirmOrder(id);\n if (!success) return c.json({ error: \"Order not found\" }, 404);\n return c.json({ success: true, message: \"Package confirmed!\" });\n});\n\n// GET version for email link clicks (simple redirect to dashboard)\napp.get(\"/api/orders/:id/confirm\", async (c) => {\n await ensureDB();\n const id = Number(c.req.param(\"id\"));\n await confirmOrder(id);\n // Redirect to dashboard with success indicator\n return new Response(null, {\n status: 302,\n headers: { Location: \"/?confirmed=\" + id },\n });\n});\n\n// ─── API: Stats ───────────────────────────────────────────\napp.get(\"/api/stats\", async (c) => {\n await ensureDB();\n const stats = await getStats();\n return c.json(stats);\n});\n\n// ─── API: Calendar ────────────────────────────────────────\napp.get(\"/api/calendar\", async (c) => {\n await ensureDB();\n const orders = await getAllOrders();\n // Group orders by estimated_arrival date\n const calendar: Record = {};\n for (const order of orders) {\n const dateKey = order.estimated_arrival ?? order.email_date?.split(\"T\")[0] ?? \"unknown\";\n if (!calendar[dateKey]) calendar[dateKey] = [];\n calendar[dateKey].push({\n id: order.id,\n retailer: order.retailer,\n subject: order.subject,\n status: order.status,\n tracking_number: order.tracking_number,\n carrier: order.carrier,\n order_total: order.order_total,\n });\n }\n return c.json({ calendar });\n});\n\n// ─── API: Gmail Status ────────────────────────────────────\napp.get(\"/api/gmail/status\", async (c) => {\n await ensureDB();\n const hasCreds = !!Deno.env.get(\"GMAIL_USER\") && !!Deno.env.get(\"GMAIL_PASS\");\n const scanState = await getScanState();\n return c.json({\n connected: hasCreds,\n email: Deno.env.get(\"GMAIL_USER\") ?? null,\n lastScan: scanState?.last_scan_date ?? null,\n });\n});\n\n// ─── API: Manual Scan ─────────────────────────────────────\napp.post(\"/api/scan\", async (c) => {\n await ensureDB();\n const result = await scanGmail();\n\n // Also send confirmation emails if any pending\n if (result.error === null) {\n const { getOrdersForConfirmation } = await import(\"./db.ts\");\n const pending = await getOrdersForConfirmation();\n if (pending.length > 0) {\n const baseUrl = new URL(c.req.url).origin;\n await sendConfirmationEmails(pending, baseUrl);\n }\n }\n\n return c.json(result);\n});\n\n// ─── Error handling ───────────────────────────────────────\napp.onError((err) => Promise.reject(err));\n\nexport default app.fetch;\n",[181],"be66b4da-33c3-472d-9ddc-18286bec8bb3","gmail.ts","99af356a-7d6a-11f1-9710-1607ee4eb77e",3,["D",1783803222305],"import { ImapFlow } from \"npm:imapflow\";\nimport { upsertOrder, getScanState, updateScanState } from \"./db.ts\";\n\n// Search keywords for different email types\nconst ORDER_KEYWORDS = [\"order confirmation\", \"your order\", \"order receipt\", \"purchase confirmation\", \"thank you for your order\", \"order placed\", \"invoice\"];\nconst SHIPPING_KEYWORDS = [\"shipped\", \"shipping update\", \"tracking\", \"dispatched\", \"on the way\", \"out for delivery\", \"in transit\"];\nconst DELIVERY_KEYWORDS = [\"delivered\", \"package arrived\", \"delivery confirmation\", \"has been delivered\"];\n\nconst CARRIER_PATTERNS: { carrier: string; pattern: RegExp }[] = [\n { carrier: \"UPS\", pattern: /\\b(1Z\\s?[A-Z0-9]{3}\\s?[A-Z0-9]{3}\\s?\\d{2}\\s?\\d{4}\\s?\\d{4})\\b/i },\n { carrier: \"FedEx\", pattern: /\\b(\\d{12}|\\d{15}|\\d{20})\\b/ },\n { carrier: \"USPS\", pattern: /\\b(\\d{20,22})\\b/ },\n { carrier: \"DHL\", pattern: /\\b(\\d{10})\\b/i },\n { carrier: \"Amazon\", pattern: /\\b(TBA\\d{12})\\b/i },\n];\n\nconst RETAILER_DOMAINS: Record = {\n \"amazon.com\": \"Amazon\",\n \"amazon.ca\": \"Amazon\",\n \"amazon.co.uk\": \"Amazon\",\n \"ebay.com\": \"eBay\",\n \"etsy.com\": \"Etsy\",\n \"walmart.com\": \"Walmart\",\n \"target.com\": \"Target\",\n \"bestbuy.com\": \"Best Buy\",\n \"homedepot.com\": \"Home Depot\",\n \"lowes.com\": \"Lowe's\",\n \"wayfair.com\": \"Wayfair\",\n \"costco.com\": \"Costco\",\n \"apple.com\": \"Apple\",\n \"shopify.com\": \"Shopify Store\",\n \"paypal.com\": \"PayPal\",\n \"stripe.com\": \"Stripe\",\n \"ups.com\": \"UPS\",\n \"fedex.com\": \"FedEx\",\n \"usps.com\": \"USPS\",\n \"dhl.com\": \"DHL\",\n};\n\nfunction detectEmailType(subject: string, body: string): string {\n const text = (subject + \" \" + body).toLowerCase();\n if (DELIVERY_KEYWORDS.some(k => text.includes(k))) return \"delivery\";\n if (SHIPPING_KEYWORDS.some(k => text.includes(k))) return \"shipping\";\n if (ORDER_KEYWORDS.some(k => text.includes(k))) return \"order\";\n return \"order\"; // default to order\n}\n\nfunction extractTrackingNumber(text: string): { tracking_number: string; carrier: string } | null {\n for (const { carrier, pattern } of CARRIER_PATTERNS) {\n const match = text.match(pattern);\n if (match) {\n return { tracking_number: match[1].replace(/\\s/g, \"\"), carrier };\n }\n }\n return null;\n}\n\nfunction extractRetailer(from: string): string {\n const emailMatch = from.match(/<([^>]+)>/);\n const email = emailMatch ? emailMatch[1] : from;\n const domain = email.split(\"@\")[1]?.toLowerCase() ?? \"\";\n for (const [domainKey, name] of Object.entries(RETAILER_DOMAINS)) {\n if (domain.includes(domainKey)) return name;\n }\n // Try to extract company name from domain\n const parts = domain.split(\".\");\n if (parts.length >= 2) {\n return parts[parts.length - 2].charAt(0).toUpperCase() + parts[parts.length - 2].slice(1);\n }\n return \"Unknown Retailer\";\n}\n\nfunction extractEstimatedArrival(text: string): string | null {\n // Look for delivery date patterns\n const datePatterns = [\n /(?:arriv(?:e|ing|al)|deliver(?:y|ed|s)|expect(?:ed)?)(?:\\s+(?:on|by|between))?\\s+([A-Z][a-z]+ \\d{1,2}(?:,? \\d{4})?)/i,\n /(?:arriv(?:e|ing|al)|deliver(?:y|ed|s)|expect(?:ed)?)(?:\\s+(?:on|by|between))?\\s+(\\d{1,2}\\/\\d{1,2}\\/?\\d{0,4})/i,\n /estimated\\s+(?:delivery|arrival)[:\\s]+([A-Z][a-z]+ \\d{1,2}(?:,? \\d{4})?)/i,\n /estimated\\s+(?:delivery|arrival)[:\\s]+(\\d{1,2}\\/\\d{1,2}\\/?\\d{0,4})/i,\n ];\n\n for (const pattern of datePatterns) {\n const match = text.match(pattern);\n if (match) {\n const dateStr = match[1];\n const parsed = new Date(dateStr);\n if (!isNaN(parsed.getTime())) {\n return parsed.toISOString().split(\"T\")[0];\n }\n // Try adding current year if missing\n const withYear = `${dateStr}, ${new Date().getFullYear()}`;\n const parsedWithYear = new Date(withYear);\n if (!isNaN(parsedWithYear.getTime())) {\n return parsedWithYear.toISOString().split(\"T\")[0];\n }\n }\n }\n return null;\n}\n\nfunction extractOrderTotal(text: string): string | null {\n const patterns = [\n /(?:total|amount|order total)[:\\s]+\\$?(\\d+\\.?\\d{0,2})/i,\n /\\$(\\d{1,4}\\.\\d{2})/,\n ];\n for (const pattern of patterns) {\n const match = text.match(pattern);\n if (match) return `$${match[1]}`;\n }\n return null;\n}\n\nexport async function scanGmail() {\n const gmailUser = Deno.env.get(\"GMAIL_USER\");\n const gmailPass = Deno.env.get(\"GMAIL_PASS\");\n\n if (!gmailUser || !gmailPass) {\n console.log(\"⚠️ Gmail credentials not set. Skipping scan.\");\n console.log(\"Set GMAIL_USER and GMAIL_PASS environment variables.\");\n return { scanned: 0, newOrders: 0, updated: 0, error: \"Missing credentials\" };\n }\n\n const client = new ImapFlow({\n host: \"imap.gmail.com\",\n port: 993,\n secure: true,\n auth: { user: gmailUser, pass: gmailPass },\n logger: false,\n });\n\n try {\n await client.connect();\n await client.mailboxOpen(\"INBOX\");\n\n const state = await getScanState();\n const since = state.last_scan_date\n ? new Date(state.last_scan_date)\n : new Date(Date.now() - 7 * 24 * 60 * 60 * 1000); // Default: last 7 days\n\n const sinceStr = since.toISOString().split(\"T\")[0];\n\n // Search for emails since last scan with order/shipping related subjects\n const searchCriteria = {\n since: since,\n subject: [\"order\", \"shipped\", \"shipping\", \"tracking\", \"delivery\", \"delivered\", \"package\", \"purchase\", \"receipt\", \"invoice\", \"dispatched\", \"confirmation\"],\n };\n\n const messages = await client.search(searchCriteria, { uid: true });\n console.log(`📧 Found ${messages.length} potential order emails since ${sinceStr}`);\n\n let newOrders = 0;\n let updated = 0;\n let maxUid = state.last_message_uid;\n\n for (const uid of messages) {\n if (uid <= state.last_message_uid) continue;\n\n const msg = await client.fetchOne(uid, { envelope: true, source: true, uid: true }, { uid: true });\n if (!msg) continue;\n\n const envelope = msg.envelope;\n const subject = envelope?.subject ?? \"(no subject)\";\n const from = envelope?.from?.[0] ? `${envelope.from[0].name ?? \"\"} <${envelope.from[0].address ?? \"\"}>` : \"unknown\";\n const date = envelope?.date ? new Date(envelope.date).toISOString() : new Date().toISOString();\n const messageId = envelope?.messageId ?? `${uid}-${date}`;\n\n // Parse email body\n const source = msg.source instanceof Uint8Array\n ? new TextDecoder().decode(msg.source)\n : String(msg.source ?? \"\");\n\n // Extract text content (simple: strip HTML tags)\n const bodyText = source\n .replace(/<[^>]*>/g, \" \")\n .replace(/ /g, \" \")\n .replace(/\\s+/g, \" \")\n .trim();\n\n const emailType = detectEmailType(subject, bodyText);\n const tracking = extractTrackingNumber(subject + \" \" + bodyText);\n const retailer = extractRetailer(from);\n const estimatedArrival = extractEstimatedArrival(subject + \" \" + bodyText);\n const orderTotal = extractOrderTotal(bodyText);\n\n const result = await upsertOrder({\n message_id: messageId,\n retailer,\n subject,\n email_date: date,\n email_type: emailType,\n tracking_number: tracking?.tracking_number,\n carrier: tracking?.carrier,\n estimated_arrival: estimatedArrival,\n order_total: orderTotal,\n });\n\n if (result.updated) {\n updated++;\n } else {\n newOrders++;\n }\n\n if (uid > maxUid) maxUid = uid;\n console.log(` ✓ [${emailType}] ${retailer}: ${subject.substring(0, 60)}`);\n }\n\n await updateScanState(new Date().toISOString(), maxUid);\n await client.logout();\n\n console.log(`✅ Scan complete: ${newOrders} new, ${updated} updated`);\n return { scanned: messages.length, newOrders, updated, error: null };\n } catch (error) {\n console.error(\"❌ Gmail scan error:\", error);\n try { await client.logout(); } catch {}\n return { scanned: 0, newOrders: 0, updated: 0, error: String(error) };\n }\n}\n",[188],"99438914-13a8-41d2-a7ca-df3dad4f5f72","db.ts","99a81abe-7d6a-11f1-993d-1607ee4eb77e",2,["D",1783803222304],"import { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\n\nexport interface Order {\n id: number;\n message_id: string;\n retailer: string;\n subject: string;\n email_date: string;\n email_type: string;\n tracking_number: string | null;\n carrier: string | null;\n estimated_arrival: string | null;\n status: string;\n order_total: string | null;\n items: string | null;\n created_at: string;\n updated_at: string;\n}\n\nexport async function initDB() {\n await sqlite.batch([\n {\n sql: `CREATE TABLE IF NOT EXISTS orders (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n message_id TEXT UNIQUE NOT NULL,\n retailer TEXT,\n subject TEXT,\n email_date TEXT,\n email_type TEXT,\n tracking_number TEXT,\n carrier TEXT,\n estimated_arrival TEXT,\n status TEXT DEFAULT 'ordered',\n order_total TEXT,\n items TEXT,\n created_at TEXT DEFAULT CURRENT_TIMESTAMP,\n updated_at TEXT DEFAULT CURRENT_TIMESTAMP\n )`,\n },\n {\n sql: `CREATE TABLE IF NOT EXISTS scan_state (\n id INTEGER PRIMARY KEY CHECK (id = 1),\n last_scan_date TEXT,\n last_message_uid INTEGER DEFAULT 0\n )`,\n },\n {\n sql: `INSERT OR IGNORE INTO scan_state (id, last_scan_date, last_message_uid) VALUES (1, NULL, 0)`,\n },\n {\n sql: `CREATE INDEX IF NOT EXISTS idx_orders_status ON orders(status)`,\n },\n {\n sql: `CREATE INDEX IF NOT EXISTS idx_orders_estimated_arrival ON orders(estimated_arrival)`,\n },\n ]);\n}\n\nexport async function upsertOrder(order: {\n message_id: string;\n retailer: string;\n subject: string;\n email_date: string;\n email_type: string;\n tracking_number?: string;\n carrier?: string;\n estimated_arrival?: string;\n order_total?: string;\n items?: string;\n}) {\n // Check if order exists by message_id\n const existing = await sqlite.execute({\n sql: \"SELECT id, status FROM orders WHERE message_id = ?\",\n args: [order.message_id],\n });\n\n if (existing.rows.length > 0) {\n // Update existing order with new info (but don't downgrade status)\n const row = existing.rows[0] as any;\n const statusMap: Record = {\n ordered: 0,\n shipped: 1,\n out_for_delivery: 2,\n delivered: 3,\n confirmed: 4,\n };\n const currentStatusRank = statusMap[row.status] ?? 0;\n const newStatusRank = statusMap[order.email_type === \"delivery\" ? \"delivered\" : order.email_type === \"shipping\" ? \"shipped\" : \"ordered\"] ?? 0;\n const finalStatus = newStatusRank > currentStatusRank\n ? (order.email_type === \"delivery\" ? \"delivered\" : order.email_type === \"shipping\" ? \"shipped\" : row.status)\n : row.status;\n\n await sqlite.execute({\n sql: `UPDATE orders SET\n retailer = COALESCE(?, retailer),\n subject = ?,\n email_date = ?,\n email_type = ?,\n tracking_number = COALESCE(?, tracking_number),\n carrier = COALESCE(?, carrier),\n estimated_arrival = COALESCE(?, estimated_arrival),\n order_total = COALESCE(?, order_total),\n items = COALESCE(?, items),\n status = ?,\n updated_at = CURRENT_TIMESTAMP\n WHERE id = ?`,\n args: [\n order.retailer, order.subject, order.email_date, order.email_type,\n order.tracking_number ?? null, order.carrier ?? null,\n order.estimated_arrival ?? null, order.order_total ?? null,\n order.items ?? null, finalStatus, row.id,\n ],\n });\n return { updated: true, id: row.id };\n }\n\n const status = order.email_type === \"delivery\" ? \"delivered\" : order.email_type === \"shipping\" ? \"shipped\" : \"ordered\";\n const result = await sqlite.execute({\n sql: `INSERT INTO orders (message_id, retailer, subject, email_date, email_type, tracking_number, carrier, estimated_arrival, status, order_total, items)\n VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`,\n args: [\n order.message_id, order.retailer, order.subject, order.email_date,\n order.email_type, order.tracking_number ?? null, order.carrier ?? null,\n order.estimated_arrival ?? null, status,\n order.order_total ?? null, order.items ?? null,\n ],\n });\n return { updated: false, id: Number(result.lastInsertRowid) };\n}\n\nexport async function getAllOrders(): Promise {\n await initDB();\n const result = await sqlite.execute(\n \"SELECT * FROM orders ORDER BY email_date DESC\"\n );\n return result.rows as unknown as Order[];\n}\n\nexport async function getOrderById(id: number): Promise {\n const result = await sqlite.execute({\n sql: \"SELECT * FROM orders WHERE id = ?\",\n args: [id],\n });\n return (result.rows[0] as unknown as Order) ?? null;\n}\n\nexport async function confirmOrder(id: number): Promise {\n const result = await sqlite.execute({\n sql: \"UPDATE orders SET status = 'confirmed', updated_at = CURRENT_TIMESTAMP WHERE id = ?\",\n args: [id],\n });\n return result.rowsAffected > 0;\n}\n\nexport async function getOrdersForConfirmation(): Promise {\n // Get orders that are delivered or have an estimated arrival that's today/past\n const today = new Date().toISOString().split(\"T\")[0];\n const result = await sqlite.execute({\n sql: `SELECT * FROM orders\n WHERE status IN ('delivered', 'shipped')\n AND (estimated_arrival IS NOT NULL AND estimated_arrival <= ?)\n AND status != 'confirmed'\n ORDER BY estimated_arrival ASC`,\n args: [today],\n });\n return result.rows as unknown as Order[];\n}\n\nexport async function getScanState() {\n const result = await sqlite.execute(\"SELECT * FROM scan_state WHERE id = 1\");\n return result.rows[0] as { last_scan_date: string | null; last_message_uid: number };\n}\n\nexport async function updateScanState(lastScanDate: string, lastMessageUid: number) {\n await sqlite.execute({\n sql: \"UPDATE scan_state SET last_scan_date = ?, last_message_uid = ? WHERE id = 1\",\n args: [lastScanDate, lastMessageUid],\n });\n}\n\nexport async function getStats() {\n await initDB();\n const total = await sqlite.execute(\"SELECT COUNT(*) as count FROM orders\");\n const byStatus = await sqlite.execute({\n sql: `SELECT status, COUNT(*) as count FROM orders GROUP BY status`,\n });\n const pendingConfirms = await sqlite.execute({\n sql: `SELECT COUNT(*) as count FROM orders WHERE status IN ('delivered', 'shipped') AND status != 'confirmed'`,\n });\n\n return {\n total: (total.rows[0] as any).count,\n byStatus: byStatus.rows.reduce((acc: Record, row: any) => {\n acc[row.status] = row.count;\n return acc;\n }, {}),\n pendingConfirmations: (pendingConfirms.rows[0] as any).count,\n };\n}\n",[195],"8368a079-7fb3-4983-9803-ea235c775747","README.md","019f52f4-2036-751f-8749-2951064acbc7",["D",1783803158516],"# React + Hono Starter\n\nA minimal starter template for building client-side React apps with a Hono\nbackend on Val Town. Click **Remix** to get your own copy.\n\n## Picking a starter\n\n| Starter | When to pick it |\n| --- | --- |\n| [`basic-html-starter`](https://www.val.town/x/templates/basic-html-starter) | Static HTML pages. Sprinkle of vanilla JS. No server-side rendering. |\n| [`hono-jsx-starter`](https://www.val.town/x/templates/hono-jsx-starter) | Dynamic server-rendered HTML with JSX. API routes. No React, no SPA. |\n| **[`react-hono-starter`](https://www.val.town/x/templates/react-hono-starter)** *(you're here)* | Client-side React SPA with a Hono API backend. |\n\n**Want to build UI?** Start writing React components in\n[`frontend/components/`](/frontend/components/). Import them into `App.tsx` and\nyou're good to go. Styling is [Twind](https://twind.style/) — just use Tailwind\nutility classes, zero config.\n\n**Want to add an API?** Add routes in [`index.ts`](/index.ts) (there's a\ncommented-out example). Fetch them from your React components.\n\n## Architecture\n\n```mermaid\ngraph LR\n Browser -->|\"GET /\"| Hono[\"index.ts
(Hono server)\"]\n Hono -->|serves| HTML[\"index.html\"]\n HTML -->|loads| Entry[\"index.tsx\"]\n Entry -->|renders| App[\"App.tsx\"]\n App -->|renders| Counter[\"Counter.tsx\"]\n```\n\n## File structure\n\n```\nindex.ts ← Hono backend (serves frontend + API routes)\nfrontend/\n index.html ← HTML shell (loads Twind + React)\n index.tsx ← React entrypoint (mounts )\n favicon.svg ← App icon\n components/\n App.tsx ← Root component (layout + view source link)\n Counter.tsx ← Example component with state\n```\n\n## How it works\n\n1. **`index.ts`** is the HTTP entrypoint — a Hono server that serves the\n frontend and any API routes you add.\n2. **`frontend/index.html`** loads Twind and the React entrypoint.\n3. **`frontend/index.tsx`** mounts the React app.\n4. **`frontend/components/App.tsx`** is the root layout — add new components\n alongside it.\n5. **`frontend/components/Counter.tsx`** is an example stateful component —\n replace it with your own!\n\n## Next steps\n\n- Add API routes in `index.ts`\n- Add new components in `frontend/components/`\n- Add a SQLite database — see the\n [React Hono Example](https://www.val.town/x/stevekrouse/reactHonoExample) for\n a full-stack example with database, queries, and shared types\n",[202],"f22c9242-5c2c-44d1-9f97-ac07e49a8df8","frontend","019f52f4-2036-751f-8749-2692611b1b18",["D",1783803158516],"directory",[208],"pulls","branches","forks","envVars",{"_220":69,"_222":69},"connections",{"_220":69,"_221":69},"count","unfilledCount","emptyCount",{"_48":207,"_37":208,"_35":209,"_164":-5,"_46":47,"_45":168,"_166":65,"_43":321,"_13":69,"_39":211,"_41":-5,"_29":30,"_170":-5,"_240":322,"_32":323},{"_48":317,"_37":289,"_35":283,"_164":209,"_46":47,"_45":168,"_166":65,"_43":318,"_13":69,"_39":211,"_41":-5,"_29":30,"_170":-5,"_240":319,"_32":320},{"_48":309,"_37":310,"_35":311,"_164":283,"_46":47,"_45":312,"_166":65,"_43":313,"_13":168,"_39":40,"_41":314,"_29":30,"_170":-5,"_240":315,"_32":316},{"_48":305,"_37":38,"_35":36,"_164":283,"_46":47,"_45":14,"_166":65,"_43":306,"_13":69,"_39":40,"_41":42,"_29":30,"_170":-5,"_240":307,"_32":308},{"_48":298,"_37":299,"_35":300,"_164":283,"_46":47,"_45":168,"_166":30,"_43":301,"_13":69,"_39":40,"_41":302,"_29":30,"_170":-5,"_240":303,"_32":304},{"_48":290,"_37":291,"_35":292,"_164":283,"_46":47,"_45":293,"_166":65,"_43":294,"_13":69,"_39":40,"_41":295,"_29":30,"_170":-5,"_240":296,"_32":297},{"_48":280,"_37":281,"_35":282,"_164":283,"_46":47,"_45":284,"_166":65,"_43":285,"_13":69,"_39":40,"_41":286,"_29":30,"_170":-5,"_240":287,"_32":288},{"_48":273,"_37":274,"_35":275,"_164":209,"_46":47,"_45":168,"_166":65,"_43":276,"_13":69,"_39":26,"_41":277,"_29":30,"_170":-5,"_240":278,"_32":279},{"_48":265,"_37":266,"_35":267,"_164":209,"_46":47,"_45":268,"_166":65,"_43":269,"_13":168,"_39":26,"_41":270,"_29":30,"_170":-5,"_240":271,"_32":272},{"_48":258,"_37":259,"_35":260,"_164":209,"_46":47,"_45":168,"_166":65,"_43":261,"_13":69,"_39":40,"_41":262,"_29":30,"_170":-5,"_240":263,"_32":264},{"_48":201,"_37":202,"_35":203,"_164":-5,"_46":47,"_45":168,"_166":30,"_43":255,"_13":69,"_39":26,"_41":205,"_29":30,"_170":-5,"_240":256,"_32":257},{"_48":194,"_37":195,"_35":196,"_164":-5,"_46":47,"_45":197,"_166":65,"_43":252,"_13":69,"_39":40,"_41":199,"_29":30,"_170":-5,"_240":253,"_32":254},{"_48":187,"_37":188,"_35":189,"_164":-5,"_46":47,"_45":190,"_166":65,"_43":249,"_13":69,"_39":40,"_41":192,"_29":30,"_170":-5,"_240":250,"_32":251},{"_48":180,"_37":181,"_35":63,"_164":-5,"_46":47,"_45":182,"_166":65,"_43":246,"_13":168,"_39":184,"_41":185,"_29":30,"_170":-5,"_240":247,"_32":248},{"_48":172,"_37":173,"_35":174,"_164":-5,"_46":47,"_45":175,"_166":65,"_43":243,"_13":168,"_39":177,"_41":178,"_29":30,"_170":-5,"_240":244,"_32":245},{"_48":161,"_37":162,"_35":163,"_164":-5,"_46":47,"_45":165,"_166":65,"_43":239,"_13":168,"_39":40,"_41":169,"_29":30,"_170":-5,"_240":241,"_32":242},["D",1783803269182],"children",[],[162],["D",1783803269182],[],[173],["D",1783803282701],[],[181],["D",1783803222305],[],[188],["D",1783803222304],[],[195],["D",1783803158516],[],[202],"68fa35ab-f210-4e87-900d-e8b305b7bb4b","index.tsx","019f52f4-2036-751f-8749-2377c32a3766",["D",1783803158516],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport { App } from \"./components/App.tsx\";\n\nconst root = document.getElementById(\"root\");\nif (!root) {\n throw new Error(\"No root element found\");\n}\n\ncreateRoot(root).render();",[],[208,259],"a602b446-83d0-4dab-8130-c09091f3137b","index.html","019f52f4-2036-751f-8749-1d603d4637d4",9,["D",1783803308890],"\n\n \n \n \n 📦 Order Tracker\n \n \n \n \n

\n \n \n \n\n",[],[208,266],"37e43383-6683-406c-9c25-7b1bb3916a38","favicon.svg","019f52f4-2036-751f-8749-1b3fd97bdbce",["D",1783803158516],"\n",[],[208,274],"a29719c1-a1d5-4bf9-bfca-658fa9804267","OrderList.tsx","e42cca30-7d6a-11f1-81e0-1607ee4eb77e","019f52f4-2036-751f-8749-15c69b12f487",12,["D",1783803347173],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\n\ninterface Order {\n id: number;\n retailer: string;\n subject: string;\n email_date: string;\n email_type: string;\n tracking_number: string | null;\n carrier: string | null;\n estimated_arrival: string | null;\n status: string;\n order_total: string | null;\n}\n\ninterface OrderListProps {\n orders: Order[];\n onConfirm: (id: number) => void;\n confirmedId: number | null;\n}\n\nconst STATUS_COLORS: Record = {\n ordered: \"bg-blue-500\",\n shipped: \"bg-purple-500\",\n out_for_delivery: \"bg-orange-500\",\n delivered: \"bg-green-500\",\n confirmed: \"bg-gray-400\",\n};\n\nconst STATUS_ICONS: Record = {\n ordered: \"📋\",\n shipped: \"🚚\",\n out_for_delivery: \"📦\",\n delivered: \"📬\",\n confirmed: \"✅\",\n};\n\ntype FilterType = \"all\" | \"pending\" | \"ordered\" | \"shipped\" | \"delivered\" | \"confirmed\";\n\nconst FILTERS: { label: string; value: FilterType }[] = [\n { label: \"All\", value: \"all\" },\n { label: \"⏳ Pending\", value: \"pending\" },\n { label: \"📋 Ordered\", value: \"ordered\" },\n { label: \"🚚 Shipped\", value: \"shipped\" },\n { label: \"📬 Delivered\", value: \"delivered\" },\n { label: \"✅ Confirmed\", value: \"confirmed\" },\n];\n\nexport function OrderList({ orders, onConfirm, confirmedId }: OrderListProps) {\n const [filter, setFilter] = useState(\"all\");\n\n const filtered = orders.filter(o => {\n if (filter === \"all\") return true;\n if (filter === \"pending\") return o.status === \"delivered\" || o.status === \"shipped\";\n return o.status === filter;\n });\n\n return (\n

\n {/* Filter buttons */}\n

\n {FILTERS.map(f => (\n setFilter(f.value)}\n class={`px-3 py-1.5 rounded-lg text-sm font-medium transition-colors cursor-pointer ${\n filter === f.value ? \"bg-indigo-600 text-white\" : \"bg-white text-gray-600 border border-gray-200 hover:bg-gray-50\"\n }`}\n >\n {f.label}\n \n ))}\n

\n\n {/* Order cards */}\n {filtered.length === 0 ? (\n

📭

No orders found. Try scanning your Gmail!

\n ) : (\n

\n {filtered.map(order => (\n \n ))}\n

\n )}\n

\n );\n}\n\nfunction OrderCard({ order, onConfirm, confirmed }: { order: Order; onConfirm: (id: number) => void; confirmed: boolean }) {\n const needsConfirm = (order.status === \"delivered\" || order.status === \"shipped\") && order.status !== \"confirmed\";\n const emailDate = new Date(order.email_date).toLocaleDateString(\"en-US\", { month: \"short\", day: \"numeric\", year: \"numeric\" });\n const arrivalDate = order.estimated_arrival\n ? new Date(order.estimated_arrival + \"T00:00:00\").toLocaleDateString(\"en-US\", { weekday: \"short\", month: \"short\", day: \"numeric\" })\n : null;\n const today = new Date().toISOString().split(\"T\")[0];\n const isOverdue = order.estimated_arrival && order.estimated_arrival < today && order.status !== \"confirmed\";\n\n return (\n

\n {/* Left: info */}\n

\n \n {STATUS_ICONS[order.status]} {order.status.replace(/_/g, \" \")}\n \n {isOverdue && (\n \n ⚠️ Overdue\n \n )}\n

{order.retailer}

{order.subject}

\n\n

\n 📅 {emailDate}\n {arrivalDate && (\n \n 📬 Est. arrival: {arrivalDate}\n \n )}\n {order.tracking_number && (\n 🚚 {order.carrier}: {order.tracking_number}\n )}\n {order.order_total && (\n 💰 {order.order_total}\n )}\n

\n\n {/* Right: confirm button */}\n {needsConfirm && (\n onConfirm(order.id)}\n class={`px-4 py-2 rounded-lg text-sm font-medium whitespace-nowrap transition-colors cursor-pointer ${\n confirmed ? \"bg-green-100 text-green-700\" : \"bg-green-600 text-white hover:bg-green-700\"\n }`}\n >\n {confirmed ? \"✅ Confirmed!\" : \"✅ Confirm Received\"}\n \n )}\n {order.status === \"confirmed\" && (\n

✅ Received

\n )}\n

\n );\n}\n",[],[208,289,281],"components","6df3a3c5-9259-4f1e-abda-b0498746ec4c","Header.tsx","e4151048-7d6a-11f1-bc3f-1607ee4eb77e",11,["D",1783803347165],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\n\ninterface Stats {\n total: number;\n byStatus: Record;\n pendingConfirmations: number;\n}\n\ninterface GmailStatus {\n connected: boolean;\n email: string | null;\n lastScan: string | null;\n}\n\ninterface HeaderProps {\n stats: Stats | null;\n gmailStatus: GmailStatus | null;\n onScan: () => void;\n scanning: boolean;\n scanResult: string | null;\n view: \"calendar\" | \"orders\";\n onViewChange: (v: \"calendar\" | \"orders\") => void;\n}\n\nconst STATUS_COLORS: Record = {\n ordered: \"bg-blue-100 text-blue-700\",\n shipped: \"bg-purple-100 text-purple-700\",\n out_for_delivery: \"bg-orange-100 text-orange-700\",\n delivered: \"bg-green-100 text-green-700\",\n confirmed: \"bg-gray-200 text-gray-600\",\n};\n\nconst STATUS_ICONS: Record = {\n ordered: \"📋\",\n shipped: \"🚚\",\n out_for_delivery: \"📦\",\n delivered: \"📬\",\n confirmed: \"✅\",\n};\n\nexport function Header({ stats, gmailStatus, onScan, scanning, scanResult, view, onViewChange }: HeaderProps) {\n return (\n

\n {/* Title row */}\n

\n 📦 Order Tracker\n

\n \n {scanning ? \"🔄 Scanning...\" : \"🔍 Scan Now\"}\n \n

\n\n {/* Scan result */}\n {scanResult && (\n

\n {scanResult}\n

\n )}\n\n {/* Stats bar */}\n {stats && (\n

\n \n \n \n \n \n {stats.pendingConfirmations > 0 && (\n \n )}\n

\n )}\n\n {/* Gmail status + view toggle */}\n

\n {gmailStatus?.connected ? (\n \n \n Gmail: {gmailStatus.email}\n \n ) : (\n \n \n Gmail: Not connected\n \n )}\n {gmailStatus?.lastScan && (\n \n Last scan: {new Date(gmailStatus.lastScan).toLocaleDateString()}\n \n )}\n

\n\n

\n onViewChange(\"calendar\")}\n class={`px-4 py-1.5 rounded-md text-sm font-medium transition-colors cursor-pointer ${\n view === \"calendar\" ? \"bg-white text-indigo-600 shadow-sm\" : \"text-gray-500 hover:text-gray-700\"\n }`}\n >\n 📅 Calendar\n \n onViewChange(\"orders\")}\n class={`px-4 py-1.5 rounded-md text-sm font-medium transition-colors cursor-pointer ${\n view === \"orders\" ? \"bg-white text-indigo-600 shadow-sm\" : \"text-gray-500 hover:text-gray-700\"\n }`}\n >\n 📋 Orders\n \n

\n );\n}\n\nfunction StatCard({ label, value, icon, color = \"indigo\" }: { label: string; value: number; icon: string; color?: string }) {\n const colors: Record = {\n indigo: \"bg-indigo-50 text-indigo-700 border-indigo-200\",\n blue: \"bg-blue-50 text-blue-700 border-blue-200\",\n purple: \"bg-purple-50 text-purple-700 border-purple-200\",\n green: \"bg-green-50 text-green-700 border-green-200\",\n gray: \"bg-gray-50 text-gray-700 border-gray-200\",\n amber: \"bg-amber-50 text-amber-700 border-amber-200\",\n };\n return (\n

{icon} {label}

{value}

\n );\n}\n",[],[208,289,291],"483cda10-555e-4700-9aca-476899f94c4c","Counter.tsx","019f52f4-2036-751f-8749-1325b470f3ea",["D",1783803158516],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\n\nexport function Counter() {\n const [count, setCount] = useState(0);\n return (\n

\n Clicked\n setCount((c) => c + 1)}\n class=\"bg-blue-500 hover:bg-blue-600 text-white font-medium px-4 py-2 rounded-lg transition-colors cursor-pointer\"\n >\n {count}\n \n times\n

\n );\n}\n",[],[208,289,299],"6ceb10a1-2a32-4b8d-a352-31cf7bbae9cb",["D",1783803347166],[],[208,289,38],"61999adc-f781-4ad5-b11d-f52573d946af","App.tsx","019f52f4-2036-751f-8749-0c3647c2c90b",10,["D",1783803308895],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useEffect, useCallback } from \"https://esm.sh/react@18.2.0\";\nimport { Header } from \"./Header.tsx\";\nimport { Calendar } from \"./Calendar.tsx\";\nimport { OrderList } from \"./OrderList.tsx\";\n\ninterface Order {\n id: number;\n message_id: string;\n retailer: string;\n subject: string;\n email_date: string;\n email_type: string;\n tracking_number: string | null;\n carrier: string | null;\n estimated_arrival: string | null;\n status: string;\n order_total: string | null;\n items: string | null;\n created_at: string;\n updated_at: string;\n}\n\ninterface Stats {\n total: number;\n byStatus: Record;\n pendingConfirmations: number;\n}\n\ninterface GmailStatus {\n connected: boolean;\n email: string | null;\n lastScan: string | null;\n}\n\ntype View = \"calendar\" | \"orders\";\n\nexport function App() {\n const [orders, setOrders] = useState([]);\n const [stats, setStats] = useState(null);\n const [gmailStatus, setGmailStatus] = useState(null);\n const [view, setView] = useState(\"calendar\");\n const [loading, setLoading] = useState(true);\n const [scanning, setScanning] = useState(false);\n const [scanResult, setScanResult] = useState(null);\n const [confirmedId, setConfirmedId] = useState(null);\n\n const fetchData = useCallback(async () => {\n try {\n const [ordersRes, statsRes, gmailRes] = await Promise.all([\n fetch(\"/api/orders\"),\n fetch(\"/api/stats\"),\n fetch(\"/api/gmail/status\"),\n ]);\n const ordersData = await ordersRes.json();\n const statsData = await statsRes.json();\n const gmailData = await gmailRes.json();\n setOrders(ordersData.orders || []);\n setStats(statsData);\n setGmailStatus(gmailData);\n } catch (err) {\n console.error(\"Failed to fetch data:\", err);\n } finally {\n setLoading(false);\n }\n }, []);\n\n useEffect(() => {\n // Check for confirmation redirect\n const params = new URLSearchParams(window.location.search);\n const confirmed = params.get(\"confirmed\");\n if (confirmed) {\n setConfirmedId(Number(confirmed));\n setTimeout(() => setConfirmedId(null), 5000);\n window.history.replaceState({}, \"\", \"/\");\n }\n fetchData();\n }, [fetchData]);\n\n const handleScan = async () => {\n setScanning(true);\n setScanResult(null);\n try {\n const res = await fetch(\"/api/scan\", { method: \"POST\" });\n const data = await res.json();\n if (data.error) {\n setScanResult(`❌ Error: ${data.error}`);\n } else {\n setScanResult(`✅ Scanned ${data.scanned} emails — ${data.newOrders} new, ${data.updated} updated`);\n await fetchData();\n }\n } catch (err) {\n setScanResult(`❌ Scan failed: ${String(err)}`);\n } finally {\n setScanning(false);\n }\n };\n\n const handleConfirm = async (id: number) => {\n try {\n await fetch(`/api/orders/${id}/confirm`, { method: \"POST\" });\n await fetchData();\n setConfirmedId(id);\n setTimeout(() => setConfirmedId(null), 3000);\n } catch (err) {\n console.error(\"Failed to confirm:\", err);\n }\n };\n\n if (loading) {\n return (\n

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

\n \n\n {confirmedId !== null && (\n

\n ✅ Package confirmed! Marked as received.\n

\n )}\n\n {!gmailStatus?.connected && (\n

⚠️ Gmail Not Connected

\n Set GMAIL_USER and{\" \"}\n GMAIL_PASS environment variables to start tracking orders.\n See the setup instructions below.\n

\n )}\n\n {view === \"calendar\" ? (\n \n ) : (\n \n )}\n\n \n

\n );\n}\n",[],[208,289,310],"0f8df77e-fb68-4181-a220-8242a8cf2ba6",["D",1783803158516],[225,226,227,228,229],[208,289],["D",1783803158516],[224,230,231,232],[208],["D",1783803158516],["D",1789526460011],{"_110":109,"_118":114},{"_110":109,"_111":112,"_113":114,"_19":61,"_115":116,"_117":30},{"_13":95,"_37":96,"_48":47,"_97":49,"_98":99,"_100":101,"_102":55,"_103":104,"_105":106,"_107":50,"_108":109},"ctx",{"_88":-5,"_140":362,"_363":364,"_365":366,"_367":30,"_368":30,"_369":30,"_370":65,"_371":-5,"_372":-7,"_373":-7,"_374":69,"_375":30,"_376":30,"_377":-5,"_378":30,"_379":30,"_380":30,"_381":-5},"ENV",{"_333":334,"_335":336,"_337":96,"_338":339,"_340":341,"_342":343,"_344":345,"_346":347,"_348":349,"_350":351,"_352":353,"_354":355,"_356":357,"_358":359,"_360":361},"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"]

Diff · v13