CerebrasCoder

\n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")!).render();\n}\n\nif (typeof document !== \"undefined\") {\n client();\n}\n\nfunction extractCodeFromFence(text: string): string {\n const htmlMatch = text.match(/```html\\n([\\s\\S]*?)\\n```/);\n return htmlMatch ? htmlMatch[1].trim() : text;\n}\n\nexport default async function server(req: Request): Promise {\n if (req.method === \"POST\") {\n const client = new Cerebras();\n const { prompt, currentCode } = await req.json();\n\n const completion = await client.chat.completions.create({\n messages: [\n {\n role: \"system\",\n content:\n \"You are a helpful assistant that generates HTML, CSS and JavaScript code. Always wrap your response in ```html code fences. Include all necessary HTML, CSS, and JavaScript in a single complete HTML file.\",\n },\n {\n role: \"system\",\n content: currentCode\n ? `Current code to modify:\\n\\`\\`\\`html\\n${currentCode}\\n\\`\\`\\``\n : \"No existing code to modify.\",\n },\n {\n role: \"user\",\n content: prompt,\n },\n ],\n model: \"llama3.1-70b\",\n });\n\n const timeInSeconds = completion.time_info.completion_time;\n const totalTokens = completion.usage?.completion_tokens || 0;\n\n const code = extractCodeFromFence(completion.choices[0].message.content);\n\n return new Response(\n JSON.stringify({\n code,\n performance: {\n tokensPerSecond: totalTokens / timeInSeconds,\n totalTokens,\n time: timeInSeconds,\n },\n }),\n {\n headers: { \"Content-Type\": \"application/json\" },\n },\n );\n }\n\n return new Response(\n `\n \n \n \n CerebrasCoder\n \n \n \n

\n \n \n \n \n `,\n {\n headers: { \"Content-Type\": \"text/html\" },\n },\n );\n}\n\nconst css = `\n body {\n margin: 0;\n padding: 20px;\n font-family: system-ui, sans-serif;\n background: #1a1a1a;\n color: #fff;\n }\n \n .container {\n display: flex;\n flex-direction: column;\n height: 100vh;\n gap: 20px;\n }\n \n .prompt-form {\n display: flex;\n gap: 10px;\n align-items: center;\n }\n \n .title {\n margin: 0;\n font-size: 1.2rem;\n font-weight: 900;\n white-space: nowrap;\n }\n \n .prompt-input {\n flex: 1;\n padding: 10px;\n border: 1px solid #333;\n border-radius: 4px;\n background: #2a2a2a;\n color: #fff;\n }\n \n button {\n padding: 10px 20px;\n border: none;\n border-radius: 4px;\n background: #4a4a4a;\n color: #fff;\n cursor: pointer;\n }\n \n button:disabled {\n opacity: 0.7;\n cursor: not-allowed;\n }\n \n .performance {\n display: flex;\n gap: 20px;\n justify-content: center;\n font-family: monospace;\n background: #2a2a2a;\n padding: 10px;\n border-radius: 4px;\n }\n \n .content {\n display: flex;\n gap: 20px;\n flex: 1;\n min-height: 0;\n }\n \n .code-section {\n flex: 1;\n overflow: auto;\n background: #2a2a2a;\n border-radius: 4px;\n }\n \n .preview-section {\n flex: 1;\n background: #2a2a2a;\n border-radius: 4px;\n overflow: hidden;\n }\n \n .preview-iframe {\n width: 100%;\n height: 100%;\n border: none;\n background: white;\n }\n`;","deleted","label",[139],"pulls","branches","envVars",{"_159":22,"_161":22},"connections",{"_159":22,"_160":22},"count","unfilledCount","emptyCount",{"_27":138,"_13":139,"_140":69,"_141":-5,"_142":92,"_143":24,"_144":53,"_54":163,"_90":22,"_146":147,"_148":149,"_150":20,"_151":-5,"_164":165,"_105":166},["D",1730389767958],"children",[],[139],["D",1746131054223],{"_11":12,"_37":103},{"_11":12,"_58":-5,"_59":103,"_42":68,"_61":62,"_63":20},{"_90":24,"_13":91,"_27":92,"_93":64,"_94":95,"_96":22,"_97":33,"_98":28,"_99":100,"_101":14,"_102":12},"ctx",{"_34":-5,"_127":204,"_205":206,"_207":208,"_209":20,"_210":20,"_211":20,"_212":53,"_213":-5,"_214":-7,"_215":-7,"_216":22,"_217":20,"_218":20,"_219":-5,"_220":20,"_221":20,"_222":20,"_223":-5},"ENV",{"_175":176,"_177":178,"_179":91,"_180":181,"_182":183,"_184":185,"_186":187,"_188":189,"_190":191,"_192":193,"_194":195,"_196":197,"_198":199,"_200":201,"_202":203},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","a3e067d4463eea85f6334f8e583e8516ae58c4f6","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"]

Cerebras Coder

Remixes1

Remixes
1