[{"_1":2,"_175":-5,"_176":-5},"loaderData",{"_3":4,"_91":92,"_162":163,"_174":-5},"root",{"_5":6,"_32":33,"_58":59,"_89":90},"ctx",{"_7":8,"_18":19,"_20":-5,"_21":22,"_23":24,"_25":26,"_27":26,"_28":29,"_30":31},"auth",{"_9":-5,"_10":-5,"_11":-5,"_12":-5,"_13":-5,"_14":-5,"_15":-5,"_16":-5,"_17":-5},"sessionClaims","sessionId","userId","actor","orgId","orgRole","orgSlug","orgPermissions","factorVerificationAge","environmentVariableKeys",[],"user","preferences_keybindings","default","preferences_theme","light","preferences_fixers",false,"preferences_copilot","preferences_model","claude-3-5-haiku-20241022","notification_count",0,"ENV",{"_34":35,"_36":37,"_38":39,"_40":41,"_42":43,"_44":45,"_46":47,"_48":49,"_50":51,"_52":53,"_54":55,"_56":57},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","VAL_RUNTIME_NAME","prod","RENDER_GIT_COMMIT","e0489e7a699ffd54eb05407c777726bbdb4b433c","RENDER_GIT_BRANCH","main","CLERK_PUBLISHABLE_KEY","pk_live_Y2xlcmsudmFsLnRvd24k","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","API_URL","https://api.val.town","WORKER_FINGERPRINT","d0746fd0512e0614e3f717607f0da4cd","clerkState",{"_60":61},"__internal_clerk_state",{"_62":63,"_64":43,"_65":66,"_67":66,"_68":26,"_69":66,"_70":66,"_71":66,"_72":66,"_73":66,"_74":66,"_75":66,"_76":66,"_77":78,"_87":26,"_88":26},"__clerk_ssr_state",{"_9":-5,"_10":-5,"_11":-5,"_12":-5,"_13":-5,"_14":-5,"_15":-5,"_16":-5,"_17":-5},"__publishableKey","__proxyUrl","","__domain","__isSatellite","__signInUrl","__signUpUrl","__afterSignInUrl","__afterSignUpUrl","__signInForceRedirectUrl","__signUpForceRedirectUrl","__signInFallbackRedirectUrl","__signUpFallbackRedirectUrl","__clerk_debug",{"_79":26,"_80":66,"_81":82,"_83":66,"_84":43,"_85":26,"_86":66},"isSignedIn","proxyUrl","reason","session-token-and-uat-missing","message","publishableKey","isSatellite","domain","__telemetryDisabled","__telemetryDebug","remixVersion",2,"routes/_app.v.$handle.$name",{"_93":94,"_95":96,"_94":97,"_157":-5,"_158":-5,"_159":160,"_128":129,"_136":137,"_100":101,"_98":99,"_117":-7,"_50":51,"_161":26},"type","val","author","418c1e39-eb48-4f2f-8c97-122ece94631c",{"_98":99,"_95":96,"_100":101,"_102":-5,"_103":-5,"_104":105,"_106":-5,"_107":108,"_109":110,"_111":26,"_112":110,"_113":114,"_115":116,"_117":118,"_119":26,"_120":31,"_121":31,"_122":31,"_123":90,"_124":31,"_125":31,"_126":-5,"_20":127,"_132":-5,"_133":-7,"_134":135,"_136":137,"_138":139},"name","emojiTodoListApp","valNameId","ea02b108-da6f-11ef-88a8-e6cdfca9ef9f","parentFolderId","isOwned","privacy","public","readme","valType","http","currentVersion","90743342-da73-11ef-b207-e6cdfca9ef9f","legacyPrivate","id","code","/** @jsxImportSource https://esm.sh/react */\nimport React, { useEffect, useState } from \"https://esm.sh/react\";\nimport { createRoot } from \"https://esm.sh/react-dom/client\";\nimport { lockfileImportMap } from \"https://esm.town/v/maxm/lockfileImportMap\";\n\nfunction App() {\n const [todos, setTodos] = useState([]);\n const [newTodo, setNewTodo] = useState(\"\");\n\n useEffect(() => {\n fetchTodos();\n }, []);\n\n const fetchTodos = async () => {\n const response = await fetch(\"/todos\");\n const data = await response.json();\n setTodos(data);\n };\n\n const addTodo = async (e) => {\n e.preventDefault();\n if (!newTodo.trim()) return;\n await fetch(\"/todos\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ content: newTodo }),\n });\n setNewTodo(\"\");\n fetchTodos();\n };\n\n const toggleTodo = async (id) => {\n await fetch(`/todos/${id}`, { method: \"PATCH\" });\n fetchTodos();\n };\n\n const deleteTodo = async (id) => {\n await fetch(`/todos/${id}`, { method: \"DELETE\" });\n fetchTodos();\n };\n\n return (\n

✨📝 Emojified Todo List 📝✨

\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 const { sqlite } = await import(\"https://esm.town/v/stevekrouse/sqlite\");\n const SCHEMA_VERSION = 1;\n const KEY = new URL(import.meta.url).pathname.split(\"/\").at(-1);\n\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS ${KEY}_todos_${SCHEMA_VERSION} (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n content TEXT NOT NULL,\n completed BOOLEAN NOT NULL DEFAULT 0\n )\n `);\n\n const url = new URL(request.url);\n const path = url.pathname;\n\n if (path === \"/todos\" && request.method === \"GET\") {\n const todos = await sqlite.execute(`SELECT * FROM ${KEY}_todos_${SCHEMA_VERSION} ORDER BY id DESC`);\n return new Response(JSON.stringify(todos.rows), { headers: { \"Content-Type\": \"application/json\" } });\n }\n\n if (path === \"/todos\" && request.method === \"POST\") {\n const { content } = await request.json();\n await sqlite.execute(`INSERT INTO ${KEY}_todos_${SCHEMA_VERSION} (content) VALUES (?)`, [content]);\n return new Response(null, { status: 201 });\n }\n\n if (path.startsWith(\"/todos/\") && request.method === \"PATCH\") {\n const id = path.split(\"/\")[2];\n await sqlite.execute(`UPDATE ${KEY}_todos_${SCHEMA_VERSION} SET completed = NOT completed WHERE id = ?`, [id]);\n return new Response(null, { status: 200 });\n }\n\n if (path.startsWith(\"/todos/\") && request.method === \"DELETE\") {\n const id = path.split(\"/\")[2];\n await sqlite.execute(`DELETE FROM ${KEY}_todos_${SCHEMA_VERSION} WHERE id = ?`, [id]);\n return new Response(null, { status: 200 });\n }\n\n return new Response(\n `\n \n \n ✨📝 Emojified Todo List 📝✨\n \n \n \n \n \n

\n \n \n 👀 View Source\n \n \n `,\n {\n headers: {\n \"content-type\": \"text/html\",\n },\n },\n );\n}\n\nconst css = `\nbody {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n background-color: #f0f8ff;\n margin: 0;\n padding: 20px;\n display: flex;\n justify-content: center;\n}\n\n.container {\n background-color: white;\n border-radius: 10px;\n padding: 20px;\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n max-width: 500px;\n width: 100%;\n}\n\nh1 {\n text-align: center;\n color: #4a4a4a;\n margin-bottom: 20px;\n}\n\n.add-todo-form {\n display: flex;\n margin-bottom: 20px;\n}\n\n.new-todo-input {\n flex-grow: 1;\n padding: 10px;\n font-size: 16px;\n border: 2px solid #ddd;\n border-radius: 5px 0 0 5px;\n}\n\n.add-button {\n padding: 10px 15px;\n font-size: 16px;\n background-color: #4CAF50;\n color: white;\n border: none;\n border-radius: 0 5px 5px 0;\n cursor: pointer;\n}\n\n.todo-list {\n list-style-type: none;\n padding: 0;\n}\n\n.todo-item {\n background-color: #f9f9f9;\n border-radius: 5px;\n margin-bottom: 10px;\n padding: 10px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n}\n\n.todo-item.completed .todo-content {\n text-decoration: line-through;\n color: #888;\n}\n\n.todo-content {\n cursor: pointer;\n flex-grow: 1;\n}\n\n.delete-button {\n background-color: transparent;\n border: none;\n cursor: pointer;\n font-size: 20px;\n}\n\n.emoji-footer {\n text-align: center;\n margin-top: 20px;\n font-size: 18px;\n}\n\n.view-source {\n position: fixed;\n bottom: 10px;\n right: 10px;\n background-color: #f0f0f0;\n padding: 5px 10px;\n border-radius: 5px;\n text-decoration: none;\n color: #333;\n font-size: 14px;\n}\n\n@media (max-width: 600px) {\n .container {\n width: 90%;\n }\n}\n`;","createdAt",["D",1737737535125],"version",4,"currentUserHasLiked","likeCount","forkCount","referenceCount","dependencyCount","commentCount","prCount","mergedPr",{"_128":129,"_130":131},"handle","maxm","profileImageUrl","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvdXBsb2FkZWQvaW1nXzJnTEtkSHlOMWxWZm1GRHdKYUVTNklYM3FpdiJ9","forkedVal","interval","slug","maxm/emojiTodoListApp","description","@jsxImportSource https://esm.sh/react","versions",[140,143,147,150,154],{"_117":118,"_141":-5,"_115":142,"_112":110},"prId",["D",1737737535125],{"_117":144,"_141":-5,"_115":145,"_112":146},3,["D",1737737298780],"039579ae-da73-11ef-a9dd-e6cdfca9ef9f",{"_117":90,"_141":-5,"_115":148,"_112":149},["D",1737736777192],"ccb05a86-da71-11ef-919c-e6cdfca9ef9f",{"_117":151,"_141":-5,"_115":152,"_112":153},1,["D",1737736721415],"ab72e9ce-da71-11ef-9bb0-e6cdfca9ef9f",{"_117":31,"_141":-5,"_115":155,"_112":156},["D",1737735967397],"ea04aeae-da6f-11ef-88a8-e6cdfca9ef9f","recentThread","breadcrumbs","comments",[],"isOwner","routes/_app.v.$handle.$name.versions.$(version)",{"_93":164,"_165":166,"_94":167},"single","redirect","/v/maxm/emojiTodoListApp/versions",{"_112":146,"_113":168,"_117":144,"_115":169,"_170":99,"_100":101,"_107":108,"_128":129,"_11":96,"_171":-5,"_172":-5,"_173":-5,"_161":26,"_134":135},"/** @jsxImportSource https://esm.sh/react */\nimport React, { useEffect, useState } from \"https://esm.sh/react\";\nimport { createRoot } from \"https://esm.sh/react-dom/client\";\nimport { lockfileImportMap } from \"https://esm.town/v/maxm/lockfileImportMap\";\n\nfunction App() {\n const [todos, setTodos] = useState([]);\n const [newTodo, setNewTodo] = useState(\"\");\n\n useEffect(() => {\n fetchTodos();\n }, []);\n\n const fetchTodos = async () => {\n const response = await fetch(\"/todos\");\n const data = await response.json();\n setTodos(data);\n };\n\n const addTodo = async (e) => {\n e.preventDefault();\n if (!newTodo.trim()) return;\n await fetch(\"/todos\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ content: newTodo }),\n });\n setNewTodo(\"\");\n fetchTodos();\n };\n\n const toggleTodo = async (id) => {\n await fetch(`/todos/${id}`, { method: \"PATCH\" });\n fetchTodos();\n };\n\n const deleteTodo = async (id) => {\n await fetch(`/todos/${id}`, { method: \"DELETE\" });\n fetchTodos();\n };\n\n return (\n

✨📝 Emojified Todo List 📝✨

\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 console.log(Deno.readTextFileSync(\"deno.lock\"));\n const { sqlite } = await import(\"https://esm.town/v/stevekrouse/sqlite\");\n const SCHEMA_VERSION = 1;\n const KEY = new URL(import.meta.url).pathname.split(\"/\").at(-1);\n\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS ${KEY}_todos_${SCHEMA_VERSION} (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n content TEXT NOT NULL,\n completed BOOLEAN NOT NULL DEFAULT 0\n )\n `);\n\n const url = new URL(request.url);\n const path = url.pathname;\n\n if (path === \"/todos\" && request.method === \"GET\") {\n const todos = await sqlite.execute(`SELECT * FROM ${KEY}_todos_${SCHEMA_VERSION} ORDER BY id DESC`);\n return new Response(JSON.stringify(todos.rows), { headers: { \"Content-Type\": \"application/json\" } });\n }\n\n if (path === \"/todos\" && request.method === \"POST\") {\n const { content } = await request.json();\n await sqlite.execute(`INSERT INTO ${KEY}_todos_${SCHEMA_VERSION} (content) VALUES (?)`, [content]);\n return new Response(null, { status: 201 });\n }\n\n if (path.startsWith(\"/todos/\") && request.method === \"PATCH\") {\n const id = path.split(\"/\")[2];\n await sqlite.execute(`UPDATE ${KEY}_todos_${SCHEMA_VERSION} SET completed = NOT completed WHERE id = ?`, [id]);\n return new Response(null, { status: 200 });\n }\n\n if (path.startsWith(\"/todos/\") && request.method === \"DELETE\") {\n const id = path.split(\"/\")[2];\n await sqlite.execute(`DELETE FROM ${KEY}_todos_${SCHEMA_VERSION} WHERE id = ?`, [id]);\n return new Response(null, { status: 200 });\n }\n\n return new Response(\n `\n \n \n ✨📝 Emojified Todo List 📝✨\n \n \n \n \n \n

emojiTodoListApp

Version 3