\n \n \n \n\n",[],[122,135],"22a313ae-a4e0-42d6-ba4e-128ae672019c",["D",1783891090793],"\n\n",[],[122,141],"ce3c17da-0999-4264-83a6-f685d25a1e88",["D",1783879933383],"/** @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",[],[122,146,91],"60dc5e4e-4453-47d8-9613-dd830744670f",["D",1783891090828],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport {\n type ChangeEvent,\n type DragEvent,\n type FormEvent,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"https://esm.sh/react@18.2.0\";\n\ntype Job = {\n id: string;\n name: string;\n endpoint: string;\n state: string;\n openai_batch_id: string | null;\n output_file_id: string | null;\n error_file_id: string | null;\n request_total: number;\n request_completed: number;\n request_failed: number;\n input_bytes: number;\n last_error: string | null;\n created_at: number;\n};\n\nconst sample =\n `{\"custom_id\":\"request-1\",\"method\":\"POST\",\"url\":\"/v1/responses\",\"body\":{\"model\":\"gpt-5-mini\",\"input\":\"Write a one-line greeting.\"}}`;\nconst terminal = new Set([\n \"completed\",\n \"failed\",\n \"expired\",\n \"cancelled\",\n \"failed_local\",\n]);\n\nasync function api(path: string, init?: RequestInit) {\n const response = await fetch(path, {\n ...init,\n headers: {\n \"Content-Type\": \"application/json\",\n ...init?.headers,\n },\n });\n const data = await response.json();\n if (!response.ok) {\n throw new Error(data.error ?? `Request failed (${response.status})`);\n }\n return data;\n}\n\nfunction badge(state: string) {\n if (state === \"completed\") {\n return \"bg-emerald-100 text-emerald-800\";\n }\n if ([\"failed\", \"expired\", \"failed_local\"].includes(state)) {\n return \"bg-red-100 text-red-800\";\n }\n if ([\"queued\", \"submitting\"].includes(state)) {\n return \"bg-amber-100 text-amber-800\";\n }\n return \"bg-blue-100 text-blue-800\";\n}\n\nexport function App() {\n const [jobs, setJobs] = useState([]);\n const [name, setName] = useState(\"\");\n const [endpoint, setEndpoint] = useState(\"/v1/responses\");\n const [jsonl, setJsonl] = useState(sample);\n const [fileNames, setFileNames] = useState([]);\n const [dragging, setDragging] = useState(false);\n const [busy, setBusy] = useState(false);\n const [message, setMessage] = useState(\"\");\n const fileInput = useRef(null);\n const dragDepth = useRef(0);\n\n const activeCount = useMemo(\n () => jobs.filter((job) => !terminal.has(job.state)).length,\n [jobs],\n );\n\n async function load() {\n try {\n setJobs((await api(\"/api/jobs\")).jobs);\n } catch (error) {\n setMessage(String(error));\n }\n }\n\n useEffect(() => {\n load();\n const timer = setInterval(load, 30_000);\n return () => clearInterval(timer);\n }, []);\n\n async function loadFiles(files: File[]) {\n if (files.length === 0) return;\n\n setMessage(\"\");\n try {\n const contents = await Promise.all(files.map((file) => file.text()));\n const combined = contents.reduce((result, content) => {\n if (result && !result.endsWith(\"\\n\") && !content.startsWith(\"\\n\")) {\n return `${result}\\n${content}`;\n }\n return result + content;\n }, \"\");\n setJsonl(combined);\n setFileNames(files.map((file) => file.name));\n if (!name && files.length === 1) {\n setName(files[0].name.replace(/\\.(jsonl|ndjson)$/i, \"\"));\n }\n } catch (error) {\n setMessage(\n `Could not read the selected files: ${\n error instanceof Error ? error.message : String(error)\n }`,\n );\n }\n }\n\n function selectFiles(event: ChangeEvent) {\n void loadFiles(Array.from(event.currentTarget.files ?? []));\n event.currentTarget.value = \"\";\n }\n\n function dropFiles(event: DragEvent) {\n event.preventDefault();\n dragDepth.current = 0;\n setDragging(false);\n void loadFiles(Array.from(event.dataTransfer.files));\n }\n\n async function submit(event: FormEvent) {\n event.preventDefault();\n setBusy(true);\n setMessage(\"\");\n try {\n await api(\"/api/jobs\", {\n method: \"POST\",\n body: JSON.stringify({ name, endpoint, jsonl }),\n });\n setName(\"\");\n setMessage(\n \"Queued. The worker submits up to three batches every 15 minutes.\",\n );\n await load();\n } catch (error) {\n setMessage(error instanceof Error ? error.message : String(error));\n } finally {\n setBusy(false);\n }\n }\n\n async function action(id: string, verb: \"refresh\" | \"cancel\") {\n setMessage(\"\");\n try {\n await api(`/api/jobs/${id}/${verb}`, { method: \"POST\" });\n await load();\n } catch (error) {\n setMessage(error instanceof Error ? error.message : String(error));\n }\n }\n\n return (\n

\n OpenAI Batch Console\n

\n Queue, monitor, and download JSONL results.\n

\n \n

\n\n

New batch

\n \n Name\n setName(e.currentTarget.value)}\n placeholder=\"Nightly classification\"\n className=\"mt-1 w-full rounded-lg border border-slate-700 bg-slate-950 px-3 py-2 outline-none focus:border-blue-500\"\n />\n \n \n Endpoint\n setEndpoint(e.currentTarget.value)}\n className=\"mt-1 w-full rounded-lg border border-slate-700 bg-slate-950 px-3 py-2 font-mono text-sm outline-none focus:border-blue-500\"\n />\n \n

\n Batch JSONL\n {\n event.preventDefault();\n dragDepth.current += 1;\n setDragging(true);\n }}\n onDragOver={(event) => event.preventDefault()}\n onDragLeave={() => {\n dragDepth.current = Math.max(0, dragDepth.current - 1);\n if (dragDepth.current === 0) {\n setDragging(false);\n }\n }}\n onDrop={dropFiles}\n className={`mt-1 rounded-lg border-2 border-dashed p-4 text-center transition ${\n dragging\n ? \"border-blue-400 bg-blue-950/40\"\n : \"border-slate-700 bg-slate-950\"\n }`}\n >\n \n

\n Drop one or more JSONL files here\n

\n fileInput.current?.click()}\n className=\"mt-2 rounded-lg border border-slate-600 px-3 py-1.5 text-sm hover:bg-slate-800\"\n >\n Choose files\n \n

\n Multiple files are combined in selection order.\n

\n {fileNames.length > 0 && (\n

\n Loaded {fileNames.length} file{fileNames.length === 1 ? \"\" : \"s\"}:\n {\" \"}\n {fileNames.join(\", \")}\n

\n )}\n {\n setJsonl(e.currentTarget.value);\n setFileNames([]);\n }}\n rows={13}\n spellCheck={false}\n aria-label=\"Batch JSONL content\"\n className=\"mt-3 w-full rounded-lg border border-slate-700 bg-slate-950 px-3 py-2 font-mono text-xs leading-5 outline-none focus:border-blue-500\"\n />\n

\n \n {busy ? \"Queuing...\" : \"Queue batch\"}\n \n \n

\n OpenAI allows up to 50,000 requests and 200 MB per batch. This val\n defaults to an 8 MB transient queue cap to protect Val Town storage.\n

\n \n\n

Jobs

\n {activeCount} active - auto-refreshes every 30 seconds\n

\n \n Reload\n \n

\n {message && (\n

\n {message}\n

\n )}\n

\n {jobs.length === 0 && (\n

\n No batch jobs yet.\n

\n )}\n {jobs.map((job) => (\n \n

{job.name}

\n {job.openai_batch_id ?? job.id}\n

\n \n {job.state}\n \n

\n \n

\n \n {job.request_completed}/{job.request_total} completed\n \n {job.request_failed} failed\n {(job.input_bytes / 1024).toFixed(1)} KB\n {job.endpoint}\n

\n {job.last_error && (\n

\n                    {job.last_error}\n

\n )}\n

\n {!terminal.has(job.state) && job.openai_batch_id && (\n action(job.id, \"refresh\")}\n className=\"rounded-lg border border-slate-700 px-3 py-1.5 hover:bg-slate-800\"\n >\n Refresh status\n \n )}\n {!terminal.has(job.state) && (\n action(job.id, \"cancel\")}\n className=\"rounded-lg border border-red-900 px-3 py-1.5 text-red-300 hover:bg-red-950\"\n >\n Cancel\n \n )}\n {job.output_file_id && (\n \n Download output\n \n )}\n {job.error_file_id && (\n \n Download errors\n \n )}\n

\n ))}\n \n

\n \n View source and remix\n \n

\n \n \n \n );\n}\n",[],[122,146,103],"f9b77a82-fdfb-4b04-9d38-2ab5b1b6dfe3",["D",1783879933383],[396,397],[122,146],["D",1783879933383],[395,398,399,400],[122],["D",1783879933383],["D",1789472446807],{"_11":12,"_318":97},{"_11":12,"_314":-5,"_96":97,"_25":95,"_315":316,"_317":24},{"_48":258,"_13":16,"_42":45,"_303":265,"_304":86,"_305":306,"_307":269,"_308":309,"_310":311,"_312":14,"_313":12},"ctx",{"_61":-5,"_340":498,"_499":500,"_501":502,"_503":24,"_504":24,"_505":24,"_506":277,"_507":-5,"_508":-7,"_509":-7,"_510":20,"_511":24,"_512":24,"_513":-5,"_514":24,"_515":24,"_516":24,"_517":-5},"ENV",{"_469":470,"_471":472,"_473":16,"_474":475,"_476":477,"_478":479,"_480":481,"_482":483,"_484":485,"_486":487,"_488":489,"_490":491,"_492":493,"_494":495,"_496":497},"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