\n \n \n \n\n",[],[136,189],"7fee313b-f3df-4218-a50a-810ff265d089","favicon.svg","ae6003d8-7a3e-11f1-96cf-1607ee4eb77e",9,["D",1783454505686],"\n",[],[136,197],"b5082cfd-68f8-4832-9dbc-df7fb189611f","api.ts","aec5f0b2-7a3e-11f1-96cf-1607ee4eb77e",["D",1783454506386],"// API client for notes backend. All requests are JSON.\n\nconst BASE = \"/api/notes\";\n\nexport interface Note {\n id: string;\n body: string;\n createdAt: number;\n updatedAt: number;\n}\n\nasync function asJson(res: Response): Promise {\n if (!res.ok) {\n let msg = `Request failed (${res.status})`;\n try {\n const data = await res.json();\n if (data?.error) msg = data.error;\n } catch {\n /* ignore */\n }\n throw new Error(msg);\n }\n return (await res.json()) as T;\n}\n\nexport function listNotes(): Promise {\n return fetch(BASE).then(asJson);\n}\n\nexport function getNote(id: string): Promise {\n return fetch(`${BASE}/${encodeURIComponent(id)}`).then(asJson);\n}\n\nexport function createNote(): Promise {\n return fetch(BASE, { method: \"POST\" }).then(asJson);\n}\n\nexport function updateNote(id: string, body: string): Promise {\n return fetch(`${BASE}/${encodeURIComponent(id)}`, {\n method: \"PUT\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ body }),\n }).then(asJson);\n}\n\nexport function deleteNote(id: string): Promise<{ ok: boolean; deleted: number }> {\n return fetch(`${BASE}/${encodeURIComponent(id)}`, {\n method: \"DELETE\",\n }).then(asJson<{ ok: boolean; deleted: number }>);\n}\n",[],[136,205],"5c68325c-885a-4c6c-895f-21165d23ae10","PasswordGate.tsx","aca76928-7a3e-11f1-843b-1607ee4eb77e","4982c646-652a-4802-958f-917418d8a1bd",3,["D",1783454502784],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\n\ninterface PasswordGateProps {\n onUnlock: () => void;\n}\n\nconst PASSWORD = \"my-notes-are-mine\";\n\nexport function PasswordGate({ onUnlock }: PasswordGateProps) {\n const [password, setPassword] = useState(\"\");\n const [error, setError] = useState(\"\");\n\n const handleSubmit = (e: Event) => {\n e.preventDefault();\n if (password.length === 0) {\n setError(\"Password is required\");\n return;\n }\n if (password !== PASSWORD) {\n setError(\"Incorrect password\");\n return;\n }\n onUnlock();\n };\n\n return (\n

\n \n

🔒

My Notes

\n Enter the password to unlock your notes.\n

\n\n \n Password\n \n {\n setPassword(e.currentTarget.value);\n if (error) setError(\"\");\n }}\n class=\"w-full px-3 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent\"\n placeholder=\"Password\"\n />\n\n {error\n ? (\n \n {error}\n

\n )\n : null}\n\n \n Unlock\n \n \n \n );\n}\n",[],[136,220,212],"components","88bf6606-4975-4aa2-8b76-3465905cbfd2","NotesList.tsx","acdeb4dc-7a3e-11f1-a3c0-1607ee4eb77e",4,["D",1783454503171],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useCallback, useEffect, useState } from \"https://esm.sh/react@18.2.0\";\nimport * as api from \"../api.ts\";\nimport { formatTimestamp, getTitleAndPreview } from \"../util.ts\";\n\ninterface NotesListProps {\n onNavigate: (path: string) => void;\n /** Bump to force the list to reload (e.g. after editor save/delete). */\n reloadKey: number;\n}\n\ninterface DeleteConfirm {\n id: string;\n title: string;\n}\n\nexport function NotesList({ onNavigate, reloadKey }: NotesListProps) {\n const [notes, setNotes] = useState([]);\n const [search, setSearch] = useState(\"\");\n const [loading, setLoading] = useState(true);\n const [loadError, setLoadError] = useState(\"\");\n const [creating, setCreating] = useState(false);\n const [confirmDelete, setConfirmDelete] = useState(\n null,\n );\n const [deleting, setDeleting] = useState(false);\n\n const load = useCallback(async () => {\n setLoading(true);\n setLoadError(\"\");\n try {\n const data = await api.listNotes();\n setNotes(data);\n } catch (e) {\n setLoadError((e as Error).message || \"Failed to load notes\");\n } finally {\n setLoading(false);\n }\n }, []);\n\n useEffect(() => {\n load();\n }, [load, reloadKey]);\n\n const handleNew = async () => {\n if (creating) return;\n setCreating(true);\n try {\n const note = await api.createNote();\n onNavigate(`/notes/${note.id}`);\n } catch (e) {\n setLoadError((e as Error).message || \"Failed to create note\");\n setCreating(false);\n }\n };\n\n const handleConfirmDelete = async () => {\n if (!confirmDelete || deleting) return;\n setDeleting(true);\n try {\n await api.deleteNote(confirmDelete.id);\n setConfirmDelete(null);\n setDeleting(false);\n await load();\n } catch (e) {\n setLoadError((e as Error).message || \"Failed to delete note\");\n setDeleting(false);\n setConfirmDelete(null);\n }\n };\n\n const q = search.trim().toLowerCase();\n const filtered = q\n ? notes.filter((n) => {\n const { title } = getTitleAndPreview(n.body);\n return title.toLowerCase().includes(q) ||\n n.body.toLowerCase().includes(q);\n })\n : notes;\n\n return (\n

