[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_219":220,"_221":222},"routes/_app.x.$handle.$name",{"_11":12,"_13":14,"_15":16,"_17":18,"_38":-7,"_124":-5,"_19":125,"_126":127,"_128":129,"_130":131,"_132":133,"_21":134,"_135":-5,"_136":-5,"_137":24,"_138":139,"_140":83,"_141":-5,"_142":-5,"_143":144},"routes/_app.x.$handle.$name.branch.$branch.history_.$",{"_11":12,"_13":14,"_15":16,"_17":18,"_19":20,"_21":22,"_23":24,"_25":26,"_27":28,"_29":24,"_30":-5},"handle","CharChar","name","flashcard-piles","branchName","main","path","index.html","project",{"_32":70,"_13":14,"_36":71,"_72":-5,"_73":24,"_74":75,"_76":75,"_77":78,"_79":-5,"_30":66,"_80":81,"_82":83,"_84":-5,"_85":-5,"_86":26,"_40":41,"_87":88,"_89":90,"_91":92,"_93":-5,"_94":95,"_96":95,"_97":98,"_99":98,"_100":98,"_101":95,"_102":95,"_52":103,"_104":105,"_106":107,"_108":24},"file",{"_62":63,"_13":18,"_64":21,"_65":24,"_69":-5},"isDirectory",false,"page",0,"history",[31],"hasNext","userId",{"_32":33,"_34":35,"_36":37,"_38":39,"_40":41,"_42":43,"_44":-5,"_45":46,"_47":-5,"_48":-5,"_49":-5,"_50":-5,"_51":-5,"_52":53,"_21":54,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":60},"id","74e9fc68-5611-11f1-b8f4-ee650bb23af1","branchId","29815618-5611-11f1-a10c-ee650bb23af1","createdAt",["D",1779476839670],"version",5,"orgId","019e510c-5932-7040-9f60-46e5ec60f549","parentId","70818e7a-5611-11f1-b997-ee650bb23af1","incomingCommitId","aiChatMessageId","5188f035-19e6-4ca8-809f-015faf0f2f76","aiChatThreadId","aiChatThreadUserId","aiChatThreadTitle","source","clientLabel","user",{"_32":66,"_40":41,"_11":12,"_67":68},{"_62":63,"_13":18,"_64":21,"_65":24},"pull","merge","revert","multiple","commits",[61],{"_32":33,"_34":35,"_36":37,"_38":39,"_40":41,"_42":43,"_44":-5,"_45":46,"_47":-5,"_48":-5,"_49":-5,"_50":-5,"_51":-5,"_52":53,"_21":54,"_55":-5,"_56":-5,"_57":-5},"fileId","74d2ced0-5611-11f1-b8f4-ee650bb23af1","fileType","deleted","b0f66e5e-509d-4872-b86b-f608f2d6cc3b","avatar","https://lh3.googleusercontent.com/a/ACg8ocIqmNj7v64SVTYRk3nZFJfhCni10VosdvUrXQSPY0urAhk6Iw=s96-c","deletedAtVersion","2980556a-5611-11f1-a10c-ee650bb23af1",["D",1779476713589],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Spaced repetition flashcards with customizable piles","imageUrl","pinnedFileId","796f4bf8-5611-11f1-b4db-ee650bb23af1","pinPreview",true,"pinMigrated","screenshotVersion","likeCount","tursoName","2980556a561111f1a10cee650bb23af1","tursoHostname","2980556a561111f1a10cee650bb23af1-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789502486629],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm",{"_11":12,"_123":68},"org",{"_11":12,"_118":119,"_67":68,"_30":66,"_120":121,"_122":24},"branch",{"_38":109,"_13":16,"_32":35,"_110":70,"_111":-5,"_112":-5,"_113":-5,"_114":-5,"_115":-5,"_116":14,"_117":12},"isOwned",11,"projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","displayName","Charlotte Bao","tier","free","canRestrictVals","profileImageUrl","adoptOrgId",{"_32":70,"_13":14,"_36":214,"_72":-5,"_73":24,"_74":75,"_76":75,"_77":78,"_79":-5,"_30":66,"_80":81,"_82":83,"_84":-5,"_85":-5,"_86":26,"_40":41,"_87":88,"_89":90,"_91":215,"_93":-5,"_94":95,"_96":95,"_97":98,"_99":98,"_100":98,"_101":95,"_102":95,"_52":216,"_104":217,"_106":218,"_108":24},"tree",[164,165,166,167,168,169],"files",[164,165,166,167,168,169],"counts",{"_153":26,"_154":155,"_156":26,"_157":158,"_159":160},"contents",[],{"_32":145,"_13":18,"_62":63,"_42":-5,"_34":35,"_146":39,"_147":83,"_36":148,"_38":26,"_64":21,"_149":150,"_65":24,"_151":-5,"_17":152},"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},"74d2ce30-5611-11f1-b8f4-ee650bb23af1","branchVersion","latest",["D",1779476839670],"content","\n\n\n \n \n Flashcard Piles\n \n \n \n\n\n

