[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_178":179,"_180":181},"routes/_app.x.$handle.$name",{"_97":96,"_32":45,"_105":84,"_27":106,"_13":14,"_107":-5,"_11":108,"_109":110,"_111":112,"_113":114,"_115":116,"_20":-5,"_117":118,"_119":120,"_121":25,"_122":123,"_124":49,"_125":-5,"_126":-5,"_127":128},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_43":44,"_32":45,"_38":46,"_47":-5,"_48":49,"_50":51,"_52":51,"_53":-5,"_54":-5,"_18":55,"_56":31,"_57":49,"_58":-5,"_59":-5,"_60":61,"_62":63,"_64":-5,"_65":-5,"_66":-5,"_67":-5,"_68":69,"_70":69,"_71":72,"_73":72,"_74":72,"_75":69,"_76":69,"_77":78,"_79":80,"_81":82,"_83":25},"version",2,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":23,"_24":25,"_26":25,"_27":28,"_29":28},"file",{"_30":31,"_32":28,"_33":34,"_35":37,"_38":39,"_40":14,"_41":42,"_24":25},"previous",{"_30":31,"_32":28,"_33":34,"_35":36},"deleted",false,"deletedHere","path","main.tsx","latestPath","fileId","4dd59184-2523-11f0-b0e0-569c3dd06744","name","fileType","http","content","/** @jsxImportSource https://esm.sh/react */\nimport { micromark } from \"https://esm.sh/micromark@3\";\nimport { email } from \"https://esm.town/v/std/email?v=11\";\nimport { discordWebhook } from \"https://esm.town/v/stevekrouse/discordWebhook\";\nimport { html } from \"https://esm.town/v/stevekrouse/html\";\nimport { renderToString } from \"npm:react-dom/server\";\nimport Stripe from \"npm:stripe\";\n\nconst stripe = new Stripe(Deno.env.get(\"stripe_sk_customer_readonly\") as string, {\n apiVersion: \"2020-08-27\",\n});\n\nfunction getStripeCustomer(customerId: string) {\n return stripe.customers.retrieve(customerId);\n}\n\nconst subject = \"Welcome to Val Town Pro\";\nconst welcomeEmail = (\n

\n Thank you for subscribing to Val Town Pro!\n

