Stuff

5 files changed, 64 insertions, 15 deletions

diff --git a/package-lock.json b/package-lock.json
index c94114e..eb254d1 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -23,10 +23,16 @@
         "@vitejs/plugin-react": "^1.0.7",
         "eslint": "8.8.0",
         "eslint-plugin-react": "7.28.0",
+        "slam-types": "git://github.com/jantuomi/slam-types.git#a401431",
         "typescript": "^4.4.4",
         "vite": "^2.7.2"
       }
     },
+    "../slam-types": {
+      "version": "1.0.0",
+      "extraneous": true,
+      "license": "ISC"
+    },
     "node_modules/@ampproject/remapping": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.0.3.tgz",
@@ -3333,6 +3339,12 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/slam-types": {
+      "version": "1.0.0",
+      "resolved": "git+ssh://git@github.com/jantuomi/slam-types.git#a401431df444d5e1f8c4367226969ca7930b1991",
+      "dev": true,
+      "license": "ISC"
+    },
     "node_modules/slash": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
@@ -6039,6 +6051,11 @@
         "object-inspect": "^1.9.0"
       }
     },
+    "slam-types": {
+      "version": "git+ssh://git@github.com/jantuomi/slam-types.git#a401431df444d5e1f8c4367226969ca7930b1991",
+      "dev": true,
+      "from": "slam-types@git://github.com/jantuomi/slam-types.git#a401431"
+    },
     "slash": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
diff --git a/package.json b/package.json
index 557c64e..a1981f9 100644
--- a/package.json
+++ b/package.json
@@ -15,6 +15,7 @@
     "swr": "1.2.1"
   },
   "devDependencies": {
+    "slam-types": "git://github.com/jantuomi/slam-types.git#a401431",
     "@types/react": "^17.0.33",
     "@types/react-dom": "^17.0.10",
     "@typescript-eslint/eslint-plugin": "5.10.2",
@@ -25,4 +26,4 @@
     "typescript": "^4.4.4",
     "vite": "^2.7.2"
   }
-}
+}
\ No newline at end of file
diff --git a/src/Editor.module.css b/src/Editor.module.css
index e0bb076..5c0f626 100644
--- a/src/Editor.module.css
+++ b/src/Editor.module.css
@@ -1,5 +1,5 @@
 .runButton {
-  margin-top: 10px;
+  margin: 10px 0;
 }
 
 .error {
diff --git a/src/Editor.tsx b/src/Editor.tsx
index afce380..2fff5b9 100644
--- a/src/Editor.tsx
+++ b/src/Editor.tsx
@@ -3,7 +3,7 @@ import "ace-builds/src-noconflict/mode-java"
 import "ace-builds/src-noconflict/theme-github"
 import { useState } from "react"
 import styles from "./Editor.module.css"
-import { APIResult, submitSource, useExamples } from "./api"
+import { SubmitResult, submitSource, useExamples } from "./api"
 import Select from "react-select"
 
 const defaultSourceText = `define times2
@@ -17,7 +17,7 @@ const defaultSourceText = `define times2
 const Editor = () => {
   const examples = useExamples()
   const [sourceText, setSourceText] = useState(defaultSourceText)
-  const [result, setResult] = useState<APIResult<string, Error>>({ type: "not_yet_requested" })
+  const [result, setResult] = useState<SubmitResult>({ type: "not_yet_requested" })
   const onChange = setSourceText
 
   const executeCode = async (text: string) => {
@@ -69,20 +69,24 @@ const Editor = () => {
             Failed to run code on the server. See console for details.
           </div>
         )
-      case "success":
+      case "success": {
+        const text = `Output:\n${result.data}`
         return (
           <AceEditor
             mode=""
             theme="github"
             onChange={() => undefined}
-            value={result.data}
+            value={text}
             name="results"
             editorProps={{ $blockScrolling: true }}
             width="100%"
+            minLines={10}
+            maxLines={10}
             fontSize={16}
             readOnly
           />
         )
+      }
     }
   }
 
diff --git a/src/api.ts b/src/api.ts
index 725f0d8..7ac283b 100644
--- a/src/api.ts
+++ b/src/api.ts
@@ -1,8 +1,10 @@
 import useSWR, { SWRResponse } from "swr"
+import { RunnerApiSubmitRequest, RunnerApiSubmitResponse } from "slam-types"
 
-const API_URL = import.meta.env.VITE_API_URL
+const RUNNER_API_URL = String(import.meta.env.VITE_RUNNER_API_URL)
+const EXAMPLE_API_URL = String(import.meta.env.VITE_EXAMPLE_API_URL)
 
-const fetcher = (path: string) => fetch(`${API_URL}${path}`)
+const fetcher = (baseUrl: string) => (path: string) => fetch(`${baseUrl}${path}`)
   .then(res => res.json())
   .catch((err) => {
     console.error(`An error occurred when fetching API path ${path}`)
@@ -49,8 +51,14 @@ const mapSWRResult = <D, E>({ data, error }: SWRResponse<D, E>): APIResult<D, E>
   return { type: "success", data }
 }
 
-const postRequest = async <D, E>(path: string, body: any, opts?: any): Promise<APIResult<D, E>> => {
-  const url = `${API_URL}${path}`
+interface BasePostRequest<R> {
+  baseUrl: string
+  path: string
+  body: R
+}
+
+const postRequest = async <R, D, E>({ baseUrl, path, body }: BasePostRequest<R>, opts?: any): Promise<APIResult<D, E>> => {
+  const url = `${baseUrl}${path}`
   const body_ = typeof body === "string" ? body : JSON.stringify(body)
   try {
     const resp = await fetch(url, { method: "POST", body: body_, headers: {
@@ -70,10 +78,29 @@ const postRequest = async <D, E>(path: string, body: any, opts?: any): Promise<A
 }
 
 export const useExamples = () => mapSWRResult<Example[], Error>(
-  useSWR("/examples", fetcher),
+  useSWR("/examples", fetcher(EXAMPLE_API_URL)),
 )
 
-export const submitSource = async (text: string) => postRequest<string, Error>(
-  "/submit",
-  text,
-)
+export type SubmitResult = APIResult<RunnerApiSubmitResponse.Body["result"], Error>
+
+export const submitSource = async (text: string): Promise<SubmitResult> => {
+  const apiResult = await postRequest<RunnerApiSubmitRequest.Body, RunnerApiSubmitResponse.Body, Error>(
+    {
+      baseUrl: RUNNER_API_URL,
+      path: RunnerApiSubmitRequest.path,
+      body: {
+        source: text,
+      },
+    },
+  )
+
+  switch (apiResult.type) {
+    case "success":
+      return { type: "success", data: apiResult.data.result }
+    case "failed":
+      return { type: "failed", error: apiResult.error }
+    case "not_yet_requested":
+    case "loading":
+      return apiResult
+  }
+}