\n \n\n\n","label",[18],"pulls","branches",1,"forks","envVars",{"_161":26,"_163":26},"connections",{"_161":26,"_162":26},"count","unfilledCount","emptyCount",{"_32":206,"_13":207,"_62":208,"_42":-5,"_34":35,"_146":209,"_147":83,"_36":210,"_38":155,"_64":186,"_149":211,"_65":24,"_151":-5,"_176":212,"_17":213},{"_32":198,"_13":199,"_62":200,"_42":-5,"_34":35,"_146":109,"_147":83,"_36":201,"_38":202,"_64":186,"_149":203,"_65":24,"_151":-5,"_176":204,"_17":205},{"_32":190,"_13":191,"_62":192,"_42":-5,"_34":35,"_146":193,"_147":83,"_36":194,"_38":26,"_64":186,"_149":195,"_65":24,"_151":-5,"_176":196,"_17":197},{"_32":182,"_13":183,"_62":184,"_42":-5,"_34":35,"_146":155,"_147":83,"_36":185,"_38":26,"_64":186,"_149":187,"_65":24,"_151":-5,"_176":188,"_17":189},{"_32":145,"_13":18,"_62":63,"_42":-5,"_34":35,"_146":39,"_147":83,"_36":179,"_38":26,"_64":21,"_149":150,"_65":24,"_151":-5,"_176":180,"_17":181},{"_32":170,"_13":171,"_62":81,"_42":-5,"_34":35,"_146":172,"_147":83,"_36":173,"_38":26,"_64":174,"_149":175,"_65":24,"_151":-5,"_176":177,"_17":178},"796f4b26-5611-11f1-b4db-ee650bb23af1","main.ts",6,["D",1779476847687],"http","import { Hono } from \"npm:hono@4\";\nimport { serveFile, parseVal } from \"https://esm.town/v/std/utils/index.ts\";\nimport apiRoutes from \"./api.ts\";\n\nconst app = new Hono();\n\napp.onError((err) => Promise.reject(err));\n\n// API routes\napp.route(\"/api\", apiRoutes);\n\n// View source\napp.get(\"/source\", (c) => c.redirect(parseVal().links.self.val));\n\n// Serve frontend\napp.get(\"/app.tsx\", (c) => serveFile(\"./app.tsx\", import.meta.url));\napp.get(\"*\", (c) => serveFile(\"./index.html\", import.meta.url));\n\nexport default app.fetch;\n","children",[],[171],["D",1779476839670],[],[18],"2f1dcc46-5611-11f1-8683-ee650bb23af1","db.ts","2f1dcd04-5611-11f1-8683-ee650bb23af1",["D",1779476723001],"script","import { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\n\nexport async function initDB() {\n await sqlite.batch([\n `CREATE TABLE IF NOT EXISTS users (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n username TEXT UNIQUE NOT NULL,\n password_hash TEXT NOT NULL,\n created_at TEXT DEFAULT (datetime('now'))\n )`,\n `CREATE TABLE IF NOT EXISTS piles (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n user_id INTEGER NOT NULL,\n pile_number INTEGER NOT NULL,\n label TEXT NOT NULL,\n review_interval_days REAL NOT NULL DEFAULT 1,\n FOREIGN KEY (user_id) REFERENCES users(id),\n UNIQUE(user_id, pile_number)\n )`,\n `CREATE TABLE IF NOT EXISTS cards (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n user_id INTEGER NOT NULL,\n front TEXT NOT NULL,\n back TEXT NOT NULL,\n pile_number INTEGER NOT NULL DEFAULT 1,\n last_reviewed TEXT,\n next_review TEXT DEFAULT (datetime('now')),\n created_at TEXT DEFAULT (datetime('now')),\n FOREIGN KEY (user_id) REFERENCES users(id)\n )`,\n ]);\n}\n\nexport { sqlite };\n",[],[183],"36bc2ee8-5611-11f1-8e65-ee650bb23af1","auth.ts","36bc2f9c-5611-11f1-8e65-ee650bb23af1",2,["D",1779476735785],"import { sqlite } from \"./db.ts\";\n\n// Simple hash function (no external deps needed)\nasync function hashPassword(password: string): Promise {\n const encoder = new TextEncoder();\n const data = encoder.encode(password + \"flashcard-salt-v1\");\n const hash = await crypto.subtle.digest(\"SHA-256\", data);\n return Array.from(new Uint8Array(hash)).map(b => b.toString(16).padStart(2, \"0\")).join(\"\");\n}\n\n// Simple token: base64(userId:timestamp:hash)\nfunction generateToken(userId: number): string {\n const payload = `${userId}:${Date.now()}`;\n const token = btoa(payload + \":\" + payload.split(\"\").reverse().join(\"\"));\n return token;\n}\n\nexport function parseToken(token: string): number | null {\n try {\n const decoded = atob(token);\n const userId = parseInt(decoded.split(\":\")[0]);\n return isNaN(userId) ? null : userId;\n } catch {\n return null;\n }\n}\n\nexport async function register(username: string, password: string): Promise<{ token: string; userId: number } | string> {\n if (!username || username.length < 2) return \"Username must be at least 2 characters\";\n if (!password || password.length < 4) return \"Password must be at least 4 characters\";\n\n const existing = await sqlite.execute({ sql: \"SELECT id FROM users WHERE username = ?\", args: [username] });\n if (existing.rows.length > 0) return \"Username already taken\";\n\n const hash = await hashPassword(password);\n const result = await sqlite.execute({\n sql: \"INSERT INTO users (username, password_hash) VALUES (?, ?)\",\n args: [username, hash],\n });\n\n const userId = result.lastInsertRowid as number;\n\n // Create default 5 piles\n const defaultPiles = [\n { num: 1, label: \"Pile 1\", days: 1 },\n { num: 2, label: \"Pile 2\", days: 2 },\n { num: 3, label: \"Pile 3\", days: 4 },\n { num: 4, label: \"Pile 4\", days: 7 },\n { num: 5, label: \"Pile 5\", days: 14 },\n ];\n await sqlite.batch(\n defaultPiles.map(p => ({\n sql: \"INSERT INTO piles (user_id, pile_number, label, review_interval_days) VALUES (?, ?, ?, ?)\",\n args: [userId, p.num, p.label, p.days],\n })),\n );\n\n return { token: generateToken(userId), userId };\n}\n\nexport async function login(username: string, password: string): Promise<{ token: string; userId: number } | string> {\n const hash = await hashPassword(password);\n const result = await sqlite.execute({\n sql: \"SELECT id FROM users WHERE username = ? AND password_hash = ?\",\n args: [username, hash],\n });\n if (result.rows.length === 0) return \"Invalid username or password\";\n const userId = result.rows[0].id as number;\n return { token: generateToken(userId), userId };\n}\n",[],[191],"d8a99948-5611-11f1-96af-ee650bb23af1","app.tsx","6ffa69ae-5611-11f1-b997-ee650bb23af1",["D",1779477007446],4,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\n\nimport React, { useState, useEffect, useCallback } from \"https://esm.sh/react@18.2.0\";\n\nconst API_BASE = \"\";\n\nfunction api(path: string, opts: any = {}) {\n const token = localStorage.getItem(\"fc_token\");\n return fetch(`${API_BASE}/api${path}`, {\n ...opts,\n headers: {\n \"Content-Type\": \"application/json\",\n ...(token ? { Authorization: `Bearer ${token}` } : {}),\n ...opts.headers,\n },\n body: opts.body ? JSON.stringify(opts.body) : undefined,\n }).then(async (r) => {\n const data = await r.json();\n if (!r.ok) throw new Error(data.error || \"Request failed\");\n return data;\n });\n}\n\n// ---- Auth Screen ----\nfunction AuthScreen({ onLogin }: { onLogin: () => void }) {\n const [isRegister, setIsRegister] = useState(false);\n const [username, setUsername] = useState(\"\");\n const [password, setPassword] = useState(\"\");\n const [error, setError] = useState(\"\");\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault();\n setError(\"\");\n try {\n const endpoint = isRegister ? \"/auth/register\" : \"/auth/login\";\n const data = await api(endpoint, { method: \"POST\", body: { username, password } });\n localStorage.setItem(\"fc_token\", data.token);\n onLogin();\n } catch (err: any) {\n setError(err.message);\n }\n };\n\n return (\n

