From c0abe50895cbaf2c61d5b79716c49c7a51f6d83a Mon Sep 17 00:00:00 2001
From: minhtrannhat <minh@minhtrannhat.com>
Date: Sun, 31 Dec 2023 20:09:06 -0500
Subject: [PATCH] Feat: Prompt engineering and better UI

---
 api/src/api/index.html | 31 ++++++++++++++++++++-----------
 api/src/api/src.py     | 10 +++++++++-
 2 files changed, 29 insertions(+), 12 deletions(-)

diff --git a/api/src/api/index.html b/api/src/api/index.html
index 5dee0d8..0fe491f 100644
--- a/api/src/api/index.html
+++ b/api/src/api/index.html
@@ -47,7 +47,7 @@
 
       const theme = createTheme({
         palette: {
-          mode: "dark",
+          mode: "light",
         },
       });
       const WS = new WebSocket("ws://localhost:8000/ws");
@@ -64,30 +64,39 @@
           };
         }, []);
 
+        const handleKeyUp = (e) => {
+          setLoading(false);
+          if (e.key === "Enter" && !e.ctrlKey) {
+            // If Enter is pressed without Ctrl, add a line break
+            setQuestion((prevQuestion) => prevQuestion + "\n");
+          } else if (e.ctrlKey && e.key === "Enter") {
+            // If Ctrl + Enter is pressed, prevent default and send to WebSocket
+            e.preventDefault();
+            setResponse("");
+            setLoading(true);
+            WS.send(question);
+          }
+        };
         return (
           <Container maxWidth="lg">
             <Box sx={{ my: 4 }}>
               <Typography variant="h4" component="h1" gutterBottom>
-                AI Assistant 🤓
+                IELTS Writing Task 2 Grading Assistant 🤓
               </Typography>
               <TextField
                 id="outlined-basic"
-                label="Ask me Anything"
+                label="Put in the prompt and the essay as 2 paragraphs. Use <Enter> key to create a new paragraph. To submit your prompt and essay, press <Ctrl> AND <Enter>."
                 variant="outlined"
                 style={{ width: "100%" }}
+                InputLabelProps={{ shrink: true }}
+                rows={5}
+                multiline
                 value={question}
                 disabled={loading}
                 onChange={(e) => {
                   setQuestion(e.target.value);
                 }}
-                onKeyUp={(e) => {
-                  setLoading(false);
-                  if (e.key === "Enter") {
-                    setResponse("");
-                    setLoading(true);
-                    WS.send(question);
-                  }
-                }}
+                onKeyUp={handleKeyUp}
               />
             </Box>
             {!response && loading && (
diff --git a/api/src/api/src.py b/api/src/api/src.py
index 96c8f78..bdca31f 100644
--- a/api/src/api/src.py
+++ b/api/src/api/src.py
@@ -27,7 +27,15 @@ async def get_ai_response(message: str) -> AsyncGenerator[str, None]:
         messages=[
             {
                 "role": "system",
-                "content": ("You are a IELTS writing task 2 grader." ""),
+                "content": (
+                    "You are a IELTS writing task 2 grader."
+                    "You will be given a prompt and an essay writen by the user."
+                    "Must let the user know if one of the inputs are invalid (not an IELTS writing task 2 prompt and/or not an IELTS essay)"
+                    "Do not write the essay for the user"
+                    "Tell the user if they did not send anything"
+                    "Give the scores in increments of 0.5 i.e 7.5 or 7..."
+                    "Give general feedback for the user essay. Then grade it on these 4 criterias: Task Response,Coherence and Cohesion, Lexical Resource, Grammartical Range and Accuracy. Give the score in each of these criteria"
+                ),
             },
             {
                 "role": "user",