From ad86eff7b06f0bfbed3b1cb362d83ec6a4348e45 Mon Sep 17 00:00:00 2001
From: Nate Sesti <sestinj@gmail.com>
Date: Fri, 2 Jun 2023 01:05:59 -0400
Subject: notebook -> gui

---
 extension/react-app/src/tabs/gui.tsx | 265 +++++++++++++++++++++++++++++++++++
 1 file changed, 265 insertions(+)
 create mode 100644 extension/react-app/src/tabs/gui.tsx

(limited to 'extension/react-app/src/tabs/gui.tsx')

diff --git a/extension/react-app/src/tabs/gui.tsx b/extension/react-app/src/tabs/gui.tsx
new file mode 100644
index 00000000..5ddddbfc
--- /dev/null
+++ b/extension/react-app/src/tabs/gui.tsx
@@ -0,0 +1,265 @@
+import styled from "styled-components";
+import {
+  Button,
+  defaultBorderRadius,
+  vscBackground,
+  MainTextInput,
+  Loader,
+} from "../components";
+import ContinueButton from "../components/ContinueButton";
+import { useCallback, useEffect, useRef, useState } from "react";
+import { History } from "../../../schema/History";
+import { HistoryNode } from "../../../schema/HistoryNode";
+import StepContainer from "../components/StepContainer";
+import { useSelector } from "react-redux";
+import { RootStore } from "../redux/store";
+import useContinueWebsocket from "../hooks/useWebsocket";
+import useContinueGUIProtocol from "../hooks/useWebsocket";
+
+let TopGUIDiv = styled.div`
+  display: grid;
+  grid-template-columns: 1fr;
+`;
+
+let UserInputQueueItem = styled.div`
+  border-radius: ${defaultBorderRadius};
+  color: gray;
+  padding: 8px;
+  margin: 8px;
+  text-align: center;
+`;
+
+interface GUIProps {
+  firstObservation?: any;
+}
+
+function GUI(props: GUIProps) {
+  const [waitingForSteps, setWaitingForSteps] = useState(false);
+  const [userInputQueue, setUserInputQueue] = useState<string[]>([]);
+  const [history, setHistory] = useState<History | undefined>();
+  //   {
+  //   timeline: [
+  //     {
+  //       step: {
+  //         name: "RunCodeStep",
+  //         cmd: "python3 /Users/natesesti/Desktop/continue/extension/examples/python/main.py",
+  //         description:
+  //           "Run `python3 /Users/natesesti/Desktop/continue/extension/examples/python/main.py`",
+  //       },
+  //       output: [
+  //         {
+  //           traceback: {
+  //             frames: [
+  //               {
+  //                 filepath:
+  //                   "/Users/natesesti/Desktop/continue/extension/examples/python/main.py",
+  //                 lineno: 7,
+  //                 function: "<module>",
+  //                 code: "print(sum(first, second))",
+  //               },
+  //             ],
+  //             message: "unsupported operand type(s) for +: 'int' and 'str'",
+  //             error_type:
+  //               '          ^^^^^^^^^^^^^^^^^^\n  File "/Users/natesesti/Desktop/continue/extension/examples/python/sum.py", line 2, in sum\n    return a + b\n           ~~^~~\nTypeError',
+  //             full_traceback:
+  //               "Traceback (most recent call last):\n  File \"/Users/natesesti/Desktop/continue/extension/examples/python/main.py\", line 7, in <module>\n    print(sum(first, second))\n          ^^^^^^^^^^^^^^^^^^\n  File \"/Users/natesesti/Desktop/continue/extension/examples/python/sum.py\", line 2, in sum\n    return a + b\n           ~~^~~\nTypeError: unsupported operand type(s) for +: 'int' and 'str'",
+  //           },
+  //         },
+  //         null,
+  //       ],
+  //     },
+  //     {
+  //       step: {
+  //         name: "EditCodeStep",
+  //         range_in_files: [
+  //           {
+  //             filepath:
+  //               "/Users/natesesti/Desktop/continue/extension/examples/python/main.py",
+  //             range: {
+  //               start: {
+  //                 line: 0,
+  //                 character: 0,
+  //               },
+  //               end: {
+  //                 line: 6,
+  //                 character: 25,
+  //               },
+  //             },
+  //           },
+  //         ],
+  //         prompt:
+  //           "I ran into this problem with my Python code:\n\n                Traceback (most recent call last):\n  File \"/Users/natesesti/Desktop/continue/extension/examples/python/main.py\", line 7, in <module>\n    print(sum(first, second))\n          ^^^^^^^^^^^^^^^^^^\n  File \"/Users/natesesti/Desktop/continue/extension/examples/python/sum.py\", line 2, in sum\n    return a + b\n           ~~^~~\nTypeError: unsupported operand type(s) for +: 'int' and 'str'\n\n                Below are the files that might need to be fixed:\n\n                {code}\n\n                This is what the code should be in order to avoid the problem:\n",
+  //         description:
+  //           "Editing files: /Users/natesesti/Desktop/continue/extension/examples/python/main.py",
+  //       },
+  //       output: [
+  //         null,
+  //         {
+  //           reversible: true,
+  //           actions: [
+  //             {
+  //               reversible: true,
+  //               filesystem: {},
+  //               filepath:
+  //                 "/Users/natesesti/Desktop/continue/extension/examples/python/main.py",
+  //               range: {
+  //                 start: {
+  //                   line: 0,
+  //                   character: 0,
+  //                 },
+  //                 end: {
+  //                   line: 6,
+  //                   character: 25,
+  //                 },
+  //               },
+  //               replacement:
+  //                 "\nfrom sum import sum\n\nfirst = 1\nsecond = 2\n\nprint(sum(first, second))",
+  //             },
+  //           ],
+  //         },
+  //       ],
+  //     },
+  //     {
+  //       step: {
+  //         name: "SolveTracebackStep",
+  //         traceback: {
+  //           frames: [
+  //             {
+  //               filepath:
+  //                 "/Users/natesesti/Desktop/continue/extension/examples/python/main.py",
+  //               lineno: 7,
+  //               function: "<module>",
+  //               code: "print(sum(first, second))",
+  //             },
+  //           ],
+  //           message: "unsupported operand type(s) for +: 'int' and 'str'",
+  //           error_type:
+  //             '          ^^^^^^^^^^^^^^^^^^\n  File "/Users/natesesti/Desktop/continue/extension/examples/python/sum.py", line 2, in sum\n    return a + b\n           ~~^~~\nTypeError',
+  //           full_traceback:
+  //             "Traceback (most recent call last):\n  File \"/Users/natesesti/Desktop/continue/extension/examples/python/main.py\", line 7, in <module>\n    print(sum(first, second))\n          ^^^^^^^^^^^^^^^^^^\n  File \"/Users/natesesti/Desktop/continue/extension/examples/python/sum.py\", line 2, in sum\n    return a + b\n           ~~^~~\nTypeError: unsupported operand type(s) for +: 'int' and 'str'",
+  //         },
+  //         description: "Running step: SolveTracebackStep",
+  //       },
+  //       output: [null, null],
+  //     },
+  //     {
+  //       step: {
+  //         name: "RunCodeStep",
+  //         cmd: "python3 /Users/natesesti/Desktop/continue/extension/examples/python/main.py",
+  //         description:
+  //           "Run `python3 /Users/natesesti/Desktop/continue/extension/examples/python/main.py`",
+  //       },
+  //       output: [null, null],
+  //     },
+  //   ],
+  //   current_index: 0,
+  // } as any
+  // );
+
+  const client = useContinueGUIProtocol();
+
+  useEffect(() => {
+    console.log("CLIENT ON STATE UPDATE: ", client, client?.onStateUpdate);
+    client?.onStateUpdate((state) => {
+      console.log("Received state update: ", state);
+      setWaitingForSteps(state.active);
+      setHistory(state.history);
+      setUserInputQueue(state.user_input_queue);
+    });
+  }, [client]);
+
+  const mainTextInputRef = useRef<HTMLTextAreaElement>(null);
+
+  useEffect(() => {
+    if (mainTextInputRef.current) {
+      mainTextInputRef.current.focus();
+      let handler = (event: any) => {
+        if (event.data.type === "focusContinueInput") {
+          mainTextInputRef.current?.focus();
+        }
+      };
+      window.addEventListener("message", handler);
+      return () => {
+        window.removeEventListener("message", handler);
+      };
+    }
+  }, [mainTextInputRef]);
+
+  const onMainTextInput = () => {
+    if (mainTextInputRef.current) {
+      if (!client) return;
+      let input = mainTextInputRef.current.value;
+      setWaitingForSteps(true);
+      client.sendMainInput(input);
+      setUserInputQueue((queue) => {
+        return [...queue, input];
+      });
+      mainTextInputRef.current.value = "";
+      mainTextInputRef.current.style.height = "";
+    }
+  };
+
+  const onStepUserInput = (input: string, index: number) => {
+    if (!client) return;
+    console.log("Sending step user input", input, index);
+    client.sendStepUserInput(input, index);
+  };
+
+  // const iterations = useSelector(selectIterations);
+  return (
+    <TopGUIDiv>
+      {typeof client === "undefined" && (
+        <>
+          <Loader></Loader>
+          <p>Server disconnected</p>
+        </>
+      )}
+      {history?.timeline.map((node: HistoryNode, index: number) => {
+        return (
+          <StepContainer
+            key={index}
+            onUserInput={(input: string) => {
+              onStepUserInput(input, index);
+            }}
+            inFuture={index > history?.current_index}
+            historyNode={node}
+            onRefinement={(input: string) => {
+              client?.sendRefinementInput(input, index);
+            }}
+            onReverse={() => {
+              client?.reverseToIndex(index);
+            }}
+          />
+        );
+      })}
+      {waitingForSteps && <Loader></Loader>}
+
+      <div>
+        {userInputQueue.map((input) => {
+          return <UserInputQueueItem>{input}</UserInputQueueItem>;
+        })}
+      </div>
+
+      <MainTextInput
+        ref={mainTextInputRef}
+        onKeyDown={(e) => {
+          if (e.key === "Enter") {
+            onMainTextInput();
+            e.stopPropagation();
+            e.preventDefault();
+          }
+        }}
+        rows={1}
+        onChange={() => {
+          let textarea = mainTextInputRef.current!;
+          textarea.style.height = ""; /* Reset the height*/
+          textarea.style.height =
+            Math.min(textarea.scrollHeight - 15, 500) + "px";
+        }}
+      ></MainTextInput>
+      <ContinueButton onClick={onMainTextInput}></ContinueButton>
+    </TopGUIDiv>
+  );
+}
+
+export default GUI;
-- 
cgit v1.2.3-70-g09d2