📚 Flashcard Piles

Spaced repetition made simple

\n setUsername(e.target.value)}\n className=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-indigo-400 focus:outline-none\"\n />\n setPassword(e.target.value)}\n className=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-indigo-400 focus:outline-none\"\n />\n {error &&

{error}

}\n \n \n

\n {isRegister ? \"Already have an account?\" : \"Don't have an account?\"}{\" \"}\n \n

\n );\n}\n\n// ---- Review Screen ----\nfunction ReviewScreen({ onDone }: { onDone: () => void }) {\n const [cards, setCards] = useState([]);\n const [index, setIndex] = useState(0);\n const [flipped, setFlipped] = useState(false);\n const [loading, setLoading] = useState(true);\n const [feedback, setFeedback] = useState(null);\n\n useEffect(() => {\n api(\"/review\").then((c) => { setCards(c); setLoading(false); });\n }, []);\n\n const handleAnswer = async (correct: boolean) => {\n const card = cards[index];\n const result = await api(`/review/${card.id}`, { method: \"POST\", body: { correct } });\n setFeedback(correct ? `✅ Moved to Pile ${result.newPileNumber}` : `❌ Back to Pile 1`);\n setTimeout(() => {\n setFeedback(null);\n setFlipped(false);\n if (index + 1 >= cards.length) {\n onDone();\n } else {\n setIndex(index + 1);\n }\n }, 1000);\n };\n\n if (loading) return

;\n if (cards.length === 0) return (\n

🎉

No cards due for review!

\n \n

\n );\n\n const card = cards[index];\n return (\n

\n Card {index + 1} of {cards.length}\n Pile {card.pile_number}\n

\n\n setFlipped(!flipped)}\n className=\"bg-white rounded-2xl shadow-lg p-8 min-h-[250px] flex items-center justify-center cursor-pointer hover:shadow-xl transition border-2 border-gray-100\"\n >\n

{flipped ? \"ANSWER\" : \"QUESTION\"}

{flipped ? card.back : card.front}

\n {!flipped &&

Click to reveal answer

}\n

\n\n {feedback && (\n

{feedback}

\n )}\n\n {flipped && !feedback && (\n

\n \n \n

\n )}\n\n \n \n );\n}\n\n// ---- Pile Settings ----\nfunction PileSettings({ piles, onSave }: { piles: any[]; onSave: (p: any[]) => void }) {\n const [editing, setEditing] = useState(piles.map(p => ({ ...p })));\n\n const addPile = () => {\n const maxNum = editing.length > 0 ? Math.max(...editing.map(p => p.pile_number)) : 0;\n setEditing([...editing, { pile_number: maxNum + 1, label: `Pile ${maxNum + 1}`, review_interval_days: Math.pow(2, maxNum) }]);\n };\n\n const removePile = (idx: number) => {\n if (editing.length <= 1) return;\n setEditing(editing.filter((_, i) => i !== idx));\n };\n\n const update = (idx: number, field: string, value: any) => {\n const updated = [...editing];\n updated[idx] = { ...updated[idx], [field]: value };\n setEditing(updated);\n };\n\n return (\n