\n You now have higher limits across the board, allowing you to run your vals in production. Your subscription also\n includes custom domains, smarter Townie, and{\" \"}lots more.\n

\n {\n /*

\n TODO - advirtise a val or two\n One of my favorite vals that's only only available to Pro users\n is this Twitter alert.\n

*/\n }\n

\n If you have any issues, please ask on Discord{\" \"}\n (in #general) and we'll respond right away.\n

\n This is an automated email – powered by a val\n {\" \"}\n – but replies reach my inbox directly. I'd love to hear from you!\n

Best,

Steve

Val Town | Co-Founder

\n);\n\nexport let newStripeEvent = async (req: Request) => {\n const url = new URL(req.url);\n if (req.method === \"GET\" && url.pathname === \"/\")\n return new Response(\"OK\", { status: 200 });\n\n if (req.method === \"GET\" && url.pathname === \"/email\")\n return html(renderToString(\n

{subject}

\n {welcomeEmail}\n

,\n ));\n\n const signature = req.headers.get(\"Stripe-Signature\");\n const body = await req.text();\n const webhookSecret = Deno.env.get(\"STRIPE_WEBHOOK_SECRET\");\n let event;\n try {\n event = await stripe.webhooks.constructEventAsync(\n body,\n signature,\n webhookSecret,\n );\n } catch (err: any) {\n return new Response(`Webhook Error: ${err.message}`, { status: 400 });\n }\n\n console.log(event);\n\n const newSubscription = event.data.previous_attributes.status === \"incomplete\"\n && event.data.object.status === \"active\";\n\n if (!newSubscription) {\n console.log(\"Not a new subscription\");\n console.log(event.data.previous_attributes.status, event.data.object.status);\n return Response.json(\"ok\");\n }\n\n const customer = await getStripeCustomer(event.data.object.customer);\n const customerEmail = customer.email;\n\n console.log(\"New subscription\", customerEmail);\n discordWebhook({\n url: Deno.env.get(\"discordUserEvents\"),\n content: `New Subscription 🥳 ${customerEmail}`,\n });\n\n await email({\n to: customerEmail,\n subject,\n html: renderToString(welcomeEmail),\n from: { name: \"Steve Krouse\", email: \"stevekrouse.company@valtown.email\" },\n replyTo: { name: \"Steve Krouse\", email: \"steve@val.town\" },\n cc: { name: \"Team\", email: \"team@val.town\" },\n });\n\n return Response.json(\"ok\");\n};","/** @jsxImportSource https://esm.sh/react */\nimport { micromark } from \"https://esm.sh/micromark@3\";\nimport { email } from \"https://esm.town/v/std/email?v=11\";\nimport { discordWebhook } from \"https://esm.town/v/stevekrouse/discordWebhook\";\nimport { html } from \"https://esm.town/v/stevekrouse/html\";\nimport { renderToString } from \"npm:react-dom/server\";\nimport Stripe from \"npm:stripe\";\n\nconst stripe = new Stripe(Deno.env.get(\"stripe_sk_customer_readonly\") as string, {\n apiVersion: \"2020-08-27\",\n});\n\nfunction getStripeCustomer(customerId: string) {\n return stripe.customers.retrieve(customerId);\n}\n\n// const subject = \"Welcome to Val Town Pro\";\n// const welcomeEmail = (\n//

\n//

\n// Thank you for subscribing to Val Town Pro!\n//

\n//

\n// You now have higher limits across the board, allowing you to run your vals in production. Your subscription also\n// includes custom domains, smarter Townie, and{\" \"}lots more.\n//

\n// {\n// /*

\n// TODO - advirtise a val or two\n// One of my favorite vals that's only only available to Pro users\n// is this Twitter alert.\n//

*/\n// }\n//

\n// If you have any issues, please ask on Discord{\" \"}\n// (in #general) and we'll respond right away.\n//

\n//

\n// This is an automated email – powered by a val\n// {\" \"}\n// – but replies reach my inbox directly. I'd love to hear from you!\n//

\n//

Best,

\n//

Steve

\n//

Val Town | Co-Founder

\n//

\n// );\n\nexport let newStripeEvent = async (req: Request) => {\n const url = new URL(req.url);\n if (req.method === \"GET\" && url.pathname === \"/\")\n return new Response(\"OK\", { status: 200 });\n\n // if (req.method === \"GET\" && url.pathname === \"/email\")\n // return html(renderToString(\n //

\n //

{subject}

\n // {welcomeEmail}\n //

,\n // ));\n\n const signature = req.headers.get(\"Stripe-Signature\");\n const body = await req.text();\n const webhookSecret = Deno.env.get(\"STRIPE_WEBHOOK_SECRET\");\n let event;\n try {\n event = await stripe.webhooks.constructEventAsync(\n body,\n signature,\n webhookSecret,\n );\n } catch (err: any) {\n return new Response(`Webhook Error: ${err.message}`, { status: 400 });\n }\n\n console.log(event);\n\n const newSubscription = event.data.previous_attributes.status === \"incomplete\"\n && event.data.object.status === \"active\";\n\n if (!newSubscription) {\n console.log(\"Not a new subscription\");\n console.log(event.data.previous_attributes.status, event.data.object.status);\n return Response.json(\"ok\");\n }\n\n const customer = await getStripeCustomer(event.data.object.customer);\n const customerEmail = customer.email;\n\n console.log(\"New subscription\", customerEmail);\n discordWebhook({\n url: Deno.env.get(\"discordUserEvents\"),\n content: `New Subscription 🥳 ${customerEmail}`,\n });\n\n // await email({\n // to: customerEmail,\n // subject,\n // html: renderToString(welcomeEmail),\n // from: { name: \"Steve Krouse\", email: \"stevekrouse.company@valtown.email\" },\n // replyTo: { name: \"Steve Krouse\", email: \"steve@val.town\" },\n // cc: { name: \"Team\", email: \"team@val.town\" },\n // });\n\n return Response.json(\"ok\");\n};","createdAt",["D",1737660979653],"branchVersion","branchId","4dd3c75a-2523-11f0-b0e0-569c3dd06744","id","4dd38718-2523-11f0-b0e0-569c3dd06744","insightfulBrownAnt",["D",1745949400826],"deletedAt","legacyEnvVars",true,"privacy","public","httpPrivacy","description","imageUrl","c156eb0e-8b9d-4104-a055-502e9a0eb441","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount",0,"orgId","2019e55b-c541-4c51-bef0-008eef10ef88","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_97":96,"_104":100},"org",{"_97":96,"_98":-5,"_99":100,"_18":55,"_101":102,"_103":25},"branch",{"_13":14,"_32":84,"_43":42,"_85":44,"_86":87,"_88":61,"_89":51,"_90":91,"_92":93,"_94":45,"_95":96},"isOwned","main","projectId","forkedBranchId","3aea1a96-1bcc-11f0-a237-569c3dd06744","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","3ae9b952-1bcc-11f0-a237-569c3dd06744","forkedProjectOrgId","e81e7335-6d4c-4764-a902-d0962bbfa9f7","projectName","userHandle","charmaine","handle","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvdXBsb2FkZWQvaW1nXzJ4cFpFME5pSXNZamJNd296dlZSYVJ0OVF1RSJ9","tier","pro","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_43":44,"_32":45,"_38":174,"_47":-5,"_48":49,"_50":51,"_52":51,"_53":-5,"_54":-5,"_18":55,"_56":31,"_57":49,"_58":-5,"_59":-5,"_60":61,"_62":63,"_64":-5,"_65":-5,"_66":-5,"_67":-5,"_68":69,"_70":69,"_71":72,"_73":72,"_74":72,"_75":69,"_76":69,"_77":175,"_79":176,"_81":177,"_83":25},"tree",[165,166],"files",[165,166],"counts",{"_155":61,"_156":146,"_157":61,"_158":159,"_160":161},"contents",[140,141],"upstreamProject",{"_43":91,"_32":136,"_53":137,"_54":-5,"_50":51,"_77":138},"upstreamBranch",{"_43":87,"_38":129,"_130":131,"_32":84,"_85":91,"_13":132,"_86":-5,"_88":-5,"_133":134,"_47":-5,"_83":25,"_50":51,"_95":135,"_62":93,"_94":136},"emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},["D",1744922442411],"updatedAt",["D",1744922480635],77,"lockfileKey","1744922481151-esm.town_v_stevekrouse_newStripeSubscriber@77-main","stevekrouse","newStripeSubscriber","Notify the Val Town team when we get new subscribers",{"_97":135,"_104":139},"https://images.clerk.dev/uploaded/img_2PqHa2Gsy93xQrjh2w78Xu0cChW.jpeg",{"_43":149,"_32":150,"_30":151,"_143":-5,"_41":42,"_40":146,"_144":49,"_38":152,"_13":61,"_33":20,"_35":153,"_24":25,"_147":-5,"_27":154},{"_43":142,"_32":28,"_30":31,"_143":-5,"_41":42,"_40":14,"_144":49,"_38":145,"_13":146,"_33":34,"_35":37,"_24":25,"_147":-5,"_27":148},"4dda6aa6-2523-11f0-b0e0-569c3dd06744","parentId","latest",["D",1737660979653],1,"label",[28],"4dd5986e-2523-11f0-b0e0-569c3dd06744","README.md","4dd5990e-2523-11f0-b0e0-569c3dd06744",["D",1737660879209],"# New Stripe Subscription Handler\n\nThis val processes new Stripe subscribers to Val Town Pro. It sends our team\na Discord notifcation and sends a welcome email to the new subscriber. It takes a couple of \nsteps if you'd like to set up something similar for your own Stripe account.\n\n## Setup\n\n1. Fork this HTTP val\n2. [Create a new webhook in Stripe](https://dashboard.stripe.com/webhooks/create)\n3. Add your val's HTTP endpoint URL into the Stripe webhook\n4. Select `customer.subscription.updated` as the only event to listen to (more on this below)\n5. Add your `stripe_sk_customer_readonly` to your [Val Town Env Variables](https://www.val.town/settings/environment-variables)\n6. Add your webhook's signing secret as `STRIPE_WEBHOOK_SECRET` to you [Val Town Env Variables](https://www.val.town/settings/environment-variables)\n\n## How the code is structured\n\n1. Verifies the signature to make sure it's really from Stripe\n2. Filters out only newly created subscriptions\n3. Sends off the Discord message & email\n \n## Which Stripe event type to listen to\n\nStripe sends webhooks for many different kinds of events. Relevant for us here are:\n\n* `customer.subscription.created` (what we used to listen for)\n* `customer.subscription.updated` (what we're currently listening for)\n\nThe issue with `customer.subscription.created` is that it triggers too early,\nbefore the user's payment actually goes through. This is a problem\nbecause in early Nov 2024 we started getting credit card fraudsters\ntesting cards using our service. We started getting lots of notifications\nfor new subscriptions that never actually became active.\n\nNote: if anyone knows good ways to prevent that sort of behavior at \nthe root, please let me know by commenting on this val!\n\nIn order to only get notified on a valid subscription, we now subscribe\nto `customer.subscription.updated`. This event happens on any subscription change,\nincluding renewals and cancellations, so now we have to filter those events\nto only get new subscriptions, ie where:\n\n```ts\nevent.data.previous_attributes.status === 'incomplete' && event.data.object.status === 'active'\n```\n",[150],"pulls","branches","forks","envVars",{"_162":61,"_164":61},"connections",{"_162":61,"_163":61},"count","unfilledCount","emptyCount",{"_43":149,"_32":150,"_30":151,"_143":-5,"_41":42,"_40":146,"_144":49,"_38":171,"_13":61,"_33":20,"_35":153,"_24":25,"_147":-5,"_168":172,"_27":173},{"_43":142,"_32":28,"_30":31,"_143":-5,"_41":42,"_40":14,"_144":49,"_38":167,"_13":146,"_33":34,"_35":37,"_24":25,"_147":-5,"_168":169,"_27":170},["D",1737660979653],"children",[],[28],["D",1737660879209],[],[150],["D",1745949400826],{"_97":96,"_104":100},{"_97":96,"_98":-5,"_99":100,"_18":55,"_101":102,"_103":25},{"_13":14,"_32":84,"_43":42,"_85":44,"_86":87,"_88":61,"_89":51,"_90":91,"_92":93,"_94":45,"_95":96},"ctx",{"_77":-5,"_126":211,"_212":213,"_214":215,"_216":25,"_217":25,"_218":25,"_219":49,"_220":-5,"_221":-7,"_222":-7,"_223":61,"_224":25,"_225":25,"_226":-5,"_227":25,"_228":25,"_229":25,"_230":-5},"ENV",{"_182":183,"_184":185,"_186":84,"_187":188,"_189":190,"_191":192,"_193":194,"_195":196,"_197":198,"_199":200,"_201":202,"_203":204,"_205":206,"_207":208,"_209":210},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e8c4b7030cb7600e4eb0736b15f422c8b8bd130f","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 · v2