\n \n \n\n\n\n",[],[99,135,153],"577761a2-171f-11f0-8d73-569c3dd06744","components","577762a6-171f-11f0-8d73-569c3dd06744",26,["D",1744408382728],[167],[99,135,161],{"_35":168,"_13":169,"_65":170,"_67":162,"_68":69,"_70":171,"_72":73,"_37":172,"_17":75,"_76":130,"_77":173,"_79":50,"_80":-5,"_110":174,"_18":175},"10fe0284-1720-11f0-8053-569c3dd06744","App.tsx","5f26967a-171f-11f0-8e32-569c3dd06744",42,["D",1744408693984],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\nimport { FiLoader, FiRefreshCw } from \"https://esm.sh/react-icons@5.5.0/fi?deps=react@18.2.0\";\nimport { PixelData } from \"../../types.d.ts\";\n\nexport function App() {\n const [pixel, setPixel] = useState(null);\n const [loading, setLoading] = useState(false);\n const [refreshing, setRefreshing] = useState(false);\n const [copySuccess, setCopySuccess] = useState(\"\");\n const [copyType, setCopyType] = useState(\"\");\n\n // Check if we're on a status page or create a new pixel\n useEffect(() => {\n const path = globalThis.location.pathname;\n const match = path.match(/\\/pixeltracker\\/status\\/([^\\/]+)/);\n\n if (match && match[1]) {\n fetchPixelDetails(match[1]);\n\n // Set up auto-refresh\n const interval = setInterval(() => {\n refreshPixelData(match[1]);\n }, 5000);\n\n return () => clearInterval(interval);\n } else {\n createNewPixel();\n }\n }, []);\n\n const refreshPixelData = async (id: string) => {\n setRefreshing(true);\n try {\n const response = await fetch(`/pixeltracker/data/${id}`);\n if (response.ok) {\n const data = await response.json();\n setPixel(data);\n }\n } catch (error) {\n console.error(\"Error refreshing pixel data:\", error);\n } finally {\n setRefreshing(false);\n }\n };\n\n const createNewPixel = async () => {\n setLoading(true);\n try {\n const response = await fetch(\"/pixeltracker/create\");\n const data = await response.json();\n await fetchPixelDetails(data.id);\n } catch (error) {\n console.error(\"Error creating pixel:\", error);\n } finally {\n setLoading(false);\n }\n };\n\n const fetchPixelDetails = async (id: string) => {\n setLoading(true);\n try {\n const response = await fetch(`/pixeltracker/data/${id}`);\n const data = await response.json();\n setPixel(data);\n } catch (error) {\n console.error(\"Error fetching pixel details:\", error);\n } finally {\n setLoading(false);\n }\n };\n\n const copyToClipboard = (text: string, type: string) => {\n navigator.clipboard.writeText(text)\n .then(() => {\n setCopySuccess(\"Copied!\");\n setCopyType(type);\n setTimeout(() => {\n setCopySuccess(\"\");\n setCopyType(\"\");\n }, 2000);\n })\n .catch(() => {\n setCopySuccess(\"Failed to copy\");\n setCopyType(type);\n });\n };\n\n const formatDate = (dateString: string) => {\n return new Date(dateString).toLocaleString();\n };\n\n if (loading && !pixel) {\n return (\n

\n Simple Pixel Tracker\n

\n \n

Creating your tracking pixel...

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

\n Simple Pixel Tracker\n

