\n \n \n

\n );\n}",[],[87,123],"30a6cf9e-0a78-11f0-9f40-569c3dd06744","components","c428a8de-e249-45cc-ad98-c5a26cf7c2e9",["D",1743017177648],[135,136,137],[87,130],{"_35":152,"_13":153,"_64":154,"_66":131,"_67":68,"_69":70,"_71":72,"_37":155,"_17":31,"_74":118,"_75":156,"_77":50,"_78":-5,"_102":157,"_18":158},{"_35":145,"_13":146,"_64":147,"_66":131,"_67":68,"_69":70,"_71":72,"_37":148,"_17":31,"_74":118,"_75":149,"_77":50,"_78":-5,"_102":150,"_18":151},{"_35":138,"_13":139,"_64":140,"_66":131,"_67":68,"_69":70,"_71":72,"_37":141,"_17":31,"_74":118,"_75":142,"_77":50,"_78":-5,"_102":143,"_18":144},"30a6cd78-0a78-11f0-9f40-569c3dd06744","ui.tsx","b774b73b-b0f5-43dc-b95d-123661a111d7",["D",1743017177648],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\n\nexport function Section({ children }: any) {\n const sectionClass = \"my-3 bg-neutral-400 bg-opacity-10 p-5 rounded-xl \";\n return

{children}