⚙️ Pile Settings

\n {editing.map((pile, idx) => (\n

\n #{pile.pile_number}\n update(idx, \"label\", e.target.value)}\n className=\"flex-1 px-3 py-2 border rounded-lg text-sm\"\n placeholder=\"Label\"\n />\n

\n Every\n update(idx, \"review_interval_days\", parseFloat(e.target.value) || 1)}\n className=\"w-16 px-2 py-2 border rounded-lg text-sm text-center\"\n min=\"0.01\"\n step=\"0.5\"\n />\n day(s)\n

\n \n

\n ))}\n

\n \n onSave(editing)}\n className=\"bg-indigo-600 text-white px-6 py-2 rounded-lg text-sm font-semibold hover:bg-indigo-700\"\n >\n Save Changes\n \n

\n );\n}\n\n// ---- Card Manager ----\nfunction CardManager({ cards, piles, onRefresh }: { cards: any[]; piles: any[]; onRefresh: () => void }) {\n const [front, setFront] = useState(\"\");\n const [back, setBack] = useState(\"\");\n const [editingId, setEditingId] = useState(null);\n const [editFront, setEditFront] = useState(\"\");\n const [editBack, setEditBack] = useState(\"\");\n const [filter, setFilter] = useState(\"all\");\n\n const addCard = async () => {\n if (!front.trim() || !back.trim()) return;\n await api(\"/cards\", { method: \"POST\", body: { front, back } });\n setFront(\"\");\n setBack(\"\");\n onRefresh();\n };\n\n const deleteCard = async (id: number) => {\n await api(`/cards/${id}`, { method: \"DELETE\" });\n onRefresh();\n };\n\n const startEdit = (card: any) => {\n setEditingId(card.id);\n setEditFront(card.front);\n setEditBack(card.back);\n };\n\n const saveEdit = async () => {\n if (!editingId) return;\n await api(`/cards/${editingId}`, { method: \"PUT\", body: { front: editFront, back: editBack } });\n setEditingId(null);\n onRefresh();\n };\n\n const filtered = filter === \"all\" ? cards : cards.filter(c => c.pile_number === filter);\n\n return (\n

🗂️ My Cards ({cards.length})

\n\n {/* Add card form */}\n

\n setFront(e.target.value)}\n placeholder=\"Front (question)\"\n className=\"flex-1 px-3 py-2 border rounded-lg text-sm\"\n onKeyDown={(e) => e.key === \"Enter\" && document.getElementById(\"backInput\")?.focus()}\n />\n setBack(e.target.value)}\n placeholder=\"Back (answer)\"\n className=\"flex-1 px-3 py-2 border rounded-lg text-sm\"\n onKeyDown={(e) => e.key === \"Enter\" && addCard()}\n />\n \n

\n\n {/* Filter by pile */}\n

\n setFilter(\"all\")}\n className={`px-3 py-1 rounded-full text-xs font-semibold ${filter === \"all\" ? \"bg-indigo-600 text-white\" : \"bg-gray-100 text-gray-600\"}`}\n >\n All\n \n {piles.map(p => (\n setFilter(p.pile_number)}\n className={`px-3 py-1 rounded-full text-xs font-semibold ${filter === p.pile_number ? \"bg-indigo-600 text-white\" : \"bg-gray-100 text-gray-600\"}`}\n >\n {p.label} ({cards.filter(c => c.pile_number === p.pile_number).length})\n \n ))}\n

\n\n {/* Card list */}\n

\n {filtered.length === 0 &&

No cards yet. Add one above!

}\n {filtered.map((card) => (\n

\n {editingId === card.id ? (\n <>\n setEditFront(e.target.value)} className=\"flex-1 px-2 py-1 border rounded text-sm\" />\n setEditBack(e.target.value)} className=\"flex-1 px-2 py-1 border rounded text-sm\" />\n \n \n \n ) : (\n <>\n P{card.pile_number}\n {card.front}\n {card.back}\n \n \n \n )}\n

\n ))}\n

\n );\n}\n\n// ---- Import Modal ----\nfunction ImportModal({ onClose, onDone }: { onClose: () => void; onDone: () => void }) {\n const [tab, setTab] = useState<\"text\" | \"ai\">(\"text\");\n const [textInput, setTextInput] = useState(\"\");\n const [delimiter, setDelimiter] = useState(\"tab\");\n const [customDelim, setCustomDelim] = useState(\",\");\n const [topic, setTopic] = useState(\"\");\n const [cardCount, setCardCount] = useState(10);\n const [loading, setLoading] = useState(false);\n const [result, setResult] = useState(null);\n const [error, setError] = useState(null);\n const [preview, setPreview] = useState<{ front: string; back: string }[]>([]);\n\n // Parse text input into card pairs for preview\n const parseText = (text: string): { front: string; back: string }[] => {\n const delim = delimiter === \"tab\" ? \"\\t\" : delimiter === \"comma\" ? \",\" : delimiter === \"semicolon\" ? \";\" : customDelim;\n return text\n .split(\"\\n\")\n .map((line) => line.trim())\n .filter((line) => line.length > 0)\n .map((line) => {\n const idx = line.indexOf(delim);\n if (idx === -1) return null;\n return { front: line.slice(0, idx).trim(), back: line.slice(idx + delim.length).trim() };\n })\n .filter((c): c is { front: string; back: string } => c !== null && c.front.length > 0 && c.back.length > 0);\n };\n\n useEffect(() => {\n if (tab === \"text\") setPreview(parseText(textInput));\n }, [textInput, delimiter, customDelim, tab]);\n\n const handleTextImport = async () => {\n const cards = parseText(textInput);\n if (cards.length === 0) { setError(\"No valid cards found. Check your format.\"); return; }\n setLoading(true);\n setError(null);\n try {\n const data = await api(\"/cards/import\", { method: \"POST\", body: { cards } });\n setResult(`✅ Imported ${data.imported} card${data.imported !== 1 ? \"s\" : \"\"}!`);\n setTimeout(() => { onDone(); onClose(); }, 1200);\n } catch (err: any) {\n setError(err.message);\n } finally {\n setLoading(false);\n }\n };\n\n const handleAIGenerate = async () => {\n if (!topic.trim()) { setError(\"Enter a topic\"); return; }\n setLoading(true);\n setError(null);\n setResult(null);\n try {\n const data = await api(\"/cards/generate\", { method: \"POST\", body: { topic, count: cardCount } });\n setResult(`✅ Generated ${data.imported} card${data.imported !== 1 ? \"s\" : \"\"}!`);\n setPreview(data.cards);\n setTimeout(() => { onDone(); onClose(); }, 1500);\n } catch (err: any) {\n setError(err.message);\n } finally {\n setLoading(false);\n }\n };\n\n return (\n