From aea318b48dd7e15df16eca12ba59c677671869aa Mon Sep 17 00:00:00 2001
From: Nate Sesti <sestinj@gmail.com>
Date: Fri, 2 Jun 2023 13:44:33 -0400
Subject: policy + starcoder description fixes

---
 continuedev/src/continuedev/core/policy.py          |   2 +-
 continuedev/src/continuedev/libs/steps/draft/dlt.py |  15 +++++++--------
 continuedev/src/continuedev/libs/steps/main.py      |   2 ++
 extension/package-lock.json                         |   4 ++--
 extension/package.json                              |   2 +-
 extension/react-app/src/tabs/gui.tsx                |  10 ++++++----
 .../scripts/continuedev-0.1.0-py3-none-any.whl      | Bin 57363 -> 55662 bytes
 7 files changed, 19 insertions(+), 16 deletions(-)

(limited to 'extension/react-app/src/tabs/gui.tsx')

diff --git a/continuedev/src/continuedev/core/policy.py b/continuedev/src/continuedev/core/policy.py
index 9f68515f..6e264bab 100644
--- a/continuedev/src/continuedev/core/policy.py
+++ b/continuedev/src/continuedev/core/policy.py
@@ -18,7 +18,7 @@ class DemoPolicy(Policy):
         if history.get_current() is None:
             return MessageStep(message="Welcome to Continue!") >> StepsOnStartupStep()
 