;\n}\n\nexport function Button(props: any) {\n const buttonClass = \"dark:bg-white dark:text-black bg-black text-white rounded-md px-3 py-1 \";\n return \n );\n}\n\nexport function MonoButtonWithStatus(props: any) {\n const [status, setStatus] = useState();\n const handleClick = async () => {\n try {\n setStatus(\"...\");\n const result = await props.onClick?.();\n setStatus(formatJSON(result));\n } catch (err) {\n console.error(err);\n setStatus(\"Error: \" + err);\n }\n };\n\n return (\n

\n \n {status &&

{status}

}\n

\n );\n}\n\nexport function formatJSON(json: any) {\n return JSON.stringify(json, null, 2);\n}\n\nexport const shorten = (string, start, end) => {\n return string.substring(0, start) + \"…\" + string.substring(string.length - end);\n};\n\nexport const formatAddress = (address) => {\n if (!address) return \"\";\n if (address.length < 20) return address;\n return shorten(address, 6, 4);\n};",[],[87,130,139],"30a6c760-0a78-11f0-9f40-569c3dd06744","FarcasterMiniApp.tsx","abaedd69-5daa-464f-b49e-76576036f516",["D",1743017177648],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport fcsdk from \"https://esm.sh/@farcaster/frame-sdk\";\nimport { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\nimport { formatAddress, formatJSON, MonoButtonWithStatus, Section } from \"./ui.tsx\";\n\nexport function FarcasterMiniApp() {\n const [context, setContext] = useState();\n const [walletAddresses, setWalletAddresses] = useState();\n const [contextExpanded, setContextExpanded] = useState(false);\n\n useEffect(() => {\n fcsdk.actions.ready();\n fcsdk.context.then(setContext);\n fcsdk.wallet?.ethProvider?.request({ method: \"eth_requestAccounts\" }).then(setWalletAddresses).catch(console.log);\n }, []);\n\n console.log(fcsdk, context);\n\n return (\n

\n {context && (\n <>\n {context?.user?.fid && (\n

User

{context?.user?.username}

{context?.user?.fid}

\n )}\n\n {walletAddresses?.length > 0 && (\n

Wallet

{formatAddress(walletAddresses[0])}

\n\n

\n \n fcsdk.wallet?.ethProvider?.request({\n method: \"eth_chainId\",\n })}\n >\n chainId\n \n \n fcsdk.wallet?.ethProvider?.request({\n method: \"wallet_switchEthereumChain\",\n params: [{ chainId: \"0x2105\" }],\n })}\n >\n switchChain (base)\n \n \n fcsdk.wallet?.ethProvider?.request({\n method: \"eth_sendTransaction\",\n params: [{\n from: walletAddresses[0],\n to: \"0x5F77DBc7686327D3BF6eC1887E5a3AdA0aE60841\",\n value: \"0x\" + (100000000000000).toString(16),\n }],\n })}\n >\n sendTransaction\n \n

\n )}\n\n

sdk.actions

\n fcsdk.actions.viewProfile({ fid: context.user.fid })}>\n viewProfile\n \n fcsdk.actions.openUrl(\"https://www.youtube.com/watch?v=dQw4w9WgXcQ\")}\n >\n openUrl\n \n fcsdk.actions.openUrl(\"https://warpcast.com/~/compose\")}>\n openUrl (warpcast)\n \n fcsdk.actions.setPrimaryButton({ text: \"Primary Button\" })}>\n setPrimaryButton\n \n fcsdk.actions.addFrame()}>addFrame\n fcsdk.actions.signIn({})}>signIn\n fcsdk.actions.close()}>close\n\n {\n /* \n fcsdk.actions.swap({\n sellToken: \"eip155:8453/erc20:0x833589fCD6eDb6E08f4c7C32D4f71b54bdA02913\",\n buyToken: \"eip155:8453/erc20:0x833589fCD6eDb6E08f4c7C32D4f71b54bdA02913\",\n sellAmount: \"3000000\",\n })}\n >\n swap\n */\n }\n

\n\n

sdk.context

setContextExpanded(!contextExpanded)}>\n {contextExpanded ? \"▲\" : \"▼\"}\n

\n\n {contextExpanded && (\n

\n {formatJSON(context)}\n

\n )}\n

\n \n )}\n\n {!context && (\n

Open this web app in Warpcast to see the Mini App.

\n )}\n

\n );\n}",[],[87,130,146],"30a6c4d6-0a78-11f0-9f40-569c3dd06744","Example.tsx","57d74338-7320-481a-92e2-1ce72f53bf19",["D",1743017177648],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\n\nexport function Example() {\n return (\n

Mini App Starter

Hono + React + Tailwind + Farcaster Mini App Starter Project on Val Town

\n );\n}",[],[87,130,153],["D",1743017177648],[162,163],[93],{"_35":172,"_13":173,"_64":174,"_66":94,"_67":68,"_69":70,"_71":72,"_37":175,"_17":31,"_74":118,"_75":176,"_77":50,"_78":-5,"_102":177,"_18":178},{"_35":164,"_13":165,"_64":166,"_66":94,"_67":68,"_69":70,"_71":72,"_37":167,"_17":31,"_74":168,"_75":169,"_77":50,"_78":-5,"_102":170,"_18":171},"30a6bf36-0a78-11f0-9f40-569c3dd06744","index.ts","962049e4-1ee9-4968-b9e9-9d257be7b7e9",["D",1743017177648],"http","/** @jsxImportSource npm:hono/jsx */\nimport { serveFile } from \"https://esm.town/v/std/utils@64-main/index.ts\";\nimport { Hono } from \"npm:hono\";\nimport { embedMetadata, handleFarcasterEndpoints, iconUrl, name, ogImageUrl } from \"./farcaster.ts\";\n\nconst app = new Hono();\n\napp.get(\"/\", async c => {\n const baseUrl = c.req.url.replace(/\\/$/, \"\");\n return c.html(\n \n \n {name}\n \n \n \n \n \n \n \n