e.stopPropagation()}>\n

\n {/* Header */}\n

📥 Import Cards

\n \n

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

\n { setTab(\"text\"); setError(null); setResult(null); }}\n className={`px-4 py-2 rounded-lg text-sm font-semibold transition ${tab === \"text\" ? \"bg-indigo-600 text-white\" : \"bg-gray-100 text-gray-600 hover:bg-gray-200\"}`}\n >\n 📝 Paste Text\n \n { setTab(\"ai\"); setError(null); setResult(null); }}\n className={`px-4 py-2 rounded-lg text-sm font-semibold transition ${tab === \"ai\" ? \"bg-indigo-600 text-white\" : \"bg-gray-100 text-gray-600 hover:bg-gray-200\"}`}\n >\n 🤖 AI Generate\n \n

\n\n {/* Text Import Tab */}\n {tab === \"text\" && (\n

\n Paste your cards below, one per line. Separate front and back with a delimiter.\n

\n\n {/* Delimiter picker */}\n

\n Delimiter:\n {[\n { key: \"tab\", label: \"Tab\" },\n { key: \"comma\", label: \"Comma (,)\" },\n { key: \"semicolon\", label: \"Semicolon (;)\" },\n { key: \"custom\", label: \"Custom\" },\n ].map((d) => (\n setDelimiter(d.key)}\n className={`px-3 py-1 rounded-full text-xs font-semibold ${delimiter === d.key ? \"bg-indigo-100 text-indigo-700\" : \"bg-gray-100 text-gray-500\"}`}\n >\n {d.label}\n \n ))}\n {delimiter === \"custom\" && (\n setCustomDelim(e.target.value)}\n className=\"w-16 px-2 py-1 border rounded text-sm text-center\"\n placeholder=\"::\"\n />\n )}\n

\n\n setTextInput(e.target.value)}\n placeholder={`What is the capital of France?\\t Paris\\nH₂O stands for?\\tWater\\nLargest planet?\\tJupiter`}\n className=\"w-full h-48 px-4 py-3 border border-gray-300 rounded-lg text-sm font-mono focus:ring-2 focus:ring-indigo-400 focus:outline-none resize-y\"\n />\n\n {/* Preview */}\n {preview.length > 0 && (\n

Preview ({preview.length} cards):

\n {preview.slice(0, 20).map((c, i) => (\n

\n {i + 1}.\n {c.front}\n →\n {c.back}\n

\n ))}\n {preview.length > 20 &&

...and {preview.length - 20} more

}\n

\n )}\n\n \n {loading ? \"Importing...\" : `Import ${preview.length} Card${preview.length !== 1 ? \"s\" : \"\"}`}\n \n

\n )}\n\n {/* AI Generate Tab */}\n {tab === \"ai\" && (\n

\n Describe a topic and AI will generate flashcards for you.\n

\n\n setTopic(e.target.value)}\n placeholder='e.g. \"Spanish food vocabulary\", \"US Presidents\", \"JavaScript array methods\"'\n className=\"w-full px-4 py-3 border border-gray-300 rounded-lg text-sm focus:ring-2 focus:ring-indigo-400 focus:outline-none\"\n onKeyDown={(e) => e.key === \"Enter\" && !loading && handleAIGenerate()}\n />\n\n

\n Number of cards:\n setCardCount(parseInt(e.target.value))}\n className=\"flex-1\"\n />\n {cardCount}\n

\n\n {/* AI preview */}\n {preview.length > 0 && tab === \"ai\" && (\n

Generated cards:

\n {preview.map((c, i) => (\n

\n {i + 1}.\n {c.front}\n →\n {c.back}\n

\n ))}\n

\n )}\n\n \n {loading ? (\n \n ⚙️ Generating...\n \n ) : (\n `🤖 Generate ${cardCount} Cards`\n )}\n \n