-        observation = history.last_observation()
+        observation = history.get_current().observation
         if observation is not None and isinstance(observation, UserInputObservation):
             # This could be defined with ObservationTypePolicy. Ergonomics not right though.
             if " test" in observation.user_input.lower():
diff --git a/continuedev/src/continuedev/libs/steps/draft/dlt.py b/continuedev/src/continuedev/libs/steps/draft/dlt.py
index f3417c9d..9cec5014 100644
--- a/continuedev/src/continuedev/libs/steps/draft/dlt.py
+++ b/continuedev/src/continuedev/libs/steps/draft/dlt.py
@@ -50,14 +50,7 @@ class SetupPipelineStep(Step):
 
 
 class ValidatePipelineStep(Step):
-
-    async def describe(self, models: Models):
-        return dedent("""\
-        This step will validate that your dlt pipeline is working as expected:
-        - Test that the API call works
-        - Load the data into a local DuckDB instance
-        - Write a query to view the data
-        """)
+    hide: bool = True
 
     async def run(self, sdk: ContinueSDK):
         source_name = sdk.history.last_observation().values["source_name"]
@@ -111,5 +104,11 @@ class CreatePipelineStep(Step):
                 - Write a query to view the data""")) >>
             WaitForUserInputStep(prompt="What API do you want to load data from?") >>
             SetupPipelineStep(api_description="WeatherAPI.com API") >>
+            MessageStep(message=dedent("""\
+                This step will validate that your dlt pipeline is working as expected:
+                - Test that the API call works
+                - Load the data into a local DuckDB instance
+                - Write a query to view the data
+                """)) >>
             ValidatePipelineStep()
         )
diff --git a/continuedev/src/continuedev/libs/steps/main.py b/continuedev/src/continuedev/libs/steps/main.py
index aefbe084..73ad3352 100644
--- a/continuedev/src/continuedev/libs/steps/main.py
+++ b/continuedev/src/continuedev/libs/steps/main.py
@@ -253,6 +253,8 @@ class StarCoderEditHighlightedCodeStep(Step):
             if completion.endswith(eot_token):
                 completion = completion[:completion.rindex(eot_token)]
 
+            self._prompt_and_completion += prompt + completion
+
             await sdk.ide.applyFileSystemEdit(
                 FileEdit(filepath=rif.filepath, range=rif.range, replacement=completion))
             await sdk.ide.saveFile(rif.filepath)
diff --git a/extension/package-lock.json b/extension/package-lock.json
index ff4dbfa1..647e3aa2 100644
--- a/extension/package-lock.json
+++ b/extension/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "continue",
-  "version": "0.0.11",
+  "version": "0.0.13",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "continue",
-      "version": "0.0.11",
+      "version": "0.0.13",
       "license": "Apache-2.0",
       "dependencies": {
         "@electron/rebuild": "^3.2.10",
diff --git a/extension/package.json b/extension/package.json
index 8f1eabde..1219ca8e 100644
--- a/extension/package.json
+++ b/extension/package.json
@@ -14,7 +14,7 @@
   "displayName": "Continue",
   "pricing": "Free",
   "description": "Refine code 10x faster",
-  "version": "0.0.11",
+  "version": "0.0.13",
   "publisher": "Continue",
   "engines": {
     "vscode": "^1.74.0"
diff --git a/extension/react-app/src/tabs/gui.tsx b/extension/react-app/src/tabs/gui.tsx
index 5ddddbfc..42ad4ed5 100644
--- a/extension/react-app/src/tabs/gui.tsx
+++ b/extension/react-app/src/tabs/gui.tsx
@@ -19,6 +19,7 @@ import useContinueGUIProtocol from "../hooks/useWebsocket";
 let TopGUIDiv = styled.div`
   display: grid;
   grid-template-columns: 1fr;
+  overflow: scroll;
 `;
 
 let UserInputQueueItem = styled.div`
@@ -37,7 +38,7 @@ function GUI(props: GUIProps) {
   const [waitingForSteps, setWaitingForSteps] = useState(false);
   const [userInputQueue, setUserInputQueue] = useState<string[]>([]);
   const [history, setHistory] = useState<History | undefined>();
-  //   {
+  // {
   //   timeline: [
   //     {
   //       step: {
@@ -153,8 +154,7 @@ function GUI(props: GUIProps) {
   //     },
   //   ],
   //   current_index: 0,
-  // } as any
-  // );
+  // } as any);
 
   const client = useContinueGUIProtocol();
 
@@ -211,7 +211,9 @@ function GUI(props: GUIProps) {
       {typeof client === "undefined" && (
         <>
           <Loader></Loader>
-          <p>Server disconnected</p>
+          <p style={{ textAlign: "center" }}>
+            Trying to reconnect with server...
+          </p>
         </>
       )}
       {history?.timeline.map((node: HistoryNode, index: number) => {
diff --git a/extension/scripts/continuedev-0.1.0-py3-none-any.whl b/extension/scripts/continuedev-0.1.0-py3-none-any.whl
index 6cda6f2d..fd3f48d1 100644
Binary files a/extension/scripts/continuedev-0.1.0-py3-none-any.whl and b/extension/scripts/continuedev-0.1.0-py3-none-any.whl differ
-- 
cgit v1.2.3-70-g09d2

