Wanna be the gummy to my bear this valentines? 💘

\n\n

\n \n Yes\n \n\n \n {noClicks === 0\n ? \"No\"\n : NO_PHRASES[Math.min(noClicks - 1, NO_PHRASES.length - 1)]}\n \n

\n \n )\n : (\n <>\n

\n \n Yay!!! 💖🎉\n \n \n )}\n \n );\n}\n\n// client mount\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") client();\n\n// single export (required by runtime)\nexport async function server(_request) {\n return new Response(\n `\n \n \n Valentine\n \n \n \n

\n \n \n \n `,\n { headers: { \"content-type\": \"text/html\" } },\n );\n}","deleted","label",[65],"751536ae-07d7-11f1-b534-42dde27851f2","main-copy.tsx","7515374e-07d7-11f1-b534-42dde27851f2",6,["D",1770875738883],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport React, { useState } from \"https://esm.sh/react@18.2.0\";\n\nconst NO_PHRASES = [\n \"No 💔\",\n \"misclick? 🥺\",\n \"it would be fun? 💕\",\n \"One more chance, little one?\",\n \"you're killing me smalls :(\",\n \"What about a maybe?\",\n \"so I guess you really do hate me...\",\n];\n\nfunction App() {\n const [noClicks, setNoClicks] = useState(0);\n const [isValentine, setIsValentine] = useState(false);\n const yesButtonSize = (noClicks * 20) + 16;\n\n const firstImg =\n \"https://tenor.com/view/bear-happy-bear-gummy-gummybear-gif-18349997625432958136.gif\";\n const secondImg =\n \"https://media2.giphy.com/media/v1.Y2lkPTc5MGI3NjExZmF4MmdlNmRmeTJrbWxraWxrdHhndzM5enN5dGQ3YTR2eTVwZG1zNyZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9Zw/hwGxQwiQGp8xKe5KlZ/giphy.gif\";\n\n const handleNo = () => {\n setNoClicks((prev) => prev + 1);\n };\n\n const handleYes = () => {\n setIsValentine(true);\n };\n\n return (\n \n {!isValentine\n ? (\n <>\n

Wanna be the gummy to my bear this valentines? 💘

\n \n Yes\n \n \n {noClicks === 0\n ? \"No\"\n : NO_PHRASES[Math.min(noClicks - 1, NO_PHRASES.length - 1)]}\n \n

\n \n )\n : (\n <>\n

\n \n Yay!!! 💖🎉\n \n \n )}\n \n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") client();\n\nexport default async function server(request: Request): Promise {\n return new Response(\n `\n \n \n Valentine's Day Invitation\n \n \n \n \n