\n )}\n\n {/* Error / Success messages */}\n {error &&

{error}

}\n {result &&

{result}

}\n

\n );\n}\n\n// ---- Main Dashboard ----\nfunction Dashboard({ onLogout }: { onLogout: () => void }) {\n const [view, setView] = useState<\"dashboard\" | \"review\" | \"settings\">(\"dashboard\");\n const [cards, setCards] = useState([]);\n const [piles, setPiles] = useState([]);\n const [stats, setStats] = useState(null);\n const [showImport, setShowImport] = useState(false);\n\n const refresh = useCallback(async () => {\n const [c, p, s] = await Promise.all([api(\"/cards\"), api(\"/piles\"), api(\"/stats\")]);\n setCards(c);\n setPiles(p);\n setStats(s);\n }, []);\n\n useEffect(() => { refresh(); }, [refresh]);\n\n const savePiles = async (newPiles: any[]) => {\n // Re-number piles sequentially\n const renumbered = newPiles.map((p, i) => ({ ...p, pile_number: i + 1, label: p.label || `Pile ${i + 1}` }));\n await api(\"/piles\", { method: \"PUT\", body: { piles: renumbered } });\n await refresh();\n setView(\"dashboard\");\n };\n\n if (view === \"review\") return { setView(\"dashboard\"); refresh(); }} />;\n\n return (\n

\n {/* Header */}\n

