[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_151":152,"_153":154},"routes/_app.x.$handle.$name",{"_94":93,"_32":45,"_103":84,"_27":36,"_13":14,"_104":-5,"_11":105,"_106":107,"_108":109,"_110":111,"_112":113,"_20":-5,"_114":-5,"_115":-5,"_116":25,"_117":118,"_119":25,"_120":-5,"_121":-5,"_122":123},"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":25,"_49":50,"_51":50,"_52":36,"_53":-5,"_18":54,"_55":-5,"_56":25,"_57":-5,"_58":-5,"_59":60,"_61":62,"_63":-5,"_64":-5,"_65":-5,"_66":-5,"_67":68,"_69":68,"_70":71,"_72":71,"_73":71,"_74":68,"_75":68,"_76":77,"_78":79,"_80":81,"_82":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.ts","latestPath","fileId","d6112ae6-5569-11f1-b986-ee650bb23af1","name","fileType","script","content","","import React, { useMemo, useState } from \"react\";\nimport { AnimatePresence, motion } from \"framer-motion\";\nimport {\n Coffee,\n Gift,\n Heart,\n MessageCircle,\n Music,\n Send,\n Smile,\n Sparkles,\n} from \"lucide-react\";\n\n/*\n EDIT THIS SECTION ONLY 👇\n Replace the placeholders with your real details.\n*/\nconst CONFIG = {\n yourName: \"Vashista\",\n herName: \"[Her Name]\",\n headline:\n \"I made this tiny website because talking to you feels worth the effort.\",\n subHeadline: \"No pressure. Just something fun, honest, and a little goofy.\",\n vibe: \"sweet\", // options: \"sweet\", \"funny\", \"confident\"\n favoriteInsideJoke: \"that one thing we both laughed about\",\n favoriteThingAboutHer:\n \"your smile and the way you make normal conversations feel fun\",\n coffeePlace: \"a cute coffee place\",\n dateIdea: \"coffee, a walk, or something chill where we can actually talk\",\n playlistTitle: \"Songs that made me think of you\",\n songs: [\n \"Golden Hour — JVKE\",\n \"Until I Found You — Stephen Sanchez\",\n \"Best Part — Daniel Caesar ft. H.E.R.\",\n \"Can I Call You Rose? — Thee Sacred Souls\",\n ],\n finalAsk: \"Would you like to hang out with me sometime?\",\n buttonYes: \"Yes, that sounds cute\",\n buttonMaybe: \"Maybe, but this site is adorable\",\n};\n\nconst vibeStyles = {\n sweet: {\n bg: \"from-rose-100 via-pink-50 to-orange-100\",\n card: \"bg-white/75\",\n accent: \"text-rose-600\",\n button: \"bg-rose-500 hover:bg-rose-600\",\n ring: \"ring-rose-200\",\n },\n funny: {\n bg: \"from-yellow-100 via-orange-50 to-pink-100\",\n card: \"bg-white/80\",\n accent: \"text-orange-600\",\n button: \"bg-orange-500 hover:bg-orange-600\",\n ring: \"ring-orange-200\",\n },\n confident: {\n bg: \"from-indigo-100 via-purple-50 to-pink-100\",\n card: \"bg-white/80\",\n accent: \"text-indigo-600\",\n button: \"bg-indigo-500 hover:bg-indigo-600\",\n ring: \"ring-indigo-200\",\n },\n};\n\nconst pages = [\n { id: \"hello\", label: \"Start\", icon: Sparkles },\n { id: \"reasons\", label: \"Why You\", icon: Heart },\n { id: \"playlist\", label: \"Playlist\", icon: Music },\n { id: \"invite\", label: \"Invite\", icon: Coffee },\n { id: \"surprise\", label: \"Surprise\", icon: Gift },\n];\n\nfunction FloatingHearts() {\n const hearts = useMemo(() =>\n Array.from({ length: 16 }, (_, i) => ({\n id: i,\n left: `${Math.random() * 100}%`,\n delay: Math.random() * 4,\n duration: 7 + Math.random() * 5,\n size: 14 + Math.random() * 18,\n })), []);\n\n return (\n

\n {hearts.map((heart) => (\n \n ♥\n \n ))}\n

\n );\n}\n\nfunction Shell({ children }) {\n const style = vibeStyles[CONFIG.vibe] || vibeStyles.sweet;\n return (\n \n \n

\n {children}\n

\n \n );\n}\n\nfunction Nav({ active, setActive }) {\n const style = vibeStyles[CONFIG.vibe] || vibeStyles.sweet;\n return (\n

\n {pages.map((page) => {\n const Icon = page.icon;\n const selected = active === page.id;\n return (\n setActive(page.id)}\n className={`flex items-center gap-2 rounded-full px-4 py-2 text-sm font-semibold transition ${\n selected\n ? `${style.button} text-white shadow-lg`\n : \"bg-white/70 text-slate-700 hover:bg-white\"\n }`}\n >\n \n {page.label}\n \n );\n })}\n

\n );\n}\n\nfunction Card({ children, className = \"\" }) {\n const style = vibeStyles[CONFIG.vibe] || vibeStyles.sweet;\n return (\n \n {children}\n \n );\n}\n\nfunction HelloPage() {\n const style = vibeStyles[CONFIG.vibe] || vibeStyles.sweet;\n return (\n \n

\n \n For {CONFIG.herName}\n

\n Hey {CONFIG.herName}, I made you a tiny website.\n

\n {CONFIG.headline}\n

{CONFIG.subHeadline}

\n \n made by {CONFIG.yourName}\n \n \n 100% handmade\n \n \n slightly nervous\n \n

\n \n

💌

Open when smiling

\n \n

\n \n );\n}\n\nfunction ReasonsPage() {\n const style = vibeStyles[CONFIG.vibe] || vibeStyles.sweet;\n const reasons = [\n `I like ${CONFIG.favoriteThingAboutHer}.`,\n `Talking to you never feels boring, even when we talk about random things.`,\n `You have main-character energy, but in a calm and real way.`,\n `Also, ${CONFIG.favoriteInsideJoke} still makes me laugh.`,\n ];\n\n return (\n \n

\n \n Tiny confession\n

\n A few reasons this website exists\n

\n {reasons.map((reason, index) => (\n \n \n {index + 1}\n

{reason}

\n \n ))}\n \n \n );\n}\n\nfunction PlaylistPage() {\n const style = vibeStyles[CONFIG.vibe] || vibeStyles.sweet;\n return (\n \n

\n \n \n mini playlist\n \n

{CONFIG.playlistTitle}

\n Not saying I overthought this, but I definitely overthought this.\n

\n \n

\n {CONFIG.songs.map((song, index) => (\n \n \n {index + 1}\n

{song}

\n \n ))}\n

\n \n \n );\n}\n\nfunction InvitePage() {\n const style = vibeStyles[CONFIG.vibe] || vibeStyles.sweet;\n const [answer, setAnswer] = useState(null);\n\n return (\n \n

\n \n \n The actual question\n

\n {CONFIG.finalAsk}\n

\n I was thinking {CONFIG.dateIdea}. Maybe{\" \"}\n {CONFIG.coffeePlace}. Simple, relaxed, and hopefully fun.\n

\n setAnswer(\"yes\")}\n className={`${style.button} inline-flex items-center justify-center gap-2 rounded-full px-6 py-3 font-bold text-white shadow-lg transition`}\n >\n \n {CONFIG.buttonYes}\n \n setAnswer(\"maybe\")}\n className=\"inline-flex items-center justify-center gap-2 rounded-full bg-white px-6 py-3 font-bold text-slate-700 shadow-lg transition hover:bg-slate-50\"\n >\n \n {CONFIG.buttonMaybe}\n \n

\n \n {answer && (\n \n {answer === \"yes\"\n ? (\n

\n Perfect. Screenshot this and send it to{\" \"}\n {CONFIG.yourName}. He is probably smiling at his phone right\n now.\n

\n )\n : (\n

\n Totally fair. No pressure at all. But the website is\n officially accepting compliments.\n

\n )}\n \n )}\n \n

\n \n );\n}\n\nfunction SurprisePage() {\n const style = vibeStyles[CONFIG.vibe] || vibeStyles.sweet;\n const [open, setOpen] = useState(false);\n\n return (\n \n

\n \n Final surprise\n

\n One last tiny thing\n

\n Click the mystery box. It is emotionally low-risk and technically\n adorable.\n

\n setOpen(!open)}\n className=\"mx-auto mt-8 block rounded-[2rem] bg-white p-8 shadow-xl transition hover:scale-105\"\n >\n \n {open ? \"🌷\" : \"🎁\"}\n \n \n \n {open && (\n \n

\n \n

\n I did not want to just say “hey” like a normal person. So I\n made this instead. But the real message is simple: I like\n talking to you, I think you are special, and I would like to\n know you better.\n

\n \n )}\n \n

\n \n );\n}\n\nexport default function CrushMicrosite() {\n const [active, setActive] = useState(\"hello\");\n\n const page = {\n hello: ,\n reasons: ,\n playlist: ,\n invite: ,\n surprise: ,\n }[active];\n\n return (\n \n

\n \n );\n}","createdAt",["D",1779404867040],"branchVersion","branchId","d60dedae-5569-11f1-b986-ee650bb23af1","id","d60d1c30-5569-11f1-b986-ee650bb23af1","Monica",["D",1779404847630],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","imageUrl","e942824e-9c75-49d7-a9fc-e50ef8d60da9","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount",0,"orgId","019e4cc9-d51d-7719-988d-6d8c0f3c4db4","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_94":93,"_102":98},"org",{"_94":93,"_95":96,"_97":98,"_18":54,"_99":100,"_101":25},"branch",{"_13":83,"_32":84,"_43":42,"_85":44,"_86":-5,"_87":-5,"_88":-5,"_89":-5,"_90":-5,"_91":45,"_92":93},"isOwned",30,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","Vashi","handle","displayName","Vashista Reddy Pisati","avatar","https://lh3.googleusercontent.com/a/ACg8ocLhCyMaWd_hgiDgqM3ea0dY48ycmqqR8B2MQJ4LN-htfXko2Q=s96-c","tier","free","canRestrictVals","profileImageUrl","branchName","adoptOrgId",{"_43":44,"_32":45,"_38":147,"_47":-5,"_48":25,"_49":50,"_51":50,"_52":36,"_53":-5,"_18":54,"_55":-5,"_56":25,"_57":-5,"_58":-5,"_59":60,"_61":62,"_63":-5,"_64":-5,"_65":-5,"_66":-5,"_67":68,"_69":68,"_70":71,"_72":71,"_73":71,"_74":68,"_75":68,"_76":148,"_78":149,"_80":150,"_82":25},"tree",[142],"files",[142],"counts",{"_132":60,"_133":129,"_134":60,"_135":136,"_137":138},"contents",[124],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_43":125,"_32":28,"_30":31,"_126":-5,"_41":42,"_40":14,"_127":25,"_38":128,"_13":129,"_33":34,"_35":37,"_24":25,"_130":-5,"_27":131},"e1afb9b2-5569-11f1-93e3-ee650bb23af1","parentId","latest",["D",1779404867040],1,"label",[28],"pulls","branches","forks","envVars",{"_139":60,"_141":60},"connections",{"_139":60,"_140":60},"count","unfilledCount","emptyCount",{"_43":125,"_32":28,"_30":31,"_126":-5,"_41":42,"_40":14,"_127":25,"_38":143,"_13":129,"_33":34,"_35":37,"_24":25,"_130":-5,"_144":145,"_27":146},["D",1779404867040],"children",[],[28],["D",1779404847630],{"_94":93,"_102":98},{"_94":93,"_95":96,"_97":98,"_18":54,"_99":100,"_101":25},{"_13":83,"_32":84,"_43":42,"_85":44,"_86":-5,"_87":-5,"_88":-5,"_89":-5,"_90":-5,"_91":45,"_92":93},"ctx",{"_76":-5,"_121":184,"_185":186,"_187":188,"_189":25,"_190":25,"_191":25,"_192":193,"_194":-5,"_195":-7,"_196":-7,"_197":60,"_198":25,"_199":25,"_200":-5,"_201":25,"_202":25,"_203":25,"_204":-5},"ENV",{"_155":156,"_157":158,"_159":84,"_160":161,"_162":163,"_164":165,"_166":167,"_168":169,"_170":171,"_172":173,"_174":175,"_176":177,"_178":179,"_180":181,"_182":183},"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",true,"preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Diff · v2