\n {/* */}\n \n \n ,\n );\n});\n\napp.get(\"/frontend/**/*\", c => serveFile(c.req.path, import.meta.url));\n\nhandleFarcasterEndpoints(app);\n\n// test\napp.get(\"/test\", c =>\n c.json({\n hello: \"world\",\n baseUrl: c.req.url.replace(c.req.path, \"\"),\n \"import.meta.url\": import.meta.url,\n }));\n\n// Unwrap and rethrow Hono errors as the original error\n// If you delete this, all errors will be \"Internal Server Error\"\napp.onError((err, c) => {\n throw err;\n});\n\n// HTTP vals expect an exported \"fetch handler\"\n// This is how you \"run the server\" in Val Town with Hono\nexport default app.fetch;",[],[93,165],"30a6b324-0a78-11f0-9f40-569c3dd06744","farcaster.ts","ebe48d52-e33c-4d5e-9fa4-22303b62ae4d",["D",1743017177648],"import { Hono } from \"npm:hono\";\n\nexport const name = \"Mini App Starter\";\nexport const iconUrl = \"https://imgur.com/TrJLlwp.png\";\nexport const ogImageUrl = \"https://imgur.com/xKVOVUE.png\";\n\nexport function embedMetadata(baseUrl: string) {\n return {\n version: \"next\",\n imageUrl: ogImageUrl,\n button: {\n title: name,\n action: {\n type: \"launch_frame\",\n name: name,\n url: baseUrl,\n splashImageUrl: iconUrl,\n splashBackgroundColor: \"#111111\",\n },\n },\n };\n}\n\nexport function handleFarcasterEndpoints(app: Hono) {\n app.get(\"/.well-known/farcaster.json\", (c) => {\n const baseUrl = c.req.url.replace(c.req.path, \"\");\n\n let accountAssociation = {};\n if (baseUrl == \"https://moe--3238fa84059c11f0ac33569c3dd06744.web.val.run\") {\n accountAssociation = {\n \"header\":\n \"eyJmaWQiOjIwNzMsInR5cGUiOiJjdXN0b2R5Iiwia2V5IjoiMHg0OERCN2U3MWQxMTUyNjU5MTY5NjE2NzNCOTY4NjcwQTU0N2IwZkJFIn0\",\n \"payload\": \"eyJkb21haW4iOiJtb2UtLTMyMzhmYTg0MDU5YzExZjBhYzMzNTY5YzNkZDA2NzQ0LndlYi52YWwucnVuIn0\",\n \"signature\":\n \"MHhjNjc2NTRlMzIzOTA3ZTk4ZDk2OGNiOTNhYmRjMDI0Y2Y3M2MxM2UxNjZmNGY3NjRjZjk4ODJlZTBhZTg4ZjAwNDNkNjRmNjg1YTRmN2MxMjI0YmUyMTZlNjViNTFmYmQ4NDJiYmQ1YzYwMjJkMDZhOGI5MGY3NTQ3NTNmZTExMjFi\",\n };\n }\n\n const manifest = {\n accountAssociation,\n frame: {\n \"name\": name,\n \"version\": \"1\",\n \"iconUrl\": iconUrl,\n \"homeUrl\": baseUrl,\n \"splashImageUrl\": iconUrl,\n \"splashBackgroundColor\": \"#111111\",\n \"webhookUrl\": baseUrl + \"/webhook\",\n },\n };\n\n return c.json(manifest);\n });\n\n app.post(\"/webhook\", async (c) => {\n const baseUrl = c.req.url.replace(c.req.path, \"\");\n const body = await c.req.json();\n const header = decodeBase64Json(body.header);\n const payload = decodeBase64Json(body.payload);\n\n const fid = header?.fid;\n const event = payload?.event;\n\n console.log(\"[warpcast-frame-webhook]\", header, payload);\n\n if (event === \"frame_added\" || event === \"notifications_enabled\") {\n const notificationUrl = payload?.notificationDetails?.url;\n const notificationToken = payload?.notificationDetails?.token;\n\n const res = await sendFarcasterNotification({\n title: name + \" installed!\",\n body: \"🚀🚀🚀\",\n targetUrl: baseUrl,\n tokens: [notificationToken],\n });\n console.log(\"[warpcast-frame-webhook]\", notificationUrl, notificationToken, res);\n }\n\n return c.json({});\n });\n}\n\nconst decodeBase64Json = (str: string) => JSON.parse(Buffer.from(str, \"base64\").toString(\"utf-8\"));\n\nasync function sendFarcasterNotification(payload: any) {\n return await fetch(\"https://api.warpcast.com/v1/frame-notifications\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({\n notificationId: Math.random().toString(36), // TODO: generate a unique id\n ...payload,\n }),\n }).then(res => res.json());\n}",[],[93,173],"309f9152-0a78-11f0-9f40-569c3dd06744",["D",1743017177648],"legacyEnvVars","httpPrivacy","description","imageUrl","userId","c156eb0e-8b9d-4104-a055-502e9a0eb441","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount","2019e55b-c541-4c51-bef0-008eef10ef88","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_11":12,"_222":218},"org",{"_11":12,"_216":-5,"_217":218,"_185":186,"_219":220,"_221":50},"branch",{"_17":70,"_13":16,"_35":68,"_41":179,"_44":36,"_45":212,"_213":52,"_214":42,"_215":56,"_57":14,"_53":12},380,"forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvdXBsb2FkZWQvaW1nXzJ4cFpFME5pSXNZamJNd296dlZSYVJ0OVF1RSJ9","tier","pro","canRestrictVals","profileImageUrl","adoptOrgId",{"_35":179,"_13":14,"_37":301,"_48":-5,"_181":50,"_51":52,"_182":52,"_183":-5,"_184":-5,"_185":186,"_187":166,"_188":72,"_189":-5,"_190":-5,"_191":31,"_55":192,"_193":-5,"_194":-5,"_195":-5,"_196":-5,"_197":198,"_199":198,"_200":201,"_202":201,"_203":201,"_204":198,"_205":198,"_206":302,"_208":303,"_210":304,"_49":50},[265,268,275,276],"files",[265,266,267,268,269,270,271,272,273,274,275,276],"counts",{"_256":31,"_257":70,"_258":31,"_34":259,"_260":261},[248,249,250,251],"upstreamProject",{"_35":42,"_13":14,"_183":245,"_184":-5,"_51":52,"_206":246},"upstreamBranch",{"_35":36,"_37":243,"_39":244,"_13":16,"_41":42,"_17":43,"_44":-5,"_45":-5,"_46":47,"_48":-5,"_49":50,"_51":52,"_53":54,"_55":56,"_57":14},"emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},["D",1742482886202],["D",1765906750880],"Hono + React + Tailwind + Farcaster Mini App Starter Project",{"_11":54,"_222":247},"https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvb2F1dGhfZ2l0aHViL2ltZ18yanFDd29JUGxvVEl1YVVlcHJiV2VYMUxFWjkifQ",{"_35":92,"_13":93,"_64":94,"_66":-5,"_67":68,"_69":70,"_71":72,"_37":95,"_17":31,"_74":90,"_75":-5,"_77":50,"_78":-5,"_18":255},{"_35":86,"_13":87,"_64":88,"_66":-5,"_67":68,"_69":70,"_71":72,"_37":89,"_17":31,"_74":90,"_75":-5,"_77":50,"_78":-5,"_18":254},{"_35":80,"_13":81,"_64":82,"_66":-5,"_67":68,"_69":70,"_71":72,"_37":83,"_17":31,"_74":24,"_75":84,"_77":50,"_78":-5,"_18":253},{"_35":62,"_13":63,"_64":65,"_66":-5,"_67":68,"_69":70,"_71":72,"_37":73,"_17":31,"_74":24,"_75":76,"_77":50,"_78":-5,"_18":252},[63],[81],[87],[93],"pulls","branches","forks",{"_262":31,"_264":31},"connections",{"_262":31,"_263":31},"count","unfilledCount","emptyCount",{"_35":92,"_13":93,"_64":94,"_66":-5,"_67":68,"_69":70,"_71":72,"_37":159,"_17":31,"_74":90,"_75":-5,"_77":50,"_78":-5,"_102":299,"_18":300},{"_35":172,"_13":173,"_64":174,"_66":94,"_67":68,"_69":70,"_71":72,"_37":175,"_17":31,"_74":118,"_75":176,"_77":50,"_78":-5,"_102":297,"_18":298},{"_35":164,"_13":165,"_64":166,"_66":94,"_67":68,"_69":70,"_71":72,"_37":167,"_17":31,"_74":168,"_75":169,"_77":50,"_78":-5,"_102":295,"_18":296},{"_35":86,"_13":87,"_64":88,"_66":-5,"_67":68,"_69":70,"_71":72,"_37":108,"_17":31,"_74":90,"_75":-5,"_77":50,"_78":-5,"_102":293,"_18":294},{"_35":129,"_13":130,"_64":131,"_66":88,"_67":68,"_69":70,"_71":72,"_37":132,"_17":31,"_74":90,"_75":-5,"_77":50,"_78":-5,"_102":291,"_18":292},{"_35":152,"_13":153,"_64":154,"_66":131,"_67":68,"_69":70,"_71":72,"_37":155,"_17":31,"_74":118,"_75":156,"_77":50,"_78":-5,"_102":289,"_18":290},{"_35":145,"_13":146,"_64":147,"_66":131,"_67":68,"_69":70,"_71":72,"_37":148,"_17":31,"_74":118,"_75":149,"_77":50,"_78":-5,"_102":287,"_18":288},{"_35":138,"_13":139,"_64":140,"_66":131,"_67":68,"_69":70,"_71":72,"_37":141,"_17":31,"_74":118,"_75":142,"_77":50,"_78":-5,"_102":285,"_18":286},{"_35":122,"_13":123,"_64":124,"_66":88,"_67":68,"_69":70,"_71":72,"_37":125,"_17":31,"_74":118,"_75":126,"_77":50,"_78":-5,"_102":283,"_18":284},{"_35":114,"_13":115,"_64":116,"_66":88,"_67":68,"_69":70,"_71":72,"_37":117,"_17":31,"_74":118,"_75":119,"_77":50,"_78":-5,"_102":281,"_18":282},{"_35":80,"_13":81,"_64":82,"_66":-5,"_67":68,"_69":70,"_71":72,"_37":105,"_17":31,"_74":24,"_75":84,"_77":50,"_78":-5,"_102":279,"_18":280},{"_35":62,"_13":63,"_64":65,"_66":-5,"_67":68,"_69":70,"_71":72,"_37":101,"_17":31,"_74":24,"_75":76,"_77":50,"_78":-5,"_102":277,"_18":278},[],[63],[],[81],[],[87,115],[],[87,123],[],[87,130,139],[],[87,130,146],[],[87,130,153],[270,271,272],[87,130],[269,273,274],[87],[],[93,165],[],[93,173],[266,267],[93],["D",1743017177648],{"_11":12,"_222":218},{"_11":12,"_216":-5,"_217":218,"_185":186,"_219":220,"_221":50},{"_17":70,"_13":16,"_35":68,"_41":179,"_44":36,"_45":212,"_213":52,"_214":42,"_215":56,"_57":14,"_53":12},"ctx",{"_206":-5,"_240":338,"_339":340,"_341":342,"_343":50,"_344":50,"_345":50,"_346":72,"_347":-5,"_348":-7,"_349":-7,"_350":31,"_351":50,"_352":50,"_353":-5,"_354":50,"_355":50,"_356":50,"_357":-5},"ENV",{"_309":310,"_311":312,"_313":16,"_314":315,"_316":317,"_318":319,"_320":321,"_322":323,"_324":325,"_326":327,"_328":329,"_330":331,"_332":333,"_334":335,"_336":337},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","fdb67791413f4386b4dbf18f354029a617f6160f","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