\n \n \n \n\n",[],[167,217],"d1a572f3-1a50-40a4-bd9b-2fd0f15e94fd","favicon.svg","019f0594-e762-709d-bcd4-e5248efd08af",["D",1782505072423],"\n",[],[167,225],"aa85801a-6b8c-48d0-9478-5745e06089b5","Counter.tsx","019f0594-e762-709d-bcd4-df3bad74b386","019f0594-e762-709d-bcd4-e076aae9ad15",["D",1782505072423],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\n\nexport function Counter() {\n const [count, setCount] = useState(0);\n return (\n

\n Clicked\n setCount((c) => c + 1)}\n class=\"bg-blue-500 hover:bg-blue-600 text-white font-medium px-4 py-2 rounded-lg transition-colors cursor-pointer\"\n >\n {count}\n \n times\n

\n );\n}\n",[],[167,239,232],"components","6882dd10-de73-4bd0-bda2-a0f2ed5c5534","App.tsx","019f0594-e762-709d-bcd4-dbf591fa996b",3,["D",1782505146495],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useEffect, useRef, useState } from \"https://esm.sh/react@18.2.0\";\n\nconst COLOR_STYLES: Record = {\n yellow: { bg: \"bg-yellow-100 border-yellow-300\", dot: \"bg-yellow-400\", label: \"Yellow\" },\n green: { bg: \"bg-green-100 border-green-300\", dot: \"bg-green-500\", label: \"Green\" },\n blue: { bg: \"bg-blue-100 border-blue-300\", dot: \"bg-blue-400\", label: \"Blue\" },\n purple: { bg: \"bg-purple-100 border-purple-300\", dot: \"bg-purple-500\", label: \"Purple\" },\n};\n\nconst COLOR_ORDER = [\"yellow\", \"green\", \"blue\", \"purple\"];\n\ntype Group = { color: string; category: string; words: string[] };\ntype PuzzleResult = { puzzle_number: number; puzzle_date: string; groups: Group[] };\n\nfunction formatDate(dateStr: string): string {\n try {\n const d = new Date(dateStr + \"T12:00:00Z\");\n return d.toLocaleDateString(\"en-US\", { year: \"numeric\", month: \"long\", day: \"numeric\", timeZone: \"UTC\" });\n } catch {\n return dateStr;\n }\n}\n\nfunction highlight(text: string, query: string, mode: string): JSX.Element {\n if (!query) return <>{text};\n const needle = query.toLowerCase();\n const haystack = text.toLowerCase();\n if (mode === \"exact\") {\n if (haystack === needle) {\n return {text};\n }\n return <>{text};\n }\n const idx = haystack.indexOf(needle);\n if (idx === -1) return <>{text};\n return (\n <>\n {text.slice(0, idx)}\n {text.slice(idx, idx + query.length)}\n {text.slice(idx + query.length)}\n \n );\n}\n\nfunction PuzzleCard({ puzzle, query, mode }: { puzzle: PuzzleResult; query: string; mode: string }) {\n const sorted = [...puzzle.groups].sort((a, b) => {\n const ai = COLOR_ORDER.indexOf(a.color.toLowerCase());\n const bi = COLOR_ORDER.indexOf(b.color.toLowerCase());\n return (ai === -1 ? 99 : ai) - (bi === -1 ? 99 : bi);\n });\n\n return (\n

\n {formatDate(puzzle.puzzle_date)}, #{puzzle.puzzle_number}\n

