\n \n \n \n\n",[],[108,173],"ecfda0a3-6b59-4c95-a760-16dae247d012","favicon.svg","019f468b-b4f0-7369-b149-cf47cce5f1ec",["D",1783594988490],"\n",[],[108,181],"81e05fa2-23f4-4b4a-9286-7bf0cef33dd1","components","019f468b-b4f0-7369-b149-cbac2c950bf8",["D",1783594988490],[193,194],[108,188],{"_35":203,"_13":204,"_66":205,"_68":189,"_69":70,"_71":31,"_73":74,"_37":206,"_17":33,"_77":138,"_79":207,"_81":50,"_82":-5,"_118":208,"_18":209},{"_35":195,"_13":196,"_66":197,"_68":189,"_69":70,"_71":198,"_73":74,"_37":199,"_17":104,"_77":138,"_79":200,"_81":50,"_82":-5,"_118":201,"_18":202},"4373f0ed-0d9b-43c6-8f6e-df96d144d8c2","Settings.tsx","afe65998-7b8b-11f1-b37f-1607ee4eb77e",16,["D",1783597530688],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\n\ninterface Chat {\n id: string;\n name: string;\n}\n\ninterface Mapping {\n chat_id: string;\n chat_name: string | null;\n project_name: string;\n updated_at: string;\n}\n\nfunction apiHeaders(): Record {\n const h: Record = { \"Content-Type\": \"application/json\" };\n const pass = localStorage.getItem(\"board_passphrase\");\n if (pass) h[\"Authorization\"] = `Bearer ${pass}`;\n return h;\n}\n\nexport function Settings({ onClose }: { onClose: () => void }) {\n const [chats, setChats] = useState([]);\n const [mappings, setMappings] = useState([]);\n const [drafts, setDrafts] = useState>({});\n const [loading, setLoading] = useState(true);\n const [error, setError] = useState(null);\n const [saving, setSaving] = useState(null);\n\n async function load() {\n setLoading(true);\n setError(null);\n try {\n const [chatsRes, mapsRes] = await Promise.all([\n fetch(\"/api/chats\", { headers: apiHeaders() }),\n fetch(\"/api/project-mappings\", { headers: apiHeaders() }),\n ]);\n const chatsData = await chatsRes.json();\n const mapsData = await mapsRes.json();\n if (chatsData.error) {\n setError(`Couldn't load WhatsApp chats: ${chatsData.error}`);\n }\n setChats(chatsData.chats ?? []);\n setMappings(mapsData.mappings ?? []);\n } catch (e) {\n setError(String(e));\n } finally {\n setLoading(false);\n }\n }\n\n useEffect(() => {\n load();\n }, []);\n\n const mappingByChat = new Map(mappings.map((m) => [m.chat_id, m]));\n\n async function saveMapping(chatId: string, chatName: string | null) {\n const value = (drafts[chatId] ?? mappingByChat.get(chatId)?.project_name ?? \"\").trim();\n if (!value) return;\n setSaving(chatId);\n try {\n await fetch(`/api/project-mappings/${encodeURIComponent(chatId)}`, {\n method: \"PUT\",\n headers: apiHeaders(),\n body: JSON.stringify({ project_name: value, chat_name: chatName }),\n });\n await load();\n } finally {\n setSaving(null);\n }\n }\n\n async function removeMapping(chatId: string) {\n setSaving(chatId);\n try {\n await fetch(`/api/project-mappings/${encodeURIComponent(chatId)}`, {\n method: \"DELETE\",\n headers: apiHeaders(),\n });\n await load();\n } finally {\n setSaving(null);\n }\n }\n\n // Union of chats fetched live from Unipile + any mapping whose chat isn't in that list\n const rows = [...chats];\n for (const m of mappings) {\n if (!rows.find((c) => c.id === m.chat_id)) {\n rows.push({ id: m.chat_id, name: m.chat_name ?? m.chat_id });\n }\n }\n\n return (\n

⚙️ Client → Project Mapping

\n \n

\n Assign each WhatsApp chat/client to a project name. New todos synced from that chat will be\n tagged with the project automatically.\n