\n \n \n \n \n `,\n {\n headers: { \"content-type\": \"text/html\" },\n },\n );\n}",[85],"e03ee51a-089f-11f1-92b8-42dde27851f2","main-copy-copy.tsx","924d12f6-07e0-11f1-bc2e-42dde27851f2",48,["D",1770961818011],25,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport React, { useMemo, useState } from \"https://esm.sh/react@18.2.0\";\n\nconst NO_PHRASES = [\n \"No 💔\",\n \"misclick? 🥺\",\n \"it would be fun? 💕\",\n \"One more chance, little one?\",\n \"you're killing me smalls :(\",\n \"What about a maybe?\",\n \"so I guess you really do hate me...\",\n];\n\n// --- \"database\" (in-memory, resets when server restarts) ---\nlet LAST_MORE_FUN_ANSWER = null;\n\nfunction App() {\n const [noClicks, setNoClicks] = useState(0);\n const [isValentine, setIsValentine] = useState(false);\n\n // post-yay flow\n const [showMoreFun, setShowMoreFun] = useState(false);\n const [moreFunAnswer, setMoreFunAnswer] = useState(null);\n\n const yesButtonSize = (noClicks * 20) + 16;\n\n const firstImg =\n \"https://media1.tenor.com/m/_qhJni0xZLgAAAAd/bear-happy-bear.gif\";\n\n const secondImg =\n \"https://media2.giphy.com/media/v1.Y2lkPTc5MGI3NjExZmF4MmdlNmRmeTJrbWxraWxrdHhndzM5enN5dGQ3YTR2eTVwZG1zNyZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9Zw/hwGxQwiQGp8xKe5KlZ/giphy.gif\";\n\n const noGifs = [\n \"https://media1.tenor.com/m/vIH9BTHtXrUAAAAd/kermit-awkward.gif\",\n \"https://media1.tenor.com/m/w5H55vvWMXcAAAAd/misclick-missclick.gif\",\n \"https://media3.giphy.com/media/v1.Y2lkPTc5MGI3NjExMHE3Y2JoNHgzZG9tMHhubGY4M3Axa2NrOHMxODJmOWpscDFqc3dtbiZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9Zw/LBgmyXjkls7gZ3ReTp/giphy.gif\",\n \"https://tenor.com/view/kermit-falling-building-fall-woodz-gif-24715383.gif\",\n \"https://media1.tenor.com/m/wW2Z4kinzq8AAAAC/new-girl-youre-killing-me.gif\",\n \"https://media1.tenor.com/m/Avyq7feg8KgAAAAC/shrek-shrek-rizz.gif\",\n \"https://media1.tenor.com/m/i-V_gdCGL8wAAAAC/so-basically-you-hate-me.gif\",\n ];\n\n // more fun question + gif\n const moreFunGif =\n \"https://tenor.com/view/dog-meme-dog-ok-gif-2175077287507951640.gif\";\n const moreFunQuestion = \"When do I get to gummy your bear? 😋🍬\";\n\n const handleNo = () => setNoClicks((prev) => prev + 1);\n const handleYes = () => setIsValentine(true);\n\n const currentNoGif = useMemo(() => {\n if (noClicks <= 0) return null;\n return noGifs[Math.min(noClicks - 1, noGifs.length - 1)];\n }, [noClicks]);\n\n async function submitMoreFunAnswer(answer) {\n setMoreFunAnswer(answer);\n\n try {\n await fetch(\"/answer\", {\n method: \"POST\",\n headers: { \"content-type\": \"application/json\" },\n body: JSON.stringify({\n answer,\n at: new Date().toISOString(),\n }),\n });\n } catch (_e) {}\n }\n\n return (\n \n {!isValentine\n ? (\n <>\n

Wanna be the gummy to my bear this valentines? 💘

\n\n

\n \n Yes\n \n\n \n {noClicks === 0\n ? \"No\"\n : NO_PHRASES[Math.min(noClicks - 1, NO_PHRASES.length - 1)]}\n \n

\n \n )\n : (\n <>\n {!showMoreFun\n ? (\n <>\n

\n \n Yay!!! 💖🎉\n \n\n {\n setShowMoreFun(true);\n setMoreFunAnswer(null); // reset if they revisit\n }}\n style={{\n position: \"fixed\",\n bottom: \"16px\",\n left: \"50%\",\n transform: \"translateX(-50%)\",\n backgroundColor: \"red\",\n color: \"white\",\n border: \"none\",\n borderRadius: \"999px\",\n padding: \"10px 14px\",\n cursor: \"pointer\",\n fontSize: \"14px\",\n }}\n >\n more fun\n \n \n )\n : (\n <>\n

{moreFunQuestion}

\n\n {moreFunAnswer === null\n ? (\n

\n \n submitMoreFunAnswer(\n \"next time I see you duh! but BRING EDIBLES 😇\",\n )}\n style={{\n margin: \"10px\",\n padding: \"10px 20px\",\n backgroundColor: \"green\",\n color: \"white\",\n border: \"none\",\n borderRadius: \"8px\",\n cursor: \"pointer\",\n fontSize: \"18px\",\n }}\n >\n next time I see you duh! but BRING EDIBLES 😇\n \n\n \n submitMoreFunAnswer(\n \"EW NO! GET AWAY CREEP! jk ill lyk 😤\",\n )}\n style={{\n margin: \"10px\",\n padding: \"10px 20px\",\n backgroundColor: \"red\",\n color: \"white\",\n border: \"none\",\n borderRadius: \"8px\",\n cursor: \"pointer\",\n fontSize: \"18px\",\n }}\n >\n EW NO! GET AWAY CREEP! jk ill lyk 😤\n \n

\n )\n : (\n

\n You answered: {moreFunAnswer}\n \n (Also saved on the server. Visit /admin{\" \"}\n to see it.)\n

\n \n )}\n \n )}\n \n )}\n \n );\n}\n\n// client mount\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") client();\n\n// single export (required by runtime)\nexport async function server(request) {\n const url = new URL(request.url);\n\n // Save answer\n if (url.pathname === \"/answer\" && request.method === \"POST\") {\n try {\n const data = await request.json();\n LAST_MORE_FUN_ANSWER = data; // { answer, at }\n return new Response(JSON.stringify({ ok: true }), {\n headers: { \"content-type\": \"application/json\" },\n });\n } catch (_e) {\n return new Response(JSON.stringify({ ok: false }), {\n status: 400,\n headers: { \"content-type\": \"application/json\" },\n });\n }\n }\n\n // View answer\n if (url.pathname === \"/admin\") {\n return new Response(\n `\n \n \n Admin\n \n \n \n \n

