File size: 10,948 Bytes
5efc49d
1
(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[931],{3092:function(e,t,r){Promise.resolve().then(r.bind(r,9413))},9413:function(e,t,r){"use strict";r.r(t),r.d(t,{default:function(){return q}});var n=r(7437),a=r(2265),o=e=>{let{text:t,speed:r=50}=e,[o,s]=(0,a.useState)(""),[l,i]=(0,a.useState)(!1);return(0,a.useEffect)(()=>{let e=0,n=t.length,a=setInterval(()=>{e<n?(s(t.slice(0,e+1)),e++):(clearInterval(a),i(!0))},r);return()=>clearInterval(a)},[t,r]),(0,n.jsxs)("span",{className:"inline-flex items-center",children:[o,!l&&(0,n.jsx)("span",{className:"ml-0.5 h-5 w-0.5 bg-current animate-blink"})]})},s=r(1994),l=r(3335);function i(){for(var e=arguments.length,t=Array(e),r=0;r<e;r++)t[r]=arguments[r];return(0,l.m6)((0,s.W)(t))}let d=a.forwardRef((e,t)=>{let{className:r,type:a,...o}=e;return(0,n.jsx)("input",{type:a,className:i("flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",r),ref:t,...o})});d.displayName="Input";var c=e=>{let{progress:t}=e;return(0,n.jsxs)("div",{className:"w-full max-w-md mb-6 bg-card rounded-lg shadow-md overflow-hidden",children:[(0,n.jsx)("div",{className:"px-4 py-3 bg-accent",children:(0,n.jsx)("h3",{className:"text-accent-foreground font-semibold",children:"Loading Progress"})}),(0,n.jsx)("div",{className:"p-4",children:(0,n.jsx)("p",{className:"text-card-foreground text-sm break-words",children:t})})]})},u=r(8811),m=r(5293);let f=(0,r(7712).j)("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",{variants:{variant:{default:"bg-primary text-primary-foreground shadow hover:bg-primary/90",destructive:"bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",outline:"border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",secondary:"bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",ghost:"hover:bg-accent hover:text-accent-foreground",link:"text-primary underline-offset-4 hover:underline"},size:{default:"h-9 px-4 py-2",sm:"h-8 rounded-md px-3 text-xs",lg:"h-10 rounded-md px-8",icon:"h-9 w-9"}},defaultVariants:{variant:"default",size:"default"}}),p=a.forwardRef((e,t)=>{let{className:r,variant:a,size:o,asChild:s=!1,...l}=e,d=s?m.g7:"button";return(0,n.jsx)(d,{className:i(f({variant:a,size:o,className:r})),ref:t,...l})});p.displayName="Button";var g=r(9304);let x=(e,t)=>"Awesome! I ran your code that helped me answer my question. It returned ".concat(e," and the printed output: ").concat(t,".\nNow respond to my original question using the result and the printed output, ignoring any message before this one."),h=null,b=null;async function w(e,t,r,n){try{(h=new g.Lh).setInitProgressCallback(y),await h.reload(e,{temperature:t,top_p:r}),n()}catch(e){throw console.error("Error loading model:",e),e}}function y(e){b&&b(e.text)}async function v(e,t,r,n){if(!h){n(Error("Engine not initialized"));return}try{let n,o="";for await(let r of(await h.chat.completions.create({stream:!0,messages:e,stream_options:{include_usage:!0}}))){var a;let e=null===(a=r.choices[0])||void 0===a?void 0:a.delta.content;e&&(o+=e),r.usage&&(n=r.usage),t(o)}let s=await h.getMessage();if(n)r(s,n);else throw Error("Usage data not available")}catch(e){n(e)}}async function j(e,t,r){let n=[{role:"system",content:"The user will ask you a tricky question, your job is to write Python code to answer the question.\n\nReally think step by step before writing any code to ensure you're writing the correct code to answer the question correctly.\n\nRespond with a markdown code block starting with ```python and ``` at the end. Make sure the code can be executed without any changes."},{role:"user",content:e}];try{await v(n,r.onResultUpdate,async(e,a)=>{r.onResultUpdate(e),r.onUsageUpdate(a);let o=function(e){let t=e.match(/```(?:python)?\n([\s\S]*?)\n```/);return t&&t[1]?t[1].trim():null}(e);o&&await N(o,t,r,n)},e=>E(e,r))}catch(e){E(e,r)}}async function N(e,t,r,n){try{let{results:a,error:o}=await t(e);if(o)E(Error(o),r);else if(a){let{stdout:t,result:o}=a,s="";null!=t&&""!==t&&"null"!==t&&(s+="".concat(t,"\n")),null!=o&&""!==o&&"null"!==o&&(s+="".concat(o)),s&&r.onCodeOutputUpdate(s.trim()),await k(n,"```python\n"+e+"\n```",{stdout:t,result:o},r)}}catch(e){E(e,r)}}async function k(e,t,r,n){let a=[...e,{role:"assistant",content:t},{role:"user",content:x(r.result,r.stdout)}];await v(a,n.onExplanationUpdate,(e,t)=>{n.onExplanationUpdate(e),n.onUsageUpdate(t)},e=>E(e,n,"Error generating explanation"))}function E(e,t){let r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"";t.onErrorUpdate(!0);let n=r?"".concat(r,": ").concat(e.message):e.message;t.onResultUpdate(n)}g.up.model_list.filter(e=>1!==e.model_type&&2!==e.model_type).map(e=>e.model_id);var U=r(7765),_=r(2069),S=r(9880),L=r(3037),C=r(3756);r(2446);var Z=r(9218),I=r(454),R=r(7647);_.Z.registerLanguage("typescript",Z.Z),_.Z.registerLanguage("javascript",I.Z),_.Z.registerLanguage("python",R.Z);let P=e=>{let{language:t,value:r}=e;return(0,n.jsxs)("div",{className:"relative group",children:[(0,n.jsx)("div",{className:"absolute top-0 right-0 bg-accent text-accent-foreground rounded-bl px-1.5 py-0.5 text-[10px] font-mono tracking-wide opacity-70 transition-opacity group-hover:opacity-100",children:t}),(0,n.jsx)(_.Z,{language:t,style:S.Z,showLineNumbers:!0,className:"rounded-md text-xs overflow-x-auto pt-5",children:r})]})};var M=e=>{let{content:t,className:r}=e;return(0,n.jsx)("div",{className:"prose prose-sm prose-invert max-w-none ".concat(r||""),children:(0,n.jsx)(U.U,{components:{code:e=>{let{className:t,children:r,...a}=e,o=/language-(\w+)/.exec(t||""),s=o?o[1]:"",l=String(r).replace(/\n$/,"");return s?(0,n.jsx)(P,{language:s,value:l,...a}):(0,n.jsx)("code",{className:"px-1 py-0.5 rounded bg-muted text-muted-foreground text-xs",...a,children:r})}},remarkPlugins:[L.Z],rehypePlugins:[C.Z],children:t})})};function q(){let[e,t]=(0,a.useState)(""),[s,l]=(0,a.useState)(null),[i,m]=(0,a.useState)(null),[f,g]=(0,a.useState)(!1),{runPython:x,isLoading:h}=function(){let[e,t]=(0,a.useState)(null),[n,o]=(0,a.useState)(!1);return(0,a.useEffect)(()=>{let e=new Worker(r.tu(new URL(r.p+r.u(583),r.b)));return t(e),()=>{e.terminate()}},[]),{runPython:(0,a.useCallback)(t=>new Promise((r,n)=>{if(!e){n(Error("Worker not initialized"));return}o(!0);let a=Date.now().toString(),s=t=>{t.data.id===a&&(o(!1),e.removeEventListener("message",s),t.data.results?r({results:t.data.results,error:null}):t.data.error&&r({results:null,error:t.data.error}))};e.addEventListener("message",s),e.postMessage({id:a,python:t})}),[e]),isLoading:n}}(),[y,v]=(0,a.useState)(!1),[N,k]=(0,a.useState)(null),[E,U]=(0,a.useState)(null),{isModelLoaded:_,isModelLoading:S,loadingProgress:L,handleLoadModel:C}=function(){let[e,t]=(0,a.useState)(!1),[r,n]=(0,a.useState)(!1),[o,s]=(0,a.useState)("");return(0,a.useEffect)(()=>{b=s},[]),{isModelLoaded:e,isModelLoading:r,loadingProgress:o,handleLoadModel:async()=>{n(!0);try{await w("Qwen2.5-Coder-1.5B-Instruct-q4f16_1-MLC",.7,1,()=>{t(!0),s("Model loaded successfully")})}catch(e){s(e.message)}finally{n(!1)}}}}(),Z=async t=>{if(t.preventDefault(),_&&!y){v(!0),l(""),m(""),k(null),g(!1),U(null);try{await j(e,x,{onResultUpdate:l,onCodeOutputUpdate:k,onExplanationUpdate:m,onErrorUpdate:g,onUsageUpdate:U})}catch(e){g(!0),l(e.message)}finally{v(!1)}}};return(0,n.jsx)("div",{className:"flex flex-col min-h-screen bg-background",children:(0,n.jsxs)("main",{className:"flex-grow flex flex-col items-center justify-center px-4 py-24",children:[(0,n.jsxs)("div",{className:"font-alphaLyrae text-center mb-8",children:[(0,n.jsx)("h1",{className:"font-extrabold text-foreground text-4xl sm:text-6xl",children:"Qwen Code Interpreter"}),(0,n.jsx)("p",{className:"text-muted-foreground text-xl sm:text-2xl mt-4",children:(0,n.jsx)(o,{speed:60,text:"Qwen-2.5-Coder 1.5B with access to an in-browser code interpreter."})})]}),!_&&(0,n.jsx)(p,{onClick:C,disabled:h||S,className:"mb-4 font-alphaLyrae px-6 py-6 bg-primary text-primary-foreground rounded-lg hover:bg-primary/90 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-opacity-50 disabled:opacity-50 disabled:cursor-not-allowed transition-colors duration-200 ease-in-out font-semibold text-lg shadow-md",children:S?(0,n.jsxs)("span",{className:"flex items-center",children:[(0,n.jsx)(u.Z,{className:"animate-spin -ml-1 mr-3 h-5 w-5 text-primary-foreground"}),"Loading..."]}):"Load AGI Mini 1.5B"}),L&&!_&&(0,n.jsx)(c,{progress:L}),(0,n.jsx)("form",{onSubmit:Z,className:"w-full max-w-2xl mb-4",children:(0,n.jsx)(d,{value:e,onChange:e=>t(e.target.value),onKeyDown:e=>{"Enter"!==e.key||e.shiftKey||(e.preventDefault(),Z(e))},className:"w-full p-8 font-mono text-sm bg-muted text-foreground border-input focus:ring-ring focus:border-input rounded-md resize-none placeholder:text-muted-foreground/70",placeholder:"How many r's are in 'strawberry'?",disabled:!_||y})}),y&&(0,n.jsx)("p",{className:"text-muted-foreground mt-4",children:"Streaming response..."}),f&&(0,n.jsxs)("div",{className:"bg-destructive/50 border border-destructive p-4 rounded-md mt-4 w-full max-w-2xl",children:[(0,n.jsx)("h3",{className:"text-destructive-foreground font-semibold mb-2",children:"Error:"}),(0,n.jsx)("pre",{className:"text-destructive-foreground whitespace-pre-wrap text-sm",children:s})]}),s&&!f&&(0,n.jsx)("div",{className:"bg-card p-4 rounded-t mt-4 w-full max-w-2xl overflow-auto",children:(0,n.jsx)(M,{content:s,className:"text-card-foreground"})}),N&&(0,n.jsxs)("div",{className:"bg-[hsl(var(--code-background))] p-4 w-full max-w-2xl overflow-auto border-t border-border",children:[(0,n.jsx)("h3",{className:"text-popover-foreground font-semibold mb-2",children:"Code Output:"}),(0,n.jsx)(M,{content:"```output\n".concat(N,"\n```")})]}),i&&(0,n.jsxs)("div",{className:"bg-accent p-4 rounded-b w-full max-w-2xl overflow-auto border-t border-border",children:[(0,n.jsxs)("div",{className:"flex justify-between items-center mb-2",children:[(0,n.jsx)("h3",{className:"text-accent-foreground font-semibold",children:"Explanation:"}),E&&(0,n.jsxs)("div",{className:"bg-secondary/20 text-secondary-foreground/80 rounded px-2 py-1 text-xs font-mono tracking-wide",children:[E.extra.decode_tokens_per_s.toFixed(2)," tok/s"]})]}),(0,n.jsx)(M,{content:i,className:"text-accent-foreground"})]})]})})}}},function(e){e.O(0,[329,954,333,17,971,117,744],function(){return e(e.s=3092)}),_N_E=e.O()}]);