\n\n {error &&

{error}

}\n\n {loading\n ?

Loading…

\n : rows.length === 0\n ?

No WhatsApp chats found yet.

\n : (\n

\n {rows.map((chat) => {\n const mapping = mappingByChat.get(chat.id);\n const draft = drafts[chat.id] ?? mapping?.project_name ?? \"\";\n return (\n

{chat.name}

{chat.id}

\n \n setDrafts((d) => ({ ...d, [chat.id]: (e.target as HTMLInputElement).value }))}\n class=\"w-40 border border-gray-300 rounded-md px-2 py-1 text-sm focus:outline-none focus:ring-2 focus:ring-blue-400\"\n />\n saveMapping(chat.id, chat.name)}\n disabled={saving === chat.id || !draft.trim()}\n class=\"text-xs bg-blue-500 hover:bg-blue-600 disabled:opacity-40 text-white rounded-md px-3 py-1.5\"\n >\n Save\n \n {mapping && (\n removeMapping(chat.id)}\n disabled={saving === chat.id}\n class=\"text-xs text-gray-400 hover:text-red-500 px-1\"\n title=\"Remove mapping\"\n >\n ✕\n \n )}\n

\n );\n })}\n

\n )}\n

\n );\n}\n",[],[108,188,196],"1a6aef42-d118-4860-bdcf-c6356d5fb4b2","App.tsx","019f468b-b4f0-7369-b149-c3f2f6f7a406",["D",1783597562274],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useCallback, useEffect, useMemo, useState } from \"https://esm.sh/react@18.2.0\";\nimport { Settings } from \"./Settings.tsx\";\n\ninterface Todo {\n id: number;\n message_id: string;\n chat_id: string | null;\n chat_name: string | null;\n sender_id: string | null;\n text: string | null;\n summary: string | null;\n project: string | null;\n priority: string | null;\n due_date: string | null;\n status: string;\n message_timestamp: string | null;\n created_at: string;\n}\n\nconst COLUMNS = [\n { key: \"inbox\", label: \"📥 Inbox\", color: \"bg-gray-100\", border: \"border-gray-300\" },\n { key: \"todo\", label: \"📋 To Do\", color: \"bg-blue-50\", border: \"border-blue-300\" },\n { key: \"doing\", label: \"🔄 In Progress\", color: \"bg-amber-50\", border: \"border-amber-300\" },\n { key: \"done\", label: \"✅ Done\", color: \"bg-green-50\", border: \"border-green-300\" },\n];\n\nconst PRIORITY_STYLE: Record = {\n high: \"bg-red-100 text-red-700\",\n medium: \"bg-amber-100 text-amber-700\",\n low: \"bg-gray-100 text-gray-500\",\n};\n\nfunction getAuthHeader(): string | null {\n return localStorage.getItem(\"board_passphrase\");\n}\n\nfunction apiHeaders(): Record {\n const h: Record = { \"Content-Type\": \"application/json\" };\n const pass = getAuthHeader();\n if (pass) h[\"Authorization\"] = `Bearer ${pass}`;\n return h;\n}\n\nfunction timeAgo(ts: string | null): string {\n if (!ts) return \"\";\n const d = new Date(ts);\n const diff = Date.now() - d.getTime();\n const hrs = Math.floor(diff / 3600000);\n if (hrs < 1) return \"just now\";\n if (hrs < 24) return `${hrs}h ago`;\n const days = Math.floor(hrs / 24);\n return `${days}d ago`;\n}\n\nfunction Card({ todo, onMove, onDelete }: {\n todo: Todo;\n onMove: (id: number, dir: -1 | 1) => void;\n onDelete: (id: number) => void;\n}) {\n const idx = COLUMNS.findIndex((c) => c.key === todo.status);\n return (\n

\n {todo.project && (\n \n 📁 {todo.project}\n \n )}\n {todo.priority && (\n \n {todo.priority}\n \n )}\n {todo.due_date && (\n \n 📅 {todo.due_date}\n \n )}\n

{todo.text}

\n {todo.summary &&

{todo.summary}

}\n

\n {todo.chat_name && 💬 {todo.chat_name}}\n {\" \"}\n {timeAgo(todo.message_timestamp)}\n

\n onMove(todo.id, -1)}\n disabled={idx <= 0}\n class=\"text-gray-400 hover:text-gray-700 disabled:opacity-20 disabled:cursor-not-allowed text-sm px-1\"\n title=\"Move left\"\n >\n ←\n \n onMove(todo.id, 1)}\n disabled={idx >= COLUMNS.length - 1}\n class=\"text-gray-400 hover:text-gray-700 disabled:opacity-20 disabled:cursor-not-allowed text-sm px-1\"\n title=\"Move right\"\n >\n →\n \n onDelete(todo.id)}\n class=\"text-gray-300 hover:text-red-500 text-sm px-1 ml-1\"\n title=\"Delete\"\n >\n ✕\n \n

