From 4f35463f8907066acab259129ef35d767ae2bb3c Mon Sep 17 00:00:00 2001
From: moonrailgun <moonrailgun@gmail.com>
Date: Wed, 3 Jan 2024 00:15:39 +0800
Subject: [PATCH] perf: improver code editor request return type and test modal
 style

---
 src/client/components/CodeEditor/lib/sandbox.ts   | 8 +++++++-
 src/client/components/CodeEditor/main.tsx         | 3 +++
 src/client/components/monitor/provider/custom.tsx | 3 ++-
 src/server/model/monitor/provider/custom.ts       | 7 ++++++-
 src/server/trpc/routers/monitor.ts                | 8 +++++++-
 src/server/utils/sandbox.ts                       | 1 +
 6 files changed, 26 insertions(+), 4 deletions(-)

diff --git a/src/client/components/CodeEditor/lib/sandbox.ts b/src/client/components/CodeEditor/lib/sandbox.ts
index 9863c20..0bf47d8 100644
--- a/src/client/components/CodeEditor/lib/sandbox.ts
+++ b/src/client/components/CodeEditor/lib/sandbox.ts
@@ -44,5 +44,11 @@ interface AxiosConfig {
   } | false;
 }
 
-const request = async (config: AxiosConfig) => {}
+interface RequestReturn {
+  headers: Record<string, string>;
+  data: any;
+  status: number;
+}
+
+const request = async (config: AxiosConfig): Promise<RequestReturn> => {}
 `;
diff --git a/src/client/components/CodeEditor/main.tsx b/src/client/components/CodeEditor/main.tsx
index f7ba808..7b179eb 100644
--- a/src/client/components/CodeEditor/main.tsx
+++ b/src/client/components/CodeEditor/main.tsx
@@ -26,6 +26,9 @@ export const CodeEditor: React.FC<CodeEditorProps> = React.memo((props) => {
       theme={theme}
       defaultLanguage="javascript"
       value={props.value}
+      options={{
+        tabSize: 2,
+      }}
       onChange={(val) => props.onChange?.(val ?? '')}
       beforeMount={handleEditorWillMount}
     />
diff --git a/src/client/components/monitor/provider/custom.tsx b/src/client/components/monitor/provider/custom.tsx
index c041651..691dd2a 100644
--- a/src/client/components/monitor/provider/custom.tsx
+++ b/src/client/components/monitor/provider/custom.tsx
@@ -27,6 +27,7 @@ export const MonitorCustom: React.FC = React.memo(() => {
       centered: true,
       maskClosable: true,
       title: 'Run Completed',
+      width: 'clamp(320px, 60vw, 860px)',
       content: (
         <div>
           {logger.map(([type, time, ...args]) => (
@@ -43,7 +44,7 @@ export const MonitorCustom: React.FC = React.memo(() => {
                 {dayjs(time).format('HH:mm:ss')}
               </span>
 
-              {args.join(' ')}
+              <span className="break-all">{args.join(' ')}</span>
             </div>
           ))}
 
diff --git a/src/server/model/monitor/provider/custom.ts b/src/server/model/monitor/provider/custom.ts
index 52bb9d2..d646379 100644
--- a/src/server/model/monitor/provider/custom.ts
+++ b/src/server/model/monitor/provider/custom.ts
@@ -27,7 +27,12 @@ export async function runCodeInVM(_code: string) {
   const start = Date.now();
   const isolate = new ivm.Isolate({ memoryLimit: env.sandboxMemoryLimit });
 
-  const code = `${environmentScript}\n\n;(async () => {${_code}})()`;
+  // avoid end comment with line break
+  const code = `${environmentScript}
+
+;(async () => {
+  ${_code}
+})()`;
 
   const [context, script] = await Promise.all([
     isolate.createContext(),
diff --git a/src/server/trpc/routers/monitor.ts b/src/server/trpc/routers/monitor.ts
index 38ea9e8..3ce3aa2 100644
--- a/src/server/trpc/routers/monitor.ts
+++ b/src/server/trpc/routers/monitor.ts
@@ -187,7 +187,13 @@ export const monitorRouter = router({
       })
     )
     .mutation(async ({ input }) => {
-      return runCodeInVM(input.code);
+      const res = await runCodeInVM(input.code);
+
+      return {
+        logger: res.logger,
+        result: res.result ?? -1,
+        usage: res.usage,
+      };
     }),
   data: workspaceProcedure
     .meta(
diff --git a/src/server/utils/sandbox.ts b/src/server/utils/sandbox.ts
index bfa533e..611ddec 100644
--- a/src/server/utils/sandbox.ts
+++ b/src/server/utils/sandbox.ts
@@ -155,6 +155,7 @@ export function buildSandbox(context: Context, globals: SandboxGlobals = {}) {
       const result = await axios.request(config);
 
       return makeTransferable({
+        headers: { ...result.headers },
         data: result.data,
         status: result.status,
       });