Merge branch 'main' into function-calling

7 files changed, 52 insertions, 16 deletions

diff --git a/extension/react-app/src/components/ContinueButton.tsx b/extension/react-app/src/components/ContinueButton.tsx
index c6117bf9..ef6719b7 100644
--- a/extension/react-app/src/components/ContinueButton.tsx
+++ b/extension/react-app/src/components/ContinueButton.tsx
@@ -1,6 +1,8 @@
 import styled, { keyframes } from "styled-components";
 import { Button } from ".";
 import { Play } from "@styled-icons/heroicons-outline";
+import { useSelector } from "react-redux";
+import { RootStore } from "../redux/store";
 
 let StyledButton = styled(Button)`
   margin: auto;
@@ -25,14 +27,21 @@ let StyledButton = styled(Button)`
 `;
 
 function ContinueButton(props: { onClick?: () => void; hidden?: boolean }) {
+  const vscMediaUrl = useSelector(
+    (state: RootStore) => state.config.vscMediaUrl
+  );
+
   return (
     <StyledButton
       hidden={props.hidden}
       className="m-auto"
       onClick={props.onClick}
     >
-      <Play />
-      {/* <img src={"/continue_arrow.png"} width="16px"></img> */}
+      {vscMediaUrl ? (
+        <img src={`${vscMediaUrl}/play_button.png`} width="22px" />
+      ) : (
+        <Play />
+      )}
       Continue
     </StyledButton>
   );
diff --git a/extension/react-app/src/components/DebugPanel.tsx b/extension/react-app/src/components/DebugPanel.tsx
index 30f38779..94dbac9e 100644
--- a/extension/react-app/src/components/DebugPanel.tsx
+++ b/extension/react-app/src/components/DebugPanel.tsx
@@ -6,6 +6,7 @@ import {
   setApiUrl,
   setVscMachineId,
   setSessionId,
+  setVscMediaUrl,
 } from "../redux/slices/configSlice";
 import { setHighlightedCode } from "../redux/slices/miscSlice";
 import { updateFileSystem } from "../redux/slices/debugContexSlice";
@@ -37,6 +38,7 @@ function DebugPanel(props: DebugPanelProps) {
           dispatch(setApiUrl(event.data.apiUrl));
           dispatch(setVscMachineId(event.data.vscMachineId));
           dispatch(setSessionId(event.data.sessionId));
+          dispatch(setVscMediaUrl(event.data.vscMediaUrl));
           break;
         case "highlightedCode":
           dispatch(setHighlightedCode(event.data.rangeInFile));
diff --git a/extension/react-app/src/hooks/ContinueGUIClientProtocol.ts b/extension/react-app/src/hooks/ContinueGUIClientProtocol.ts
index 824bb086..3d8e0a38 100644
--- a/extension/react-app/src/hooks/ContinueGUIClientProtocol.ts
+++ b/extension/react-app/src/hooks/ContinueGUIClientProtocol.ts
@@ -13,6 +13,8 @@ abstract class AbstractContinueGUIClientProtocol {
     callback: (commands: { name: string; description: string }[]) => void
   ): void;
 
+  abstract changeDefaultModel(model: string): void;
+
   abstract sendClear(): void;
 
   abstract retryAtIndex(index: number): void;
diff --git a/extension/react-app/src/hooks/useContinueGUIProtocol.ts b/extension/react-app/src/hooks/useContinueGUIProtocol.ts
index 59397742..f43a66ff 100644
--- a/extension/react-app/src/hooks/useContinueGUIProtocol.ts
+++ b/extension/react-app/src/hooks/useContinueGUIProtocol.ts
@@ -55,6 +55,10 @@ class ContinueGUIClientProtocol extends AbstractContinueGUIClientProtocol {
     });
   }
 
+  changeDefaultModel(model: string) {
+    this.messenger.send("change_default_model", { model });
+  }
+
   sendClear() {
     this.messenger.send("clear_history", {});
   }
diff --git a/extension/react-app/src/redux/slices/configSlice.ts b/extension/react-app/src/redux/slices/configSlice.ts
index a6a641e6..1b107bed 100644
--- a/extension/react-app/src/redux/slices/configSlice.ts
+++ b/extension/react-app/src/redux/slices/configSlice.ts
@@ -37,9 +37,21 @@ export const configSlice = createSlice({
       ...state,
       sessionId: action.payload,
     }),
+    setVscMediaUrl: (
+      state: RootStore["config"],
+      action: { type: string; payload: string }
+    ) => ({
+      ...state,
+      vscMediaUrl: action.payload,
+    }),
   },
 });
 
-export const { setVscMachineId, setApiUrl, setWorkspacePath, setSessionId } =
-  configSlice.actions;
+export const {
+  setVscMachineId,
+  setApiUrl,
+  setWorkspacePath,
+  setSessionId,
+  setVscMediaUrl,
+} = configSlice.actions;
 export default configSlice.reducer;
diff --git a/extension/react-app/src/redux/store.ts b/extension/react-app/src/redux/store.ts
index f9eb0517..a5eef4ba 100644
--- a/extension/react-app/src/redux/store.ts
+++ b/extension/react-app/src/redux/store.ts
@@ -21,6 +21,7 @@ export interface RootStore {
     vscMachineId: string | undefined;
     sessionId: string | undefined;
     sessionStarted: number | undefined;
+    vscMediaUrl: string | undefined;
   };
   chat: {
     messages: ChatMessage[];
diff --git a/extension/react-app/src/tabs/gui.tsx b/extension/react-app/src/tabs/gui.tsx
index d6131174..5001fe4b 100644
--- a/extension/react-app/src/tabs/gui.tsx
+++ b/extension/react-app/src/tabs/gui.tsx
@@ -215,7 +215,7 @@ function GUI(props: GUIProps) {
   useEffect(() => {
     const listener = (e: any) => {
       // Cmd + J to toggle fast model
-      if (e.key === "j" && e.metaKey) {
+      if (e.key === "i" && e.metaKey && e.shiftKey) {
         setUsingFastModel((prev) => !prev);
       }
     };
@@ -230,21 +230,24 @@ function GUI(props: GUIProps) {
     console.log("CLIENT ON STATE UPDATE: ", client, client?.onStateUpdate);
     client?.onStateUpdate((state) => {
       // Scroll only if user is at very bottom of the window.
+      setUsingFastModel(state.default_model === "gpt-3.5-turbo");
       const shouldScrollToBottom =
         topGuiDivRef.current &&
         topGuiDivRef.current?.offsetHeight - window.scrollY < 100;
       setWaitingForSteps(state.active);
       setHistory(state.history);
       setUserInputQueue(state.user_input_queue);
-      const nextStepsOpen = [...stepsOpen];
-      for (
-        let i = nextStepsOpen.length;
-        i < state.history.timeline.length;
-        i++
-      ) {
-        nextStepsOpen.push(true);
-      }
-      setStepsOpen(nextStepsOpen);
+      setStepsOpen((prev) => {
+        const nextStepsOpen = [...prev];
+        for (
+          let i = nextStepsOpen.length;
+          i < state.history.timeline.length;
+          i++
+        ) {
+          nextStepsOpen.push(true);
+        }
+        return nextStepsOpen;
+      });
 
       if (shouldScrollToBottom) {
         scrollToBottom();
@@ -470,8 +473,11 @@ function GUI(props: GUIProps) {
             Contribute Data
           </span>
         </div>
-        {/* <HeaderButtonWithText
+        <HeaderButtonWithText
           onClick={() => {
+            client?.changeDefaultModel(
+              usingFastModel ? "gpt-4" : "gpt-3.5-turbo"
+            );
             setUsingFastModel((prev) => !prev);
           }}
           text={usingFastModel ? "gpt-3.5-turbo" : "gpt-4"}
@@ -481,7 +487,7 @@ function GUI(props: GUIProps) {
           >
             {usingFastModel ? "⚡" : "🧠"}
           </div>
-        </HeaderButtonWithText> */}
+        </HeaderButtonWithText>
         <HeaderButtonWithText
           onClick={() => {
             client?.sendClear();