My Notes

\n \n {creating ? \"Creating…\" : \"+ New Note\"}\n \n

\n setSearch(e.currentTarget.value)}\n placeholder=\"Search notes…\"\n data-testid=\"search-input\"\n class=\"w-full px-3 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent\"\n />\n

\n\n

\n {loadError\n ? (\n

\n {loadError}\n

\n )\n : null}\n\n {loading\n ?

Loading notes…

\n : notes.length === 0\n ? (\n \n

📝

No notes yet.

\n Click + New Note to create\n your first one.\n

\n )\n : filtered.length === 0\n ? (\n \n No notes match \"{search}\".\n

\n )\n : (\n

\n onNavigate(`/notes/${note.id}`)}\n class=\"flex-1 text-left px-4 py-3 min-w-0\"\n data-testid=\"note-open\"\n >\n \n {title}\n

\n {preview\n ? (\n \n {preview}\n \n )\n : null}\n \n {formatTimestamp(note.updatedAt)}\n \n \n

\n \n setConfirmDelete({ id: note.id, title })}\n class=\"text-gray-400 hover:text-red-600 px-2 py-1 text-sm\"\n aria-label={`Delete note ${title}`}\n data-testid=\"note-delete\"\n >\n Delete\n \n

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

\n )}\n \n\n {confirmDelete\n ? (\n \n

Delete note?

\n This will permanently delete the note\n {confirmDelete.title !== \"New Note\"\n ? <> \"{confirmDelete.title}\"\n : null}. This action cannot be undone.\n

\n setConfirmDelete(null)}\n disabled={deleting}\n class=\"px-4 py-2 rounded-lg border border-gray-300 text-gray-700 hover:bg-gray-50 disabled:opacity-60\"\n data-testid=\"delete-cancel\"\n >\n Cancel\n \n \n {deleting ? \"Deleting…\" : \"Delete permanently\"}\n \n

\n \n )\n : null}\n \n );\n}\n",[],[136,220,222],"97feede9-a48a-4a24-a20d-e4587a04ef40","NoteEditor.tsx","ad4261d0-7a3e-11f1-a93c-1607ee4eb77e",5,["D",1783454503814],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport {\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"https://esm.sh/react@18.2.0\";\nimport * as api from \"../api.ts\";\nimport { formatTimestamp } from \"../util.ts\";\n\ninterface NoteEditorProps {\n id: string;\n onNavigate: (path: string) => void;\n onChanged: () => void;\n}\n\nconst AUTOSAVE_DEBOUNCE_MS = 500;\n\nexport function NoteEditor({ id, onNavigate, onChanged }: NoteEditorProps) {\n const [body, setBodyState] = useState(\"\");\n const [updatedAt, setUpdatedAt] = useState(0);\n const [loading, setLoading] = useState(true);\n const [loadError, setLoadError] = useState(\"\");\n const [saving, setSaving] = useState(false);\n const [saveError, setSaveError] = useState(\"\");\n const [showDeleteConfirm, setShowDeleteConfirm] = useState(false);\n const [deleting, setDeleting] = useState(false);\n\n // Latest body, kept in sync synchronously inside the input handler so that\n // an immediate save (e.g. from \"← Notes\" click) always sees the freshest\n // text, not stale state.\n const bodyRef = useRef(\"\");\n // id is mirrored for the same reason — the in-flight save may outlive the\n // current id if the user navigates quickly.\n const idRef = useRef(id);\n\n // Body value last confirmed by the server.\n const lastSavedRef = useRef(\"\");\n // In-flight save promise, used to serialize PUT requests.\n const inflightRef = useRef | null>(null);\n const debounceRef = useRef(null);\n const textareaRef = useRef(null);\n\n // setBody wrapper that keeps the ref in sync immediately.\n const setBody = useCallback((v: string) => {\n bodyRef.current = v;\n setBodyState(v);\n }, []);\n\n const saveNow = useCallback(async (): Promise => {\n if (debounceRef.current !== null) {\n clearTimeout(debounceRef.current);\n debounceRef.current = null;\n }\n const currentId = idRef.current;\n const currentBody = bodyRef.current;\n if (currentBody === lastSavedRef.current) return null;\n\n // Chain after the previous in-flight save so writes happen in order.\n const previous = inflightRef.current ?? Promise.resolve(null);\n const next = previous\n .catch(() => null)\n .then(async () => {\n // Always read the freshest body & id at the moment we actually run,\n // not when saveNow was called. This way a rapid second call simply\n // no-ops if the body hasn't changed again, and a slower chain still\n // saves the latest text.\n const idAtRun = idRef.current;\n const bodyAtRun = bodyRef.current;\n if (bodyAtRun === lastSavedRef.current) return null;\n if (idAtRun !== currentId) return null; // navigated away\n try {\n setSaving(true);\n const updated = await api.updateNote(currentId, bodyAtRun);\n if (idRef.current === currentId) {\n lastSavedRef.current = bodyAtRun;\n setUpdatedAt(updated.updatedAt);\n setSaveError(\"\");\n onChanged();\n }\n return updated;\n } catch (e) {\n if (idRef.current === currentId) {\n setSaveError((e as Error).message || \"Failed to save\");\n }\n return null;\n } finally {\n if (idRef.current === currentId) setSaving(false);\n }\n });\n inflightRef.current = next;\n return next;\n }, [onChanged]);\n\n // Load the note whenever the id changes.\n useEffect(() => {\n let cancelled = false;\n setLoading(true);\n setLoadError(\"\");\n setBody(\"\");\n setUpdatedAt(0);\n lastSavedRef.current = \"\";\n idRef.current = id;\n inflightRef.current = null;\n api.getNote(id)\n .then((note) => {\n if (cancelled) return;\n setBody(note.body);\n setUpdatedAt(note.updatedAt);\n lastSavedRef.current = note.body;\n setLoading(false);\n // Place cursor in the textarea after the next paint.\n queueMicrotask(() => {\n const ta = textareaRef.current;\n if (ta) {\n ta.focus();\n ta.selectionStart = ta.selectionEnd = 0;\n }\n });\n })\n .catch((e) => {\n if (cancelled) return;\n setLoadError((e as Error).message || \"Failed to load note\");\n setLoading(false);\n });\n return () => {\n cancelled = true;\n };\n // We intentionally only depend on `id` here.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [id]);\n\n // Debounced autosave whenever the body changes after the initial load.\n useEffect(() => {\n if (loading) return;\n if (body === lastSavedRef.current) return;\n if (debounceRef.current !== null) {\n clearTimeout(debounceRef.current);\n }\n debounceRef.current = setTimeout(() => {\n debounceRef.current = null;\n void saveNow();\n }, AUTOSAVE_DEBOUNCE_MS);\n return () => {\n if (debounceRef.current !== null) {\n clearTimeout(debounceRef.current);\n debounceRef.current = null;\n }\n };\n }, [body, loading, saveNow]);\n\n // Best-effort: flush a pending save when the tab is being closed.\n useEffect(() => {\n const onBeforeUnload = () => {\n if (bodyRef.current !== lastSavedRef.current) {\n // Send a synchronous-ish beacon. fetch with keepalive is the modern\n // equivalent and still triggers a server roundtrip after unload.\n try {\n fetch(`/api/notes/${idRef.current}`, {\n method: \"PUT\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ body: bodyRef.current }),\n keepalive: true,\n });\n } catch {\n /* ignore */\n }\n }\n };\n window.addEventListener(\"beforeunload\", onBeforeUnload);\n return () => window.removeEventListener(\"beforeunload\", onBeforeUnload);\n }, []);\n\n const handleBack = async () => {\n await saveNow();\n onNavigate(\"/notes\");\n };\n\n const handleDelete = async () => {\n if (deleting) return;\n setDeleting(true);\n // Save any pending edit first so the server copy is up to date, then\n // delete the note.\n await saveNow();\n try {\n await api.deleteNote(id);\n onChanged();\n onNavigate(\"/notes\");\n } catch (e) {\n setSaveError((e as Error).message || \"Failed to delete note\");\n setDeleting(false);\n setShowDeleteConfirm(false);\n }\n };\n\n if (loadError) {\n return (\n