\n\n {pixel && (\n

Your Tracking Pixel

\n {refreshing\n ? \n : (\n refreshPixelData(pixel.id)}\n className=\"text-blue-500 hover:text-blue-700\"\n title=\"Refresh data\"\n >\n \n \n )}\n

\n ID: {pixel.id}\n

\n Created:{\" \"}\n {formatDate(pixel.created)}\n

\n Total Views:{\" \"}\n {pixel.views.length}\n

\n\n

Status Page URL

\n Share this URL to check the status of your tracking pixel:\n

\n \n copyToClipboard(pixel.statusUrl, \"status\")}\n className=\"bg-blue-500 hover:bg-blue-600 text-white font-bold py-3 px-4 rounded-r-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50 transition duration-200\"\n >\n Copy\n \n

\n {copySuccess && copyType === \"status\" && (\n

{copySuccess}

\n )}\n

\n\n

Tracking Pixel

\n Copy this HTML tag to include in your email:\n

\n {copySuccess && copyType === \"html\" && (\n

{copySuccess}

\n )}\n

\n\n

View History

\n {pixel.views.length === 0\n ? (\n

\n No views yet. When someone opens your email, their visit will\n appear here.\n

\n )\n : (\n

\n \n \n \n \n \n \n \n \n {pixel.views.map((view, index) => (\n \n \n \n \n ))}\n \n

\n Time\n	\n Referrer\n
\n {formatDate(view.timestamp)}\n	\n {view.referer}\n

\n )}\n

\n\n

\n \n {loading ? \"Creating...\" : \"Create Another Pixel\"}\n \n

\n )}\n

\n );\n}\n",[],[99,135,161,169],"576e0896-171f-11f0-8d73-569c3dd06744","backend","576e099a-171f-11f0-8d73-569c3dd06744",25,["D",1744408382667],[183,184],[99,177],{"_35":193,"_13":194,"_65":195,"_67":178,"_68":69,"_70":31,"_72":73,"_37":196,"_17":87,"_76":197,"_77":198,"_79":50,"_80":199,"_110":200,"_18":201},{"_35":185,"_13":186,"_65":187,"_67":178,"_68":69,"_70":188,"_72":73,"_37":189,"_17":95,"_76":130,"_77":190,"_79":50,"_80":-5,"_110":191,"_18":192},"578dea80-171f-11f0-8cf9-569c3dd06744","pngs.ts","578deb48-171f-11f0-8cf9-569c3dd06744",29,["D",1744408382806],"// 1x1 transparent PNG\nexport const transparentPng = new Uint8Array([\n 0x89,\n 0x50,\n 0x4E,\n 0x47,\n 0x0D,\n 0x0A,\n 0x1A,\n 0x0A,\n 0x00,\n 0x00,\n 0x00,\n 0x0D,\n 0x49,\n 0x48,\n 0x44,\n 0x52,\n 0x00,\n 0x00,\n 0x00,\n 0x01,\n 0x00,\n 0x00,\n 0x00,\n 0x01,\n 0x08,\n 0x06,\n 0x00,\n 0x00,\n 0x00,\n 0x1F,\n 0x15,\n 0xC4,\n 0x89,\n 0x00,\n 0x00,\n 0x00,\n 0x0B,\n 0x49,\n 0x44,\n 0x41,\n 0x54,\n 0x08,\n 0xD7,\n 0x63,\n 0x60,\n 0x00,\n 0x02,\n 0x00,\n 0x00,\n 0x05,\n 0x00,\n 0x01,\n 0xE2,\n 0x26,\n 0x05,\n 0x9B,\n 0x00,\n 0x00,\n 0x00,\n 0x00,\n 0x49,\n 0x45,\n 0x4E,\n 0x44,\n 0xAE,\n 0x42,\n 0x60,\n 0x82,\n]);\n",[],[99,177,186],"e546cb6c-171f-11f0-a6fa-569c3dd06744","index.ts","579501b2-171f-11f0-928c-569c3dd06744",["D",1744408620634],"http","import { serveFile } from \"https://esm.town/v/std/utils@85-main/index.ts\";\nimport { Hono } from \"npm:hono\";\nimport { blob } from \"https://esm.town/v/std/blob?v=13\";\nimport { nanoid } from \"npm:nanoid\";\nimport { transparentPng } from \"./pngs.ts\";\nimport type { PixelData } from \"../types.d.ts\";\n\nconst app = new Hono();\n\n// Helper function to get pixel data\nconst getPixelData = async (id: string): Promise => {\n try {\n const data = await blob.getJSON(`pixeltracker/pixel_${id}`);\n return data as PixelData;\n } catch (_error) {\n const newData: PixelData = {\n id,\n created: new Date().toISOString(),\n views: [],\n };\n await blob.setJSON(`pixeltracker/pixel_${id}`, newData);\n return newData;\n }\n};\n\n// Serve index.html at the root /\napp.get(\"/\", async (c) => {\n return serveFile(\"/src/frontend/index.html\", import.meta.url);\n});\n\n// Serve all /frontend files\napp.get(\"/src/frontend/**/*\", (c) => serveFile(c.req.path, import.meta.url));\n\n// Create new tracking pixel\napp.get(\"/pixeltracker/create\", async (c) => {\n const id = nanoid(10);\n const newPixel: PixelData = {\n id,\n created: new Date().toISOString(),\n views: [],\n };\n\n await blob.setJSON(`pixeltracker/pixel_${id}`, newPixel);\n\n const baseUrl = new URL(c.req.url).origin;\n return c.json({\n id,\n statusUrl: `${baseUrl}/pixeltracker/status/${id}`,\n trackingUrl: `${baseUrl}/pixeltracker/pixel/${id}.png`,\n });\n});\n\n// Status page for a pixel\napp.get(\"/pixeltracker/status/:id\", async (c) => {\n const id = c.req.param(\"id\");\n try {\n await getPixelData(id);\n return serveFile(\"/src/frontend/index.html\", import.meta.url);\n } catch (_e) {\n return c.json({ error: \"Pixel not found\" }, 404);\n }\n});\n\n// Get JSON data for a pixel\napp.get(\"/pixeltracker/data/:id\", async (c) => {\n const id = c.req.param(\"id\");\n try {\n const data = await getPixelData(id);\n const baseUrl = new URL(c.req.url).origin;\n return c.json({\n ...data,\n statusUrl: `${baseUrl}/pixeltracker/status/${id}`,\n trackingUrl: `${baseUrl}/pixeltracker/pixel/${id}.png`,\n });\n } catch (_e) {\n return c.json({ error: \"Pixel not found\" }, 404);\n }\n});\n\n// Tracking pixel endpoint\napp.get(\"/pixeltracker/pixel/:id.png\", async (c) => {\n const id = c.req.param(\"id\");\n\n try {\n const data = await getPixelData(id);\n\n data.views.push({\n timestamp: new Date().toISOString(),\n ip: c.req.header(\"x-forwarded-for\") || \"unknown\",\n userAgent: c.req.header(\"user-agent\") || \"unknown\",\n referer: c.req.header(\"referer\") || \"unknown\",\n });\n\n await blob.setJSON(`pixeltracker/pixel_${id}`, data);\n } catch (e) {\n console.error(`Error tracking pixel ${id}:`, e);\n }\n\n return new Response(transparentPng, {\n headers: {\n \"Content-Type\": \"image/png\",\n \"Access-Control-Allow-Origin\": \"*\",\n \"Cache-Control\": \"no-store, no-cache, must-revalidate, proxy-revalidate\",\n \"Pragma\": \"no-cache\",\n \"Expires\": \"0\",\n },\n });\n});\n\n// Unwrap and rethrow Hono errors as the original error\napp.onError((err, _c) => {\n throw err;\n});\n\nexport default app.fetch;\n","tracker",[],[99,177,194],"4ab60506-16ff-11f0-8a46-569c3dd06744",["D",1744394617429],"legacyEnvVars","httpPrivacy","description","imageUrl","userId","4555dd0e-707e-4444-acd3-049d206eb1db","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount","bced381e-9ab2-4b55-929d-e7c5064f7f38","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_11":12,"_245":241},"org",{"_11":12,"_239":-5,"_240":241,"_208":209,"_242":243,"_244":50},"branch",{"_17":171,"_13":16,"_35":69,"_41":202,"_44":36,"_45":235,"_236":52,"_237":42,"_238":56,"_57":14,"_53":12},39,"forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvdXBsb2FkZWQvaW1nXzJvVXpPVUZRTjZGTGd2Q2t4c0RRdFpNZWJ5UCJ9","tier","pro","canRestrictVals","profileImageUrl","adoptOrgId",{"_35":202,"_13":14,"_37":328,"_48":-5,"_204":50,"_51":52,"_205":52,"_206":-5,"_207":-5,"_208":209,"_210":195,"_211":73,"_212":-5,"_213":31,"_214":95,"_55":215,"_216":-5,"_217":-5,"_218":-5,"_219":-5,"_220":221,"_222":221,"_223":224,"_225":224,"_226":224,"_227":221,"_228":221,"_229":329,"_231":330,"_233":331,"_49":50},[289,299,300,301],"files",[289,290,291,292,293,294,295,296,297,298,299,300,301],"counts",{"_280":95,"_281":75,"_282":95,"_34":283,"_284":285},[272,273,274,275],"upstreamProject",{"_35":42,"_13":58,"_206":268,"_207":269,"_51":52,"_229":270},"upstreamBranch",{"_35":36,"_37":266,"_39":267,"_13":16,"_41":42,"_17":43,"_44":-5,"_45":-5,"_46":47,"_48":-5,"_49":50,"_51":52,"_53":54,"_55":56,"_57":58},"emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},["D",1740674013689],["D",1785420707976],"Starter template with client-side React & Hono server","https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/64dc00cc-94d9-47dd-81b1-dde02610d900/square512?exp=1789668945&sig=eefb33e0b790ef2eb45eb3b069e954dc1e4631c43599bf8a6bfd8ebaacfce804",{"_11":54,"_245":271},"https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/129cab32-3bd7-4c3e-f39b-f12900c76100/square512?exp=1789668945&sig=26d01e28399ca8403301f8277e50fe1551314eb3060416367294338c26d0e957",{"_35":98,"_13":99,"_65":100,"_67":-5,"_68":69,"_70":101,"_72":73,"_37":102,"_17":95,"_76":103,"_77":-5,"_79":50,"_80":-5,"_18":279},{"_35":90,"_13":91,"_65":92,"_67":-5,"_68":69,"_70":93,"_72":73,"_37":94,"_17":95,"_76":24,"_77":96,"_79":50,"_80":-5,"_18":278},{"_35":82,"_13":83,"_65":84,"_67":-5,"_68":69,"_70":85,"_72":73,"_37":86,"_17":87,"_76":24,"_77":88,"_79":50,"_80":-5,"_18":277},{"_35":63,"_13":64,"_65":66,"_67":-5,"_68":69,"_70":71,"_72":73,"_37":74,"_17":75,"_76":24,"_77":78,"_79":50,"_80":-5,"_18":276},[64],[83],[91],[99],"pulls","branches","forks",{"_286":95,"_288":95},"connections",{"_286":95,"_287":95},"count","unfilledCount","emptyCount",{"_35":98,"_13":99,"_65":100,"_67":-5,"_68":69,"_70":101,"_72":73,"_37":119,"_17":95,"_76":103,"_77":-5,"_79":50,"_80":-5,"_110":326,"_18":327},{"_35":176,"_13":177,"_65":178,"_67":100,"_68":69,"_70":179,"_72":73,"_37":180,"_17":95,"_76":103,"_77":-5,"_79":50,"_80":-5,"_110":324,"_18":325},{"_35":193,"_13":194,"_65":195,"_67":178,"_68":69,"_70":31,"_72":73,"_37":196,"_17":87,"_76":197,"_77":198,"_79":50,"_80":199,"_110":322,"_18":323},{"_35":185,"_13":186,"_65":187,"_67":178,"_68":69,"_70":188,"_72":73,"_37":189,"_17":95,"_76":130,"_77":190,"_79":50,"_80":-5,"_110":320,"_18":321},{"_35":134,"_13":135,"_65":136,"_67":100,"_68":69,"_70":137,"_72":73,"_37":138,"_17":95,"_76":103,"_77":-5,"_79":50,"_80":-5,"_110":318,"_18":319},{"_35":160,"_13":161,"_65":162,"_67":136,"_68":69,"_70":163,"_72":73,"_37":164,"_17":95,"_76":103,"_77":-5,"_79":50,"_80":-5,"_110":316,"_18":317},{"_35":168,"_13":169,"_65":170,"_67":162,"_68":69,"_70":171,"_72":73,"_37":172,"_17":75,"_76":130,"_77":173,"_79":50,"_80":-5,"_110":314,"_18":315},{"_35":152,"_13":153,"_65":154,"_67":136,"_68":69,"_70":155,"_72":73,"_37":156,"_17":87,"_76":24,"_77":157,"_79":50,"_80":-5,"_110":312,"_18":313},{"_35":144,"_13":145,"_65":146,"_67":136,"_68":69,"_70":147,"_72":73,"_37":148,"_17":95,"_76":130,"_77":149,"_79":50,"_80":-5,"_110":310,"_18":311},{"_35":125,"_13":126,"_65":127,"_67":100,"_68":69,"_70":128,"_72":73,"_37":129,"_17":95,"_76":130,"_77":131,"_79":50,"_80":-5,"_110":308,"_18":309},{"_35":90,"_13":91,"_65":92,"_67":-5,"_68":69,"_70":93,"_72":73,"_37":116,"_17":95,"_76":24,"_77":96,"_79":50,"_80":-5,"_110":306,"_18":307},{"_35":82,"_13":83,"_65":84,"_67":-5,"_68":69,"_70":85,"_72":73,"_37":113,"_17":87,"_76":24,"_77":88,"_79":50,"_80":-5,"_110":304,"_18":305},{"_35":63,"_13":64,"_65":66,"_67":-5,"_68":69,"_70":71,"_72":73,"_37":109,"_17":75,"_76":24,"_77":78,"_79":50,"_80":-5,"_110":302,"_18":303},[],[64],[],[83],[],[91],[],[99,126],[],[99,135,145],[],[99,135,153],[],[99,135,161,169],[295],[99,135,161],[294,296,297],[99,135],[],[99,177,186],[],[99,177,194],[291,292],[99,177],[290,293,298],[99],["D",1744394617429],{"_11":12,"_245":241},{"_11":12,"_239":-5,"_240":241,"_208":209,"_242":243,"_244":50},{"_17":171,"_13":16,"_35":69,"_41":202,"_44":36,"_45":235,"_236":52,"_237":42,"_238":56,"_57":14,"_53":12},"ctx",{"_229":-5,"_263":365,"_366":367,"_368":369,"_370":50,"_371":50,"_372":50,"_373":73,"_374":-5,"_375":-7,"_376":-7,"_377":95,"_378":50,"_379":50,"_380":-5,"_381":50,"_382":50,"_383":50,"_384":-5},"ENV",{"_336":337,"_338":339,"_340":16,"_341":342,"_343":344,"_345":346,"_347":348,"_349":350,"_351":352,"_353":354,"_355":356,"_357":358,"_359":360,"_361":362,"_363":364},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","a3e067d4463eea85f6334f8e583e8516ae58c4f6","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"]

Code