Last “More fun” answer

${\n        LAST_MORE_FUN_ANSWER\n          ? escapeHtml(JSON.stringify(LAST_MORE_FUN_ANSWER, null, 2))\n          : \"No answer yet.\"\n      }

Note: this resets if the server restarts.

\n \n \n `,\n { headers: { \"content-type\": \"text/html\" } },\n );\n }\n\n // App shell\n return new Response(\n `\n \n \n Valentine\n \n \n \n

\n \n \n \n `,\n { headers: { \"content-type\": \"text/html\" } },\n );\n}\n\nfunction escapeHtml(str) {\n return String(str)\n .replaceAll(\"&\", \"&\")\n .replaceAll(\"<\", \"<\")\n .replaceAll(\">\", \">\")\n .replaceAll('\"', \""\")\n .replaceAll(\"'\", \"'\");\n}",[92],"4d145dfe-07d4-11f1-ad15-42dde27851f2","README.md","019c5056-abac-7059-9b9f-33e3832a729d",["D",1770874383219],"Hello!!! \n\nFeel free to mess around with this val and make it your own :). Just click on \"Fork\" in the top right.\n\nYou can change the phrases that show up as you click no, you can change the firstImg and secondImg, maybe even add more images. And you can also change the colors and any of the text on the screen!\n\nHave fun with it and hopefully your crush says yes hehe.",[100],{"_35":99,"_13":100,"_66":101,"_68":-5,"_69":70,"_71":43,"_73":74,"_37":119,"_17":33,"_77":24,"_79":103,"_81":52,"_82":-5,"_110":120,"_18":121},{"_35":91,"_13":92,"_66":93,"_68":-5,"_69":70,"_71":94,"_73":74,"_37":116,"_17":96,"_77":78,"_79":97,"_81":52,"_82":-5,"_110":117,"_18":118},{"_35":84,"_13":85,"_66":86,"_68":-5,"_69":70,"_71":87,"_73":74,"_37":113,"_17":33,"_77":78,"_79":89,"_81":52,"_82":-5,"_110":114,"_18":115},{"_35":64,"_13":65,"_66":67,"_68":-5,"_69":70,"_71":72,"_73":74,"_37":109,"_17":76,"_77":78,"_79":80,"_81":52,"_82":-5,"_110":111,"_18":112},["D",1770878612832],"children",[],[65],["D",1770875738883],[],[85],["D",1770961818011],[],[92],["D",1770874383219],[],[100],"4d0bdab2-07d4-11f1-ad15-42dde27851f2",["D",1770874383219],"legacyEnvVars","httpPrivacy","description","imageUrl","userId","019c5053-e020-72b9-99ba-b3fe122d90a4","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_11":12,"_163":159},"org",{"_11":12,"_157":-5,"_158":159,"_128":129,"_160":161,"_162":52},"branch",{"_17":94,"_13":16,"_35":70,"_41":122,"_44":36,"_46":43,"_154":54,"_155":42,"_156":57,"_58":14,"_55":12},"forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoiZGVmYXVsdCIsImlpZCI6Imluc18yTm10cGhQUklwU0tqZHNiOHNnNGd2ZjJURFUiLCJyaWQiOiJ1c2VyXzM5WVh0SktTWkRLSlc5U3FwUVFmYnZxaFpxdSJ9","tier","free","canRestrictVals","profileImageUrl","adoptOrgId",{"_35":122,"_13":14,"_37":216,"_50":-5,"_124":52,"_53":54,"_125":54,"_126":-5,"_127":-5,"_128":129,"_130":67,"_131":74,"_132":-5,"_133":-5,"_134":43,"_56":57,"_135":-5,"_136":-5,"_137":-5,"_138":-5,"_139":140,"_141":140,"_142":143,"_144":143,"_145":143,"_146":140,"_147":140,"_148":217,"_150":218,"_152":219,"_51":52},[204,205,206,207],"files",[204,205,206,207],"counts",{"_195":33,"_196":43,"_197":33,"_34":198,"_199":200},[187,188,189,190],"upstreamProject",{"_35":42,"_13":59,"_126":-5,"_127":-5,"_53":54,"_148":186},"upstreamBranch",{"_35":36,"_37":184,"_39":185,"_13":16,"_41":42,"_17":43,"_44":45,"_46":47,"_48":49,"_50":-5,"_51":52,"_53":54,"_55":12,"_56":57,"_58":59},"emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},["D",1770874360580],["D",1770874360580],{"_11":12,"_163":159},{"_35":99,"_13":100,"_66":101,"_68":-5,"_69":70,"_71":43,"_73":74,"_37":102,"_17":33,"_77":24,"_79":103,"_81":52,"_82":-5,"_18":194},{"_35":91,"_13":92,"_66":93,"_68":-5,"_69":70,"_71":94,"_73":74,"_37":95,"_17":96,"_77":78,"_79":97,"_81":52,"_82":-5,"_18":193},{"_35":84,"_13":85,"_66":86,"_68":-5,"_69":70,"_71":87,"_73":74,"_37":88,"_17":33,"_77":78,"_79":89,"_81":52,"_82":-5,"_18":192},{"_35":64,"_13":65,"_66":67,"_68":-5,"_69":70,"_71":72,"_73":74,"_37":75,"_17":76,"_77":78,"_79":80,"_81":52,"_82":-5,"_18":191},[65],[85],[92],[100],"pulls","branches","forks",{"_201":33,"_203":33},"connections",{"_201":33,"_202":33},"count","unfilledCount","emptyCount",{"_35":99,"_13":100,"_66":101,"_68":-5,"_69":70,"_71":43,"_73":74,"_37":119,"_17":33,"_77":24,"_79":103,"_81":52,"_82":-5,"_110":214,"_18":215},{"_35":91,"_13":92,"_66":93,"_68":-5,"_69":70,"_71":94,"_73":74,"_37":116,"_17":96,"_77":78,"_79":97,"_81":52,"_82":-5,"_110":212,"_18":213},{"_35":84,"_13":85,"_66":86,"_68":-5,"_69":70,"_71":87,"_73":74,"_37":113,"_17":33,"_77":78,"_79":89,"_81":52,"_82":-5,"_110":210,"_18":211},{"_35":64,"_13":65,"_66":67,"_68":-5,"_69":70,"_71":72,"_73":74,"_37":109,"_17":76,"_77":78,"_79":80,"_81":52,"_82":-5,"_110":208,"_18":209},[],[65],[],[85],[],[92],[],[100],["D",1770874383219],{"_11":12,"_163":159},{"_11":12,"_157":-5,"_158":159,"_128":129,"_160":161,"_162":52},{"_17":94,"_13":16,"_35":70,"_41":122,"_44":36,"_46":43,"_154":54,"_155":42,"_156":57,"_58":14,"_55":12},"ctx",{"_148":-5,"_181":253,"_254":255,"_256":257,"_258":52,"_259":52,"_260":52,"_261":74,"_262":-5,"_263":-7,"_264":-7,"_265":33,"_266":52,"_267":52,"_268":-5,"_269":52,"_270":52,"_271":52,"_272":-5},"ENV",{"_224":225,"_226":227,"_228":16,"_229":230,"_231":232,"_233":234,"_235":236,"_237":238,"_239":240,"_241":242,"_243":244,"_245":246,"_247":248,"_249":250,"_251":252},"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"]

Code