{loadError}

\n onNavigate(\"/notes\")}\n class=\"px-4 py-2 rounded-lg border border-gray-300 text-gray-700 hover:bg-gray-50\"\n >\n Back to notes\n \n

\n );\n }\n\n if (loading) {\n return (\n

\n Loading note…\n

\n );\n }\n\n return (\n

\n \n ← Notes\n \n

\n \n {saveError\n ? {saveError}\n : saving\n ? \"Saving…\"\n : updatedAt\n ? `Saved · ${formatTimestamp(updatedAt)}`\n : \"\"}\n \n setShowDeleteConfirm(true)}\n class=\"text-red-600 hover:text-red-700 px-2 py-1 rounded text-sm\"\n data-testid=\"editor-delete\"\n >\n Delete\n \n

\n\n

\n {\n setBody(e.currentTarget.value);\n if (saveError) setSaveError(\"\");\n }}\n placeholder=\"Start writing…\"\n autoFocus\n data-testid=\"note-body\"\n class=\"w-full min-h-[70vh] resize-none border-0 focus:outline-none focus:ring-0 text-base leading-relaxed text-gray-900 placeholder-gray-400 bg-white\"\n />\n

\n\n {showDeleteConfirm\n ? (\n \n

Delete note?

\n This will permanently delete this note. This action cannot be\n undone.\n

\n setShowDeleteConfirm(false)}\n disabled={deleting}\n class=\"px-4 py-2 rounded-lg border border-gray-300 text-gray-700 hover:bg-gray-50 disabled:opacity-60\"\n data-testid=\"delete-cancel\"\n >\n Cancel\n \n \n {deleting ? \"Deleting…\" : \"Delete permanently\"}\n \n

\n )\n : null}\n \n );\n}\n",[],[136,220,230],"66f32006-acf0-4dce-b5d2-2a79a7b0882a","App.tsx","ae8323e0-7a3e-11f1-8d52-1607ee4eb77e",10,["D",1783454505940],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useCallback, useEffect, useState } from \"https://esm.sh/react@18.2.0\";\nimport { PasswordGate } from \"./PasswordGate.tsx\";\nimport { NotesList } from \"./NotesList.tsx\";\nimport { NoteEditor } from \"./NoteEditor.tsx\";\n\nconst SESSION_KEY = \"notes-unlocked\";\nconst PASSWORD = \"my-notes-are-mine\";\n\ntype Route =\n | { type: \"list\" }\n | { type: \"note\"; id: string };\n\nfunction parseRoute(): Route {\n const path = window.location.pathname.replace(/\\/+$/, \"\") || \"/\";\n // Accept /notes/ and /note/\n const m = path.match(/^\\/(?:notes|note)\\/([^/]+)$/);\n if (m) return { type: \"note\", id: decodeURIComponent(m[1]) };\n return { type: \"list\" };\n}\n\nfunction navigate(path: string) {\n if (window.location.pathname === path) return;\n window.history.pushState({}, \"\", path);\n window.dispatchEvent(new PopStateEvent(\"popstate\"));\n}\n\nexport function App() {\n const [unlocked, setUnlocked] = useState(() => {\n if (typeof window === \"undefined\") return false;\n return sessionStorage.getItem(SESSION_KEY) === \"1\";\n });\n const [route, setRoute] = useState(() => parseRoute());\n // Bumping this forces the list to reload (after editor save/delete).\n const [reloadKey, setReloadKey] = useState(0);\n\n useEffect(() => {\n const onPop = () => setRoute(parseRoute());\n window.addEventListener(\"popstate\", onPop);\n return () => window.removeEventListener(\"popstate\", onPop);\n }, []);\n\n const go = useCallback((path: string) => {\n navigate(path);\n }, []);\n\n const handleChanged = useCallback(() => {\n setReloadKey((k) => k + 1);\n }, []);\n\n // While locked, the only visible UI is the gate — no note data is shown\n // regardless of the URL the user navigated to.\n if (!unlocked) {\n return (\n {\n sessionStorage.setItem(SESSION_KEY, \"1\");\n setUnlocked(true);\n }}\n />\n );\n }\n\n if (route.type === \"note\") {\n return (\n \n );\n }\n\n return ;\n}\n",[],[136,220,238],"eeacc669-49d0-41d0-a3f9-ad7c855cb4d1",["D",1783454502784],[154,155,156,157],[136,220],["D",1783454501971],[153,158,159,160,161,162],[136],["D",1783454501519],["D",1789523429989],{"_16":17,"_84":79},{"_16":17,"_78":79,"_80":79,"_33":34,"_81":82,"_83":26},{"_66":67,"_20":68,"_18":69,"_70":19,"_71":-5,"_72":-5,"_73":-5,"_74":-5,"_75":-5,"_76":21,"_77":17},"ctx",{"_59":-5,"_105":290,"_291":292,"_293":294,"_295":26,"_296":26,"_297":26,"_298":103,"_299":-5,"_300":-7,"_301":-7,"_302":40,"_303":26,"_304":26,"_305":-5,"_306":26,"_307":26,"_308":26,"_309":-5},"ENV",{"_261":262,"_263":264,"_265":68,"_266":267,"_268":269,"_270":271,"_272":273,"_274":275,"_276":277,"_278":279,"_280":281,"_282":283,"_284":285,"_286":287,"_288":289},"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"]