setView(\"dashboard\")}>📚 Flashcard Piles

\n view source\n \n

\n\n

\n {view === \"settings\" ? (\n <>\n \n \n \n ) : (\n <>\n {/* Stats bar */}\n

{cards.length}

Total Cards

{stats?.dueCount || 0}

Due for Review

{piles.length}

Piles

stats?.dueCount > 0 && setView(\"review\")}>\n

{stats?.dueCount > 0 ? \"🔥\" : \"✅\"}

{stats?.dueCount > 0 ? \"Start Review!\" : \"All caught up!\"}

\n\n {/* Pile visualization */}\n

📊 Pile Overview

\n \n \n

\n {piles.map((pile) => {\n const count = cards.filter(c => c.pile_number === pile.pile_number).length;\n const maxCount = Math.max(...piles.map(p => cards.filter(c => c.pile_number === p.pile_number).length), 1);\n const height = Math.max(20, (count / maxCount) * 100);\n return (\n

\n {count}\n \n

{pile.label}

Every {pile.review_interval_days}d

\n );\n })}\n

\n\n {/* Action buttons */}\n {stats?.dueCount > 0 && (\n setView(\"review\")}\n className=\"w-full bg-indigo-600 text-white py-4 rounded-xl font-bold text-lg hover:bg-indigo-700 transition shadow-lg\"\n >\n 📖 Review {stats.dueCount} Due Card{stats.dueCount !== 1 ? \"s\" : \"\"}\n \n )}\n\n {/* Card manager */}\n \n \n )}\n

\n\n {/* Import modal */}\n {showImport && setShowImport(false)} onDone={refresh} />}\n

\n );\n}\n\n// ---- App Root ----\nexport default function App() {\n const [loggedIn, setLoggedIn] = useState(!!localStorage.getItem(\"fc_token\"));\n\n const handleLogout = () => {\n localStorage.removeItem(\"fc_token\");\n setLoggedIn(false);\n };\n\n if (!loggedIn) return setLoggedIn(true)} />;\n return ;\n}\n",[],[199],"b842be32-5611-11f1-86b9-ee650bb23af1","api.ts","4698ffee-5611-11f1-8e65-ee650bb23af1",7,["D",1779476953086],"import { Hono } from \"npm:hono@4\";\nimport { sqlite, initDB } from \"./db.ts\";\nimport { register, login, parseToken } from \"./auth.ts\";\n\nconst api = new Hono();\n\n// Auth middleware\nfunction getUserId(c: any): number | null {\n const auth = c.req.header(\"Authorization\");\n if (!auth?.startsWith(\"Bearer \")) return null;\n return parseToken(auth.slice(7));\n}\n\nfunction requireAuth(c: any): number {\n const userId = getUserId(c);\n if (!userId) throw new Error(\"Unauthorized\");\n return userId;\n}\n\n// Auth routes\napi.post(\"/auth/register\", async (c) => {\n await initDB();\n const { username, password } = await c.req.json();\n const result = await register(username, password);\n if (typeof result === \"string\") return c.json({ error: result }, 400);\n return c.json(result);\n});\n\napi.post(\"/auth/login\", async (c) => {\n await initDB();\n const { username, password } = await c.req.json();\n const result = await login(username, password);\n if (typeof result === \"string\") return c.json({ error: result }, 400);\n return c.json(result);\n});\n\n// Piles routes\napi.get(\"/piles\", async (c) => {\n await initDB();\n const userId = requireAuth(c);\n const piles = await sqlite.execute({ sql: \"SELECT * FROM piles WHERE user_id = ? ORDER BY pile_number\", args: [userId] });\n return c.json(piles.rows);\n});\n\napi.put(\"/piles\", async (c) => {\n await initDB();\n const userId = requireAuth(c);\n const { piles } = await c.req.json() as { piles: { pile_number: number; label: string; review_interval_days: number }[] };\n\n // Get current max pile number\n const currentPiles = await sqlite.execute({ sql: \"SELECT pile_number FROM piles WHERE user_id = ?\", args: [userId] });\n const currentNums = new Set(currentPiles.rows.map((r: any) => r.pile_number));\n const newNums = new Set(piles.map(p => p.pile_number));\n\n const statements: any[] = [];\n\n // Remove piles that no longer exist — move their cards to pile 1\n for (const num of currentNums) {\n if (!newNums.has(num)) {\n statements.push({ sql: \"UPDATE cards SET pile_number = 1, next_review = datetime('now') WHERE user_id = ? AND pile_number = ?\", args: [userId, num] });\n statements.push({ sql: \"DELETE FROM piles WHERE user_id = ? AND pile_number = ?\", args: [userId, num] });\n }\n }\n\n // Upsert piles\n for (const p of piles) {\n if (currentNums.has(p.pile_number)) {\n statements.push({\n sql: \"UPDATE piles SET label = ?, review_interval_days = ? WHERE user_id = ? AND pile_number = ?\",\n args: [p.label, p.review_interval_days, userId, p.pile_number],\n });\n } else {\n statements.push({\n sql: \"INSERT INTO piles (user_id, pile_number, label, review_interval_days) VALUES (?, ?, ?, ?)\",\n args: [userId, p.pile_number, p.label, p.review_interval_days],\n });\n }\n }\n\n // Cards in piles beyond the new max go to the highest pile\n const maxPile = Math.max(...piles.map(p => p.pile_number));\n statements.push({\n sql: \"UPDATE cards SET pile_number = ? WHERE user_id = ? AND pile_number > ?\",\n args: [maxPile, userId, maxPile],\n });\n\n if (statements.length > 0) await sqlite.batch(statements);\n\n const updated = await sqlite.execute({ sql: \"SELECT * FROM piles WHERE user_id = ? ORDER BY pile_number\", args: [userId] });\n return c.json(updated.rows);\n});\n\n// Cards routes\napi.get(\"/cards\", async (c) => {\n await initDB();\n const userId = requireAuth(c);\n const cards = await sqlite.execute({ sql: \"SELECT * FROM cards WHERE user_id = ? ORDER BY pile_number, created_at\", args: [userId] });\n return c.json(cards.rows);\n});\n\napi.post(\"/cards\", async (c) => {\n await initDB();\n const userId = requireAuth(c);\n const { front, back } = await c.req.json();\n if (!front || !back) return c.json({ error: \"Front and back are required\" }, 400);\n const result = await sqlite.execute({\n sql: \"INSERT INTO cards (user_id, front, back, pile_number, next_review) VALUES (?, ?, ?, 1, datetime('now'))\",\n args: [userId, front, back],\n });\n return c.json({ id: result.lastInsertRowid, front, back, pile_number: 1 });\n});\n\napi.put(\"/cards/:id\", async (c) => {\n await initDB();\n const userId = requireAuth(c);\n const id = parseInt(c.req.param(\"id\"));\n const { front, back } = await c.req.json();\n await sqlite.execute({\n sql: \"UPDATE cards SET front = ?, back = ? WHERE id = ? AND user_id = ?\",\n args: [front, back, id, userId],\n });\n return c.json({ ok: true });\n});\n\napi.delete(\"/cards/:id\", async (c) => {\n await initDB();\n const userId = requireAuth(c);\n const id = parseInt(c.req.param(\"id\"));\n await sqlite.execute({ sql: \"DELETE FROM cards WHERE id = ? AND user_id = ?\", args: [id, userId] });\n return c.json({ ok: true });\n});\n\n// Review routes\napi.get(\"/review\", async (c) => {\n await initDB();\n const userId = requireAuth(c);\n // Get cards due for review (next_review <= now)\n const cards = await sqlite.execute({\n sql: \"SELECT * FROM cards WHERE user_id = ? AND next_review <= datetime('now') ORDER BY pile_number ASC, next_review ASC\",\n args: [userId],\n });\n return c.json(cards.rows);\n});\n\napi.post(\"/review/:id\", async (c) => {\n await initDB();\n const userId = requireAuth(c);\n const cardId = parseInt(c.req.param(\"id\"));\n const { correct } = await c.req.json();\n\n // Get card and piles\n const cardResult = await sqlite.execute({ sql: \"SELECT * FROM cards WHERE id = ? AND user_id = ?\", args: [cardId, userId] });\n if (cardResult.rows.length === 0) return c.json({ error: \"Card not found\" }, 404);\n const card = cardResult.rows[0] as any;\n\n const pilesResult = await sqlite.execute({ sql: \"SELECT * FROM piles WHERE user_id = ? ORDER BY pile_number\", args: [userId] });\n const piles = pilesResult.rows as any[];\n const maxPile = Math.max(...piles.map(p => p.pile_number));\n\n let newPileNumber: number;\n if (correct) {\n newPileNumber = Math.min(card.pile_number + 1, maxPile);\n } else {\n newPileNumber = 1;\n }\n\n // Find the interval for the new pile\n const targetPile = piles.find(p => p.pile_number === newPileNumber);\n const intervalDays = targetPile ? targetPile.review_interval_days : 1;\n\n // Calculate next review as fractional days (supports hours)\n const intervalHours = intervalDays * 24;\n\n await sqlite.execute({\n sql: `UPDATE cards SET pile_number = ?, last_reviewed = datetime('now'), next_review = datetime('now', '+${Math.round(intervalHours)} hours') WHERE id = ? AND user_id = ?`,\n args: [newPileNumber, cardId, userId],\n });\n\n return c.json({ newPileNumber, nextReviewIn: `${intervalDays} day(s)` });\n});\n\n// Bulk import\napi.post(\"/cards/import\", async (c) => {\n await initDB();\n const userId = requireAuth(c);\n const { cards } = await c.req.json() as { cards: { front: string; back: string }[] };\n if (!Array.isArray(cards) || cards.length === 0) return c.json({ error: \"No cards provided\" }, 400);\n if (cards.length > 500) return c.json({ error: \"Max 500 cards at a time\" }, 400);\n\n const valid = cards.filter(c => c.front?.trim() && c.back?.trim());\n if (valid.length === 0) return c.json({ error: \"No valid cards found (each needs front and back)\" }, 400);\n\n await sqlite.batch(\n valid.map(card => ({\n sql: \"INSERT INTO cards (user_id, front, back, pile_number, next_review) VALUES (?, ?, ?, 1, datetime('now'))\",\n args: [userId, card.front.trim(), card.back.trim()],\n })),\n );\n\n return c.json({ imported: valid.length });\n});\n\n// AI generate flashcards\napi.post(\"/cards/generate\", async (c) => {\n await initDB();\n const userId = requireAuth(c);\n const { topic, count } = await c.req.json() as { topic: string; count?: number };\n if (!topic?.trim()) return c.json({ error: \"Topic is required\" }, 400);\n\n const apiKey = Deno.env.get(\"OPENAI_API_KEY\");\n if (!apiKey) return c.json({ error: \"OPENAI_API_KEY not configured. Add it in your val's environment variables.\" }, 400);\n\n const numCards = Math.min(Math.max(count || 10, 1), 30);\n\n const response = await fetch(\"https://api.openai.com/v1/chat/completions\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\", Authorization: `Bearer ${apiKey}` },\n body: JSON.stringify({\n model: \"gpt-4o-mini\",\n messages: [\n {\n role: \"system\",\n content: `You are a flashcard generator. Create exactly ${numCards} flashcards for the given topic. Each card should have a clear, concise question (front) and answer (back). Return ONLY a JSON array of objects with \"front\" and \"back\" fields. No markdown, no explanation, just the JSON array.`,\n },\n { role: \"user\", content: topic },\n ],\n temperature: 0.7,\n }),\n });\n\n if (!response.ok) {\n const err = await response.text();\n return c.json({ error: `OpenAI API error: ${response.status}` }, 500);\n }\n\n const data = await response.json();\n const content = data.choices?.[0]?.message?.content?.trim();\n\n let cards: { front: string; back: string }[];\n try {\n // Strip markdown code fences if present\n const cleaned = content.replace(/^```(?:json)?\\n?/g, \"\").replace(/\\n?```$/g, \"\");\n cards = JSON.parse(cleaned);\n if (!Array.isArray(cards)) throw new Error(\"Not an array\");\n } catch {\n return c.json({ error: \"Failed to parse AI response. Try again.\" }, 500);\n }\n\n const valid = cards.filter(c => c.front?.trim() && c.back?.trim());\n if (valid.length === 0) return c.json({ error: \"AI returned no valid cards. Try a different topic.\" }, 500);\n\n // Insert into DB\n await sqlite.batch(\n valid.map(card => ({\n sql: \"INSERT INTO cards (user_id, front, back, pile_number, next_review) VALUES (?, ?, ?, 1, datetime('now'))\",\n args: [userId, card.front.trim(), card.back.trim()],\n })),\n );\n\n return c.json({ imported: valid.length, cards: valid });\n});\n\n// Stats\napi.get(\"/stats\", async (c) => {\n await initDB();\n const userId = requireAuth(c);\n const stats = await sqlite.execute({\n sql: \"SELECT pile_number, COUNT(*) as count FROM cards WHERE user_id = ? GROUP BY pile_number ORDER BY pile_number\",\n args: [userId],\n });\n const dueCount = await sqlite.execute({\n sql: \"SELECT COUNT(*) as count FROM cards WHERE user_id = ? AND next_review <= datetime('now')\",\n args: [userId],\n });\n return c.json({ pileStats: stats.rows, dueCount: (dueCount.rows[0] as any).count });\n});\n\nexport default api;\n",[],[207],["D",1779476713589],["D",1789502486629],{"_11":12,"_123":68},{"_11":12,"_118":119,"_67":68,"_30":66,"_120":121,"_122":24},{"_38":109,"_13":16,"_32":35,"_110":70,"_111":-5,"_112":-5,"_113":-5,"_114":-5,"_115":-5,"_116":14,"_117":12},"ctx",{"_52":-5,"_142":252,"_253":254,"_255":256,"_257":24,"_258":24,"_259":24,"_260":83,"_261":-5,"_262":-7,"_263":-7,"_264":26,"_265":24,"_266":24,"_267":-5,"_268":24,"_269":24,"_270":24,"_271":-5},"ENV",{"_223":224,"_225":226,"_227":16,"_228":229,"_230":231,"_232":233,"_234":235,"_236":237,"_238":239,"_240":241,"_242":243,"_244":245,"_246":247,"_248":249,"_250":251},"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"]

History · index.html