\n );\n}\n\nexport function App() {\n const [todos, setTodos] = useState([]);\n const [loading, setLoading] = useState(true);\n const [authed, setAuthed] = useState(() => !!getAuthHeader());\n const [passInput, setPassInput] = useState(\"\");\n const [authError, setAuthError] = useState(false);\n const [showSettings, setShowSettings] = useState(false);\n const [projectFilter, setProjectFilter] = useState(\"all\");\n\n const fetchTodos = useCallback(async () => {\n try {\n const res = await fetch(\"/api/todos\", { headers: apiHeaders() });\n if (res.status === 401) {\n setAuthed(false);\n return;\n }\n const data = await res.json();\n setTodos(data.todos ?? []);\n } catch (e) {\n console.error(\"Failed to fetch todos:\", e);\n } finally {\n setLoading(false);\n }\n }, []);\n\n useEffect(() => {\n if (authed) fetchTodos();\n }, [authed, fetchTodos]);\n\n // Auto-refresh every 60s\n useEffect(() => {\n if (!authed) return;\n const t = setInterval(fetchTodos, 60000);\n return () => clearInterval(t);\n }, [authed, fetchTodos]);\n\n async function handleLogin() {\n localStorage.setItem(\"board_passphrase\", passInput);\n const res = await fetch(\"/api/todos\", { headers: apiHeaders() });\n if (res.status === 401) {\n localStorage.removeItem(\"board_passphrase\");\n setAuthError(true);\n return;\n }\n setAuthed(true);\n setAuthError(false);\n }\n\n async function handleMove(id: number, dir: -1 | 1) {\n const todo = todos.find((t) => t.id === id);\n if (!todo) return;\n const idx = COLUMNS.findIndex((c) => c.key === todo.status);\n const next = COLUMNS[idx + dir];\n if (!next) return;\n // Optimistic update\n setTodos((prev) => prev.map((t) => t.id === id ? { ...t, status: next.key } : t));\n await fetch(`/api/todos/${id}`, {\n method: \"PATCH\",\n headers: apiHeaders(),\n body: JSON.stringify({ status: next.key }),\n });\n }\n\n async function handleDelete(id: number) {\n setTodos((prev) => prev.filter((t) => t.id !== id));\n await fetch(`/api/todos/${id}`, {\n method: \"DELETE\",\n headers: apiHeaders(),\n });\n }\n\n const projects = useMemo(() => {\n const set = new Set();\n for (const t of todos) if (t.project) set.add(t.project);\n return [...set].sort();\n }, [todos]);\n\n const visibleTodos = useMemo(() => {\n if (projectFilter === \"all\") return todos;\n if (projectFilter === \"__unassigned__\") return todos.filter((t) => !t.project);\n return todos.filter((t) => t.project === projectFilter);\n }, [todos, projectFilter]);\n\n if (!authed) {\n return (\n

🔐 WhatsApp Kanban

Enter your passphrase to access the board

\n setPassInput((e.target as HTMLInputElement).value)}\n onKeyDown={(e) => e.key === \"Enter\" && handleLogin()}\n placeholder=\"Passphrase\"\n class=\"w-full border border-gray-300 rounded-lg px-4 py-2 mb-2 focus:outline-none focus:ring-2 focus:ring-blue-400\"\n />\n {authError &&

Wrong passphrase

}\n \n Enter\n \n

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

WhatsApp Kanban

\n setProjectFilter((e.target as HTMLSelectElement).value)}\n class=\"text-sm border border-gray-300 rounded-lg px-2 py-1 bg-white\"\n >\n \n \n {projects.map((p) => )}\n \n {visibleTodos.length} cards\n { setLoading(true); fetchTodos(); }}\n class=\"text-sm text-blue-500 hover:text-blue-700\"\n >\n ↻ Refresh\n \n setShowSettings(true)}\n class=\"text-sm text-gray-500 hover:text-gray-800\"\n >\n ⚙️ Settings\n \n

\n\n {loading ? (\n

Loading…

\n ) : (\n

\n {COLUMNS.map((col) => {\n const colTodos = visibleTodos.filter((t) => t.status === col.key);\n return (\n

{col.label}

\n {colTodos.length}\n

\n {colTodos.length === 0 ? (\n

No cards

\n ) : (\n colTodos.map((todo) => (\n \n ))\n )}\n

\n );\n })}\n

\n )}\n\n