\n {sorted.map((g) => {\n const style = COLOR_STYLES[g.color.toLowerCase()] ?? {\n bg: \"bg-gray-100 border-gray-300\",\n dot: \"bg-gray-400\",\n label: g.color,\n };\n return (\n

\n \n

\n {g.category}:\n {g.words.map((w, i) => (\n \n {highlight(w, query, mode)}\n {i < g.words.length - 1 ? \", \" : \"\"}\n \n ))}\n

\n );\n })}\n

\n );\n}\n\ntype Tab = \"search\" | \"add\";\n\nexport function App() {\n const [tab, setTab] = useState(\"search\");\n const [stats, setStats] = useState<{ puzzles: number; clues: number } | null>(null);\n\n useEffect(() => {\n fetch(\"/api/stats\")\n .then((r) => r.json())\n .then(setStats)\n .catch(console.error);\n }, [tab]);\n\n return (\n

\n {/* Header */}\n

\n 🔗 Connections Archive\n

\n Search all words from past NYT Connections puzzles\n

\n {stats && (\n

\n {stats.puzzles} puzzle{stats.puzzles !== 1 ? \"s\" : \"\"} · {stats.clues} clues archived\n

\n )}\n

\n\n {/* Tabs */}\n

\n {([\"search\", \"add\"] as Tab[]).map((t) => (\n setTab(t)}\n class={`flex-1 py-1.5 text-sm font-medium rounded-md transition-all capitalize ${\n tab === t ? \"bg-white text-gray-900 shadow-sm\" : \"text-gray-500 hover:text-gray-700\"\n }`}\n >\n {t === \"search\" ? \"🔍 Search\" : \"➕ Add Puzzle\"}\n \n ))}\n

\n\n {tab === \"search\" ? : setTab(\"search\")} />}\n

\n );\n}\n\nfunction SearchTab() {\n const [query, setQuery] = useState(\"\");\n const [mode, setMode] = useState<\"substring\" | \"exact\">(\"substring\");\n const [results, setResults] = useState(null);\n const [loading, setLoading] = useState(false);\n const inputRef = useRef(null);\n\n useEffect(() => {\n inputRef.current?.focus();\n }, []);\n\n async function search(q: string, m: string) {\n if (!q.trim()) { setResults(null); return; }\n setLoading(true);\n try {\n const r = await fetch(`/api/search?q=${encodeURIComponent(q)}&mode=${m}`);\n const data = await r.json();\n setResults(data.results);\n } finally {\n setLoading(false);\n }\n }\n\n function handleSubmit(e: Event) {\n e.preventDefault();\n search(query, mode);\n }\n\n function handleModeChange(m: \"substring\" | \"exact\") {\n setMode(m);\n if (results !== null) search(query, m);\n }\n\n return (\n

\n setQuery((e.target as HTMLInputElement).value)}\n placeholder=\"Search for a word…\"\n class=\"flex-1 border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-blue-400\"\n />\n \n Search\n \n \n\n {/* Mode toggle */}\n

\n \n handleModeChange(\"substring\")}\n class=\"accent-blue-600\"\n />\n Substring match\n \n \n handleModeChange(\"exact\")}\n class=\"accent-blue-600\"\n />\n Exact match\n \n

\n\n {loading && (\n

Searching…

\n )}\n\n {!loading && results !== null && (\n

\n {results.length === 0\n ? `No puzzles found for \"${query}\"`\n : `${results.length} puzzle${results.length !== 1 ? \"s\" : \"\"} found for \"${query}\"`}\n

\n {results.map((p) => (\n \n ))}\n

\n )}\n\n {!loading && results === null && (\n

🔍

Type a word and hit Search

\n )}\n

\n );\n}\n\nfunction AddTab({ onAdded }: { onAdded: () => void }) {\n const [puzzleNumber, setPuzzleNumber] = useState(\"\");\n const [puzzleDate, setPuzzleDate] = useState(\"\");\n const [groups, setGroups] = useState([\n { color: \"yellow\", category: \"\", words: \"\" },\n { color: \"green\", category: \"\", words: \"\" },\n { color: \"blue\", category: \"\", words: \"\" },\n { color: \"purple\", category: \"\", words: \"\" },\n ]);\n const [status, setStatus] = useState<{ type: \"success\" | \"error\"; msg: string } | null>(null);\n const [loading, setLoading] = useState(false);\n\n async function handleSubmit(e: Event) {\n e.preventDefault();\n setStatus(null);\n setLoading(true);\n try {\n const payload = {\n puzzle_number: parseInt(puzzleNumber),\n puzzle_date: puzzleDate,\n groups: groups.map((g) => ({\n color: g.color,\n category: g.category.trim(),\n words: g.words.split(\",\").map((w) => w.trim().toUpperCase()).filter(Boolean),\n })),\n };\n const r = await fetch(\"/api/puzzles\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify(payload),\n });\n const data = await r.json();\n if (!r.ok) throw new Error(data.error ?? \"Unknown error\");\n setStatus({ type: \"success\", msg: `Puzzle #${data.puzzle_number} added (${data.clues_inserted} clues)` });\n setPuzzleNumber(\"\");\n setPuzzleDate(\"\");\n setGroups([\n { color: \"yellow\", category: \"\", words: \"\" },\n { color: \"green\", category: \"\", words: \"\" },\n { color: \"blue\", category: \"\", words: \"\" },\n { color: \"purple\", category: \"\", words: \"\" },\n ]);\n } catch (err: unknown) {\n setStatus({ type: \"error\", msg: String(err) });\n } finally {\n setLoading(false);\n }\n }\n\n return (\n

\n Puzzle #\n setPuzzleNumber((e.target as HTMLInputElement).value)}\n required\n placeholder=\"e.g. 365\"\n class=\"w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-blue-400\"\n />\n

\n Date\n setPuzzleDate((e.target as HTMLInputElement).value)}\n required\n class=\"w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-blue-400\"\n />\n

\n\n {groups.map((g, i) => {\n const style = COLOR_STYLES[g.color] ?? { dot: \"bg-gray-400\", bg: \"\", label: g.color };\n return (\n

\n \n {g.color}\n

\n {\n const updated = [...groups];\n updated[i] = { ...g, category: (e.target as HTMLInputElement).value };\n setGroups(updated);\n }}\n required\n placeholder=\"Category name (e.g. TIGHTLY PACKED)\"\n class=\"w-full border border-gray-300 rounded-md px-2.5 py-1.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-400\"\n />\n {\n const updated = [...groups];\n updated[i] = { ...g, words: (e.target as HTMLInputElement).value };\n setGroups(updated);\n }}\n required\n placeholder=\"Words, comma-separated (e.g. COMPACT, DENSE, SQUASHED, COMPRESSED)\"\n class=\"w-full border border-gray-300 rounded-md px-2.5 py-1.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-400\"\n />\n

\n );\n })}\n\n {status && (\n \n {status.msg}\n \n )}\n\n \n {loading ? \"Adding…\" : \"Add Puzzle\"}\n \n \n );\n}\n",[],[167,239,241],"99a38126-ca12-44bc-b88f-bc015696ea5b",["D",1782505072423],[182,183],[167,239],["D",1782505072423],[181,184,185,186],[167],["D",1782505072423],["D",1789500689328],{"_11":12,"_97":93},{"_11":12,"_90":91,"_92":93,"_48":49,"_94":95,"_96":40},{"_29":30,"_13":26,"_20":21,"_27":28,"_31":32,"_33":34,"_83":42,"_84":85,"_86":87,"_88":14,"_89":12},"ctx",{"_76":-5,"_121":293,"_294":295,"_296":297,"_298":40,"_299":40,"_300":40,"_301":53,"_302":-5,"_303":-7,"_304":-7,"_305":57,"_306":40,"_307":40,"_308":-5,"_309":40,"_310":40,"_311":40,"_312":-5},"ENV",{"_264":265,"_266":267,"_268":26,"_269":270,"_271":272,"_273":274,"_275":276,"_277":278,"_279":280,"_281":282,"_283":284,"_285":286,"_287":288,"_289":290,"_291":292},"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"]

Branches1

Branches
1