\n View source\n {\" · \"}\n Auto-refreshes every 60s · Syncs from WhatsApp every 6h · Todos extracted by gpt-oss-120b (Cerebras)\n

\n\n {showSettings && { setShowSettings(false); fetchTodos(); }} />}\n

\n );\n}\n",[],[108,188,204],"b692b696-2b15-441d-a326-d712abe74fe4",["D",1783594988490],"legacyEnvVars","httpPrivacy","description","WhatsApp messages to kanban board via Unipile API","imageUrl","https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/64dc00cc-94d9-47dd-81b1-dde02610d900/square512?exp=1789538399&sig=d91a7ef87f90c894c3b8d0b9fb95840fd02478ac34a646812058e001671e6ecb","userId","0910d18e-3719-43e3-9e3f-2f3a7688390c","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount","019f447f-11d2-72d3-9ef7-3fd5b5a0910e","tursoName","b692b6962b15441da326d712abe74fe4","tursoHostname","b692b6962b15441da326d712abe74fe4-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789525245864],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_11":12,"_259":255},"org",{"_11":12,"_252":253,"_254":255,"_218":219,"_256":257,"_258":50},"branch",{"_17":96,"_13":16,"_35":70,"_41":210,"_44":36,"_45":248,"_249":52,"_250":42,"_251":56,"_57":14,"_53":12},89,"forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","displayName","Adam","avatar","https://lh3.googleusercontent.com/a/ACg8ocKezdd7dJ4xoybqc1M7fdCby5p64ImbU5Jg7JpmalJ4ktU1Bw=s96-c","tier","free","canRestrictVals","profileImageUrl","adoptOrgId",{"_35":210,"_13":14,"_37":347,"_48":-5,"_212":50,"_51":52,"_213":52,"_214":215,"_216":217,"_218":219,"_220":86,"_221":74,"_222":-5,"_223":-5,"_224":104,"_55":225,"_226":227,"_228":229,"_230":348,"_232":-5,"_233":234,"_235":234,"_236":237,"_238":237,"_239":237,"_240":234,"_241":234,"_242":349,"_244":350,"_246":351,"_49":50},[305,312,316,317,318],"files",[305,306,307,308,309,310,311,312,313,314,315,316,317,318],"counts",{"_295":104,"_296":76,"_297":104,"_34":298,"_299":300},[285,286,287,288,289],"upstreamProject",{"_35":42,"_13":58,"_214":282,"_216":217,"_51":52,"_242":283},"upstreamBranch",{"_35":36,"_37":280,"_39":281,"_13":16,"_41":42,"_17":43,"_44":-5,"_45":-5,"_46":47,"_48":-5,"_49":50,"_51":52,"_53":54,"_55":56,"_57":58},"emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},["D",1740674013689],["D",1785420707976],"Starter template with client-side React & Hono server",{"_11":54,"_259":284},"https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/129cab32-3bd7-4c3e-f39b-f12900c76100/square512?exp=1789538399&sig=ed57122c136965e1015088c1b79a18d1d4e6250d1eb81abacde1e740f48894e7",{"_35":107,"_13":108,"_66":109,"_68":-5,"_69":70,"_71":76,"_73":74,"_37":110,"_17":104,"_77":105,"_79":-5,"_81":50,"_82":-5,"_18":294},{"_35":100,"_13":101,"_66":102,"_68":-5,"_69":70,"_71":33,"_73":74,"_37":103,"_17":104,"_77":105,"_79":-5,"_81":50,"_82":-5,"_18":293},{"_35":93,"_13":94,"_66":95,"_68":-5,"_69":70,"_71":96,"_73":74,"_37":97,"_17":33,"_77":24,"_79":98,"_81":50,"_82":-5,"_18":292},{"_35":84,"_13":85,"_66":86,"_68":-5,"_69":70,"_71":87,"_73":74,"_37":88,"_17":89,"_77":90,"_79":91,"_81":50,"_82":-5,"_18":291},{"_35":64,"_13":65,"_66":67,"_68":-5,"_69":70,"_71":72,"_73":74,"_37":75,"_17":76,"_77":78,"_79":80,"_81":50,"_82":-5,"_18":290},[65],[85],[94],[101],[108],"pulls","branches","forks",{"_301":303,"_304":104},"connections",{"_301":104,"_302":104},"count","unfilledCount",5,"emptyCount",{"_35":107,"_13":108,"_66":109,"_68":-5,"_69":70,"_71":76,"_73":74,"_37":158,"_17":104,"_77":105,"_79":-5,"_81":50,"_82":-5,"_118":345,"_18":346},{"_35":187,"_13":188,"_66":189,"_68":109,"_69":70,"_71":76,"_73":74,"_37":190,"_17":104,"_77":105,"_79":-5,"_81":50,"_82":-5,"_118":343,"_18":344},{"_35":203,"_13":204,"_66":205,"_68":189,"_69":70,"_71":31,"_73":74,"_37":206,"_17":33,"_77":138,"_79":207,"_81":50,"_82":-5,"_118":341,"_18":342},{"_35":195,"_13":196,"_66":197,"_68":189,"_69":70,"_71":198,"_73":74,"_37":199,"_17":104,"_77":138,"_79":200,"_81":50,"_82":-5,"_118":339,"_18":340},{"_35":180,"_13":181,"_66":182,"_68":109,"_69":70,"_71":76,"_73":74,"_37":183,"_17":104,"_77":24,"_79":184,"_81":50,"_82":-5,"_118":337,"_18":338},{"_35":172,"_13":173,"_66":174,"_68":109,"_69":70,"_71":175,"_73":74,"_37":176,"_17":76,"_77":24,"_79":177,"_81":50,"_82":-5,"_118":335,"_18":336},{"_35":165,"_13":166,"_66":167,"_68":109,"_69":70,"_71":76,"_73":74,"_37":168,"_17":104,"_77":138,"_79":169,"_81":50,"_82":-5,"_118":333,"_18":334},{"_35":100,"_13":101,"_66":102,"_68":-5,"_69":70,"_71":33,"_73":74,"_37":127,"_17":104,"_77":105,"_79":-5,"_81":50,"_82":-5,"_118":331,"_18":332},{"_35":150,"_13":151,"_66":152,"_68":102,"_69":70,"_71":153,"_73":74,"_37":154,"_17":104,"_77":138,"_79":155,"_81":50,"_82":-5,"_118":329,"_18":330},{"_35":142,"_13":143,"_66":144,"_68":102,"_69":70,"_71":145,"_73":74,"_37":146,"_17":76,"_77":138,"_79":147,"_81":50,"_82":-5,"_118":327,"_18":328},{"_35":133,"_13":134,"_66":135,"_68":102,"_69":70,"_71":136,"_73":74,"_37":137,"_17":76,"_77":138,"_79":139,"_81":50,"_82":-5,"_118":325,"_18":326},{"_35":93,"_13":94,"_66":95,"_68":-5,"_69":70,"_71":96,"_73":74,"_37":124,"_17":33,"_77":24,"_79":98,"_81":50,"_82":-5,"_118":323,"_18":324},{"_35":84,"_13":85,"_66":86,"_68":-5,"_69":70,"_71":87,"_73":74,"_37":121,"_17":89,"_77":90,"_79":91,"_81":50,"_82":-5,"_118":321,"_18":322},{"_35":64,"_13":65,"_66":67,"_68":-5,"_69":70,"_71":72,"_73":74,"_37":117,"_17":76,"_77":78,"_79":80,"_81":50,"_82":-5,"_118":319,"_18":320},[],[65],[],[85],[],[94],[],[101,134],[],[101,143],[],[101,151],[313,314,315],[101],[],[108,166],[],[108,173],[],[108,181],[],[108,188,196],[],[108,188,204],[307,308],[108,188],[306,309,310,311],[108],["D",1783594988490],["D",1789525245864],{"_11":12,"_259":255},{"_11":12,"_252":253,"_254":255,"_218":219,"_256":257,"_258":50},{"_17":96,"_13":16,"_35":70,"_41":210,"_44":36,"_45":248,"_249":52,"_250":42,"_251":56,"_57":14,"_53":12},"ctx",{"_242":-5,"_277":385,"_386":387,"_388":389,"_390":50,"_391":50,"_392":50,"_393":74,"_394":-5,"_395":-7,"_396":-7,"_397":104,"_398":50,"_399":50,"_400":-5,"_401":50,"_402":50,"_403":50,"_404":-5},"ENV",{"_356":357,"_358":359,"_360":16,"_361":362,"_363":364,"_365":366,"_367":368,"_369":370,"_371":372,"_373":374,"_375":376,"_377":378,"_379":380,"_381":382,"_383":384},"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