From 328b75c94935afb54f7b05433101610ca7c18a33 Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Wed, 6 Dec 2023 12:04:12 -0500
Subject: [PATCH 01/22] update status

---
 frontend/src/App.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index a7910b9..93afce7 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -30,7 +30,7 @@ import { USER_CLOSE_WEB_SOCKET_CODE } from "./constants";
 import CodeTab from "./components/CodeTab";
 import OutputSettingsSection from "./components/OutputSettingsSection";
 
-const IS_OPENAI_DOWN = false;
+const IS_OPENAI_DOWN = true;
 
 function App() {
   const [appState, setAppState] = useState<AppState>(AppState.INITIAL);

From f216146bbd46b49b72f960460d97aac6e5277250 Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Wed, 6 Dec 2023 14:49:09 -0500
Subject: [PATCH 02/22] initial history implementation

---
 frontend/package.json                      |  1 +
 frontend/src/App.tsx                       | 36 ++++++++++++++++-
 frontend/src/components/HistoryDisplay.tsx | 42 ++++++++++++++++++++
 frontend/src/components/ui/scroll-area.tsx | 46 ++++++++++++++++++++++
 frontend/src/history_types.ts              | 40 +++++++++++++++++++
 frontend/yarn.lock                         | 16 ++++++++
 6 files changed, 179 insertions(+), 2 deletions(-)
 create mode 100644 frontend/src/components/HistoryDisplay.tsx
 create mode 100644 frontend/src/components/ui/scroll-area.tsx
 create mode 100644 frontend/src/history_types.ts

diff --git a/frontend/package.json b/frontend/package.json
index 901a83a..8a68a62 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -21,6 +21,7 @@
     "@radix-ui/react-label": "^2.0.2",
     "@radix-ui/react-popover": "^1.0.7",
     "@radix-ui/react-progress": "^1.0.3",
+    "@radix-ui/react-scroll-area": "^1.0.5",
     "@radix-ui/react-select": "^2.0.0",
     "@radix-ui/react-separator": "^1.0.3",
     "@radix-ui/react-slot": "^1.0.2",
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 93afce7..e68f16d 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -29,8 +29,10 @@ import html2canvas from "html2canvas";
 import { USER_CLOSE_WEB_SOCKET_CODE } from "./constants";
 import CodeTab from "./components/CodeTab";
 import OutputSettingsSection from "./components/OutputSettingsSection";
+import { History } from "./history_types";
+import HistoryDisplay from "./components/HistoryDisplay";
 
-const IS_OPENAI_DOWN = true;
+const IS_OPENAI_DOWN = false;
 
 function App() {
   const [appState, setAppState] = useState<AppState>(AppState.INITIAL);
@@ -54,6 +56,9 @@ function App() {
     "setting"
   );
 
+  // App history
+  const [appHistory, setAppHistory] = useState<History>([]);
+
   const [shouldIncludeResultImage, setShouldIncludeResultImage] =
     useState<boolean>(false);
 
@@ -107,6 +112,7 @@ function App() {
     setReferenceImages([]);
     setExecutionConsole([]);
     setHistory([]);
+    setAppHistory([]);
   };
 
   const stop = () => {
@@ -128,7 +134,32 @@ function App() {
       (token) => setGeneratedCode((prev) => prev + token),
       (code) => setGeneratedCode(code),
       (line) => setExecutionConsole((prev) => [...prev, line]),
-      () => setAppState(AppState.CODE_READY)
+      () => {
+        setAppState(AppState.CODE_READY);
+        if (params.generationType === "create") {
+          setAppHistory([
+            {
+              type: "ai_create",
+              code: generatedCode,
+              // TODO: Doesn't typecheck correctly
+              inputs: { image_url: referenceImages[0] },
+            },
+          ]);
+        } else {
+          setAppHistory((prev) => [
+            {
+              type: "ai_edit",
+              code: generatedCode,
+              // TODO: Doesn't typecheck correctly
+              inputs: {
+                previous_commands: [],
+                new_instruction: updateInstruction,
+              },
+            },
+            ...prev,
+          ]);
+        }
+      }
     );
   }
 
@@ -317,6 +348,7 @@ function App() {
               </div>
             </>
           )}
+          {<HistoryDisplay history={appHistory} />}
         </div>
       </div>
 
diff --git a/frontend/src/components/HistoryDisplay.tsx b/frontend/src/components/HistoryDisplay.tsx
new file mode 100644
index 0000000..26a428f
--- /dev/null
+++ b/frontend/src/components/HistoryDisplay.tsx
@@ -0,0 +1,42 @@
+import { ScrollArea } from "@/components/ui/scroll-area";
+import { History, HistoryItemType } from "../history_types";
+
+interface Props {
+  history: History;
+}
+
+function displayHistoryItemType(itemType: HistoryItemType) {
+  switch (itemType) {
+    case "ai_create":
+      return "Create";
+    case "ai_edit":
+      return "Edit";
+    case "code_create":
+      return "Create";
+    case "code_edit":
+      return "Code Edit";
+    case "revert":
+      return "Revert";
+    default:
+      // TODO: Error out since this is exhaustive
+      return "Unknown";
+  }
+}
+
+export default function HistoryDisplay({ history }: Props) {
+  return (
+    <div className="flex flex-col h-screen p-4">
+      <h1 className="font-bold mb-4">History</h1>
+      <ScrollArea className="flex-1 overflow-y-auto">
+        <ul className="space-y-4">
+          {history.map((item, index) => (
+            <li className="flex items-center space-x-4 justify-between border-b pb-1">
+              <h2 className="text-sm">{displayHistoryItemType(item.type)}</h2>
+              <h2 className="text-sm">v{history.length - index}</h2>
+            </li>
+          ))}
+        </ul>
+      </ScrollArea>
+    </div>
+  );
+}
diff --git a/frontend/src/components/ui/scroll-area.tsx b/frontend/src/components/ui/scroll-area.tsx
new file mode 100644
index 0000000..cf253cf
--- /dev/null
+++ b/frontend/src/components/ui/scroll-area.tsx
@@ -0,0 +1,46 @@
+import * as React from "react"
+import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area"
+
+import { cn } from "@/lib/utils"
+
+const ScrollArea = React.forwardRef<
+  React.ElementRef<typeof ScrollAreaPrimitive.Root>,
+  React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Root>
+>(({ className, children, ...props }, ref) => (
+  <ScrollAreaPrimitive.Root
+    ref={ref}
+    className={cn("relative overflow-hidden", className)}
+    {...props}
+  >
+    <ScrollAreaPrimitive.Viewport className="h-full w-full rounded-[inherit]">
+      {children}
+    </ScrollAreaPrimitive.Viewport>
+    <ScrollBar />
+    <ScrollAreaPrimitive.Corner />
+  </ScrollAreaPrimitive.Root>
+))
+ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName
+
+const ScrollBar = React.forwardRef<
+  React.ElementRef<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>,
+  React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>
+>(({ className, orientation = "vertical", ...props }, ref) => (
+  <ScrollAreaPrimitive.ScrollAreaScrollbar
+    ref={ref}
+    orientation={orientation}
+    className={cn(
+      "flex touch-none select-none transition-colors",
+      orientation === "vertical" &&
+        "h-full w-2.5 border-l border-l-transparent p-[1px]",
+      orientation === "horizontal" &&
+        "h-2.5 flex-col border-t border-t-transparent p-[1px]",
+      className
+    )}
+    {...props}
+  >
+    <ScrollAreaPrimitive.ScrollAreaThumb className="relative flex-1 rounded-full bg-border" />
+  </ScrollAreaPrimitive.ScrollAreaScrollbar>
+))
+ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName
+
+export { ScrollArea, ScrollBar }
diff --git a/frontend/src/history_types.ts b/frontend/src/history_types.ts
new file mode 100644
index 0000000..1486a99
--- /dev/null
+++ b/frontend/src/history_types.ts
@@ -0,0 +1,40 @@
+export type HistoryItemType =
+  | "ai_create"
+  | "code_create"
+  | "ai_edit"
+  | "revert"
+  | "code_edit";
+
+export type HistoryItem = {
+  type: HistoryItemType;
+  code?: string;
+  inputs:
+    | AiCreateInputs
+    | CodeCreateInputs
+    | AiEditInputs
+    | RevertInputs
+    | CodeEditInputs;
+};
+
+export type AiCreateInputs = {
+  image_url?: string;
+};
+
+export type CodeCreateInputs = {
+  // Define specific properties relevant for code creation
+};
+
+export type AiEditInputs = {
+  previous_commands: string[];
+  new_instruction: string;
+};
+
+export type RevertInputs = {
+  parent: number;
+};
+
+export type CodeEditInputs = {
+  // TODO: Fill in
+};
+
+export type History = HistoryItem[];
diff --git a/frontend/yarn.lock b/frontend/yarn.lock
index d2a33d1..66b48db 100644
--- a/frontend/yarn.lock
+++ b/frontend/yarn.lock
@@ -894,6 +894,22 @@
     "@radix-ui/react-use-callback-ref" "1.0.1"
     "@radix-ui/react-use-controllable-state" "1.0.1"
 
+"@radix-ui/react-scroll-area@^1.0.5":
+  version "1.0.5"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-scroll-area/-/react-scroll-area-1.0.5.tgz#01160c6893f24a2ddb5aa399ae5b3ba84ad4d3cc"
+  integrity sha512-b6PAgH4GQf9QEn8zbT2XUHpW5z8BzqEc7Kl11TwDrvuTrxlkcjTD5qa/bxgKr+nmuXKu4L/W5UZ4mlP/VG/5Gw==
+  dependencies:
+    "@babel/runtime" "^7.13.10"
+    "@radix-ui/number" "1.0.1"
+    "@radix-ui/primitive" "1.0.1"
+    "@radix-ui/react-compose-refs" "1.0.1"
+    "@radix-ui/react-context" "1.0.1"
+    "@radix-ui/react-direction" "1.0.1"
+    "@radix-ui/react-presence" "1.0.1"
+    "@radix-ui/react-primitive" "1.0.3"
+    "@radix-ui/react-use-callback-ref" "1.0.1"
+    "@radix-ui/react-use-layout-effect" "1.0.1"
+
 "@radix-ui/react-select@^2.0.0":
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-select/-/react-select-2.0.0.tgz#a3511792a51a7018d6559357323a7f52e0e38887"

From 8a48c6d8986c2f27a6c2196db7bc483d3018a26e Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Wed, 6 Dec 2023 15:16:58 -0500
Subject: [PATCH 03/22] add TODO

---
 frontend/src/App.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index e68f16d..3e4701c 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -152,6 +152,7 @@ function App() {
               code: generatedCode,
               // TODO: Doesn't typecheck correctly
               inputs: {
+                // TODO: Fix this
                 previous_commands: [],
                 new_instruction: updateInstruction,
               },

From 75198cf6388bba71df0026cc3a827a9738d86d65 Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Wed, 6 Dec 2023 15:32:40 -0500
Subject: [PATCH 04/22] allow viewing older versions

---
 frontend/src/App.tsx                       | 32 +++++++++++++++++-----
 frontend/src/components/HistoryDisplay.tsx |  9 ++++--
 frontend/src/history_types.ts              |  2 +-
 3 files changed, 33 insertions(+), 10 deletions(-)

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 3e4701c..248e1ff 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -37,10 +37,13 @@ const IS_OPENAI_DOWN = false;
 function App() {
   const [appState, setAppState] = useState<AppState>(AppState.INITIAL);
   const [generatedCode, setGeneratedCode] = useState<string>("");
+
   const [referenceImages, setReferenceImages] = useState<string[]>([]);
   const [executionConsole, setExecutionConsole] = useState<string[]>([]);
   const [updateInstruction, setUpdateInstruction] = useState("");
   const [history, setHistory] = useState<string[]>([]);
+
+  // Settings
   const [settings, setSettings] = usePersistedState<Settings>(
     {
       openAiApiKey: null,
@@ -132,15 +135,13 @@ function App() {
       wsRef,
       updatedParams,
       (token) => setGeneratedCode((prev) => prev + token),
-      (code) => setGeneratedCode(code),
-      (line) => setExecutionConsole((prev) => [...prev, line]),
-      () => {
-        setAppState(AppState.CODE_READY);
+      (code) => {
+        setGeneratedCode(code);
         if (params.generationType === "create") {
           setAppHistory([
             {
               type: "ai_create",
-              code: generatedCode,
+              code,
               // TODO: Doesn't typecheck correctly
               inputs: { image_url: referenceImages[0] },
             },
@@ -149,7 +150,7 @@ function App() {
           setAppHistory((prev) => [
             {
               type: "ai_edit",
-              code: generatedCode,
+              code,
               // TODO: Doesn't typecheck correctly
               inputs: {
                 // TODO: Fix this
@@ -160,6 +161,10 @@ function App() {
             ...prev,
           ]);
         }
+      },
+      (line) => setExecutionConsole((prev) => [...prev, line]),
+      () => {
+        setAppState(AppState.CODE_READY);
       }
     );
   }
@@ -349,7 +354,20 @@ function App() {
               </div>
             </>
           )}
-          {<HistoryDisplay history={appHistory} />}
+          {
+            <HistoryDisplay
+              history={appHistory}
+              revertToVersion={(index) => {
+                if (
+                  index < 0 ||
+                  index >= appHistory.length ||
+                  !appHistory[index]
+                )
+                  return;
+                setGeneratedCode(appHistory[index].code);
+              }}
+            />
+          }
         </div>
       </div>
 
diff --git a/frontend/src/components/HistoryDisplay.tsx b/frontend/src/components/HistoryDisplay.tsx
index 26a428f..2d76783 100644
--- a/frontend/src/components/HistoryDisplay.tsx
+++ b/frontend/src/components/HistoryDisplay.tsx
@@ -3,6 +3,7 @@ import { History, HistoryItemType } from "../history_types";
 
 interface Props {
   history: History;
+  revertToVersion: (version: number) => void;
 }
 
 function displayHistoryItemType(itemType: HistoryItemType) {
@@ -23,14 +24,18 @@ function displayHistoryItemType(itemType: HistoryItemType) {
   }
 }
 
-export default function HistoryDisplay({ history }: Props) {
+export default function HistoryDisplay({ history, revertToVersion }: Props) {
   return (
     <div className="flex flex-col h-screen p-4">
       <h1 className="font-bold mb-4">History</h1>
       <ScrollArea className="flex-1 overflow-y-auto">
         <ul className="space-y-4">
           {history.map((item, index) => (
-            <li className="flex items-center space-x-4 justify-between border-b pb-1">
+            <li
+              key={index}
+              className="flex items-center space-x-4 justify-between border-b pb-1 cursor-pointer"
+              onClick={() => revertToVersion(index)}
+            >
               <h2 className="text-sm">{displayHistoryItemType(item.type)}</h2>
               <h2 className="text-sm">v{history.length - index}</h2>
             </li>
diff --git a/frontend/src/history_types.ts b/frontend/src/history_types.ts
index 1486a99..6fbaafe 100644
--- a/frontend/src/history_types.ts
+++ b/frontend/src/history_types.ts
@@ -7,7 +7,7 @@ export type HistoryItemType =
 
 export type HistoryItem = {
   type: HistoryItemType;
-  code?: string;
+  code: string;
   inputs:
     | AiCreateInputs
     | CodeCreateInputs

From 3d16d784c2624168b95f72c7dabd742977d9cc11 Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Wed, 6 Dec 2023 15:37:59 -0500
Subject: [PATCH 05/22] improve look of history display

---
 frontend/src/components/HistoryDisplay.tsx | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/frontend/src/components/HistoryDisplay.tsx b/frontend/src/components/HistoryDisplay.tsx
index 2d76783..0306cf1 100644
--- a/frontend/src/components/HistoryDisplay.tsx
+++ b/frontend/src/components/HistoryDisplay.tsx
@@ -25,15 +25,16 @@ function displayHistoryItemType(itemType: HistoryItemType) {
 }
 
 export default function HistoryDisplay({ history, revertToVersion }: Props) {
-  return (
-    <div className="flex flex-col h-screen p-4">
-      <h1 className="font-bold mb-4">History</h1>
+  return history.length === 0 ? null : (
+    <div className="flex flex-col h-screen">
+      <h1 className="font-bold mb-2">History</h1>
       <ScrollArea className="flex-1 overflow-y-auto">
-        <ul className="space-y-4">
+        <ul className="space-y-0">
           {history.map((item, index) => (
             <li
               key={index}
-              className="flex items-center space-x-4 justify-between border-b pb-1 cursor-pointer"
+              className="flex items-center space-x-2 justify-between p-2
+              border-b cursor-pointer hover:bg-black hover:text-white"
               onClick={() => revertToVersion(index)}
             >
               <h2 className="text-sm">{displayHistoryItemType(item.type)}</h2>

From 8008513a6c64dc85c56fc9703da5cc7716d4daf8 Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Wed, 6 Dec 2023 15:42:33 -0500
Subject: [PATCH 06/22] handle coding state correctly

---
 frontend/src/App.tsx                       |  1 +
 frontend/src/components/HistoryDisplay.tsx | 16 ++++++++++++++--
 2 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 248e1ff..d4b772e 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -366,6 +366,7 @@ function App() {
                   return;
                 setGeneratedCode(appHistory[index].code);
               }}
+              shouldDisableReverts={appState === AppState.CODING}
             />
           }
         </div>
diff --git a/frontend/src/components/HistoryDisplay.tsx b/frontend/src/components/HistoryDisplay.tsx
index 0306cf1..58908f2 100644
--- a/frontend/src/components/HistoryDisplay.tsx
+++ b/frontend/src/components/HistoryDisplay.tsx
@@ -1,9 +1,11 @@
 import { ScrollArea } from "@/components/ui/scroll-area";
 import { History, HistoryItemType } from "../history_types";
+import toast from "react-hot-toast";
 
 interface Props {
   history: History;
   revertToVersion: (version: number) => void;
+  shouldDisableReverts: boolean;
 }
 
 function displayHistoryItemType(itemType: HistoryItemType) {
@@ -24,7 +26,11 @@ function displayHistoryItemType(itemType: HistoryItemType) {
   }
 }
 
-export default function HistoryDisplay({ history, revertToVersion }: Props) {
+export default function HistoryDisplay({
+  history,
+  revertToVersion,
+  shouldDisableReverts,
+}: Props) {
   return history.length === 0 ? null : (
     <div className="flex flex-col h-screen">
       <h1 className="font-bold mb-2">History</h1>
@@ -35,7 +41,13 @@ export default function HistoryDisplay({ history, revertToVersion }: Props) {
               key={index}
               className="flex items-center space-x-2 justify-between p-2
               border-b cursor-pointer hover:bg-black hover:text-white"
-              onClick={() => revertToVersion(index)}
+              onClick={() =>
+                shouldDisableReverts
+                  ? toast.error(
+                      "Please wait for code generation to complete before viewing an older version"
+                    )
+                  : revertToVersion(index)
+              }
             >
               <h2 className="text-sm">{displayHistoryItemType(item.type)}</h2>
               <h2 className="text-sm">v{history.length - index}</h2>

From c1d6236391715451c87381c360c5c5a4aa50c010 Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Wed, 6 Dec 2023 15:45:14 -0500
Subject: [PATCH 07/22] minor fix

---
 frontend/src/components/HistoryDisplay.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/components/HistoryDisplay.tsx b/frontend/src/components/HistoryDisplay.tsx
index 58908f2..3808b71 100644
--- a/frontend/src/components/HistoryDisplay.tsx
+++ b/frontend/src/components/HistoryDisplay.tsx
@@ -44,7 +44,7 @@ export default function HistoryDisplay({
               onClick={() =>
                 shouldDisableReverts
                   ? toast.error(
-                      "Please wait for code generation to complete before viewing an older version"
+                      "Please wait for code generation to complete before viewing an older version."
                     )
                   : revertToVersion(index)
               }

From 286549f101ed16b214f1092e1eb9df036df9e6a2 Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Wed, 6 Dec 2023 16:02:52 -0500
Subject: [PATCH 08/22] track current version

---
 frontend/src/App.tsx                       | 32 ++++++++++++++--------
 frontend/src/components/HistoryDisplay.tsx | 13 +++++++--
 2 files changed, 31 insertions(+), 14 deletions(-)

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index d4b772e..cbefcfe 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -61,6 +61,7 @@ function App() {
 
   // App history
   const [appHistory, setAppHistory] = useState<History>([]);
+  const [currentVersion, setCurrentVersion] = useState<number | null>(null);
 
   const [shouldIncludeResultImage, setShouldIncludeResultImage] =
     useState<boolean>(false);
@@ -146,20 +147,25 @@ function App() {
               inputs: { image_url: referenceImages[0] },
             },
           ]);
+          setCurrentVersion(0);
         } else {
-          setAppHistory((prev) => [
-            {
-              type: "ai_edit",
-              code,
-              // TODO: Doesn't typecheck correctly
-              inputs: {
-                // TODO: Fix this
-                previous_commands: [],
-                new_instruction: updateInstruction,
+          setAppHistory((prev) => {
+            const newHistory: History = [
+              {
+                type: "ai_edit",
+                code,
+                // TODO: Doesn't typecheck correctly
+                inputs: {
+                  // TODO: Fix this
+                  previous_commands: [],
+                  new_instruction: updateInstruction,
+                },
               },
-            },
-            ...prev,
-          ]);
+              ...prev,
+            ];
+            setCurrentVersion(0);
+            return newHistory;
+          });
         }
       },
       (line) => setExecutionConsole((prev) => [...prev, line]),
@@ -357,6 +363,7 @@ function App() {
           {
             <HistoryDisplay
               history={appHistory}
+              currentVersion={currentVersion}
               revertToVersion={(index) => {
                 if (
                   index < 0 ||
@@ -364,6 +371,7 @@ function App() {
                   !appHistory[index]
                 )
                   return;
+                setCurrentVersion(index);
                 setGeneratedCode(appHistory[index].code);
               }}
               shouldDisableReverts={appState === AppState.CODING}
diff --git a/frontend/src/components/HistoryDisplay.tsx b/frontend/src/components/HistoryDisplay.tsx
index 3808b71..49a295d 100644
--- a/frontend/src/components/HistoryDisplay.tsx
+++ b/frontend/src/components/HistoryDisplay.tsx
@@ -1,9 +1,11 @@
 import { ScrollArea } from "@/components/ui/scroll-area";
 import { History, HistoryItemType } from "../history_types";
 import toast from "react-hot-toast";
+import classNames from "classnames";
 
 interface Props {
   history: History;
+  currentVersion: number | null;
   revertToVersion: (version: number) => void;
   shouldDisableReverts: boolean;
 }
@@ -28,6 +30,7 @@ function displayHistoryItemType(itemType: HistoryItemType) {
 
 export default function HistoryDisplay({
   history,
+  currentVersion,
   revertToVersion,
   shouldDisableReverts,
 }: Props) {
@@ -39,8 +42,14 @@ export default function HistoryDisplay({
           {history.map((item, index) => (
             <li
               key={index}
-              className="flex items-center space-x-2 justify-between p-2
-              border-b cursor-pointer hover:bg-black hover:text-white"
+              className={classNames(
+                "flex items-center space-x-2 justify-between p-2",
+                "border-b cursor-pointer",
+                {
+                  " hover:bg-black hover:text-white": index !== currentVersion,
+                  "bg-slate-500 text-white": index === currentVersion,
+                }
+              )}
               onClick={() =>
                 shouldDisableReverts
                   ? toast.error(

From a5e7dcd037636d40e9bce1605fe558c48679b832 Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Wed, 6 Dec 2023 17:15:08 -0500
Subject: [PATCH 09/22] correctly extract history for an update

---
 frontend/src/App.tsx                       | 28 +++++++++-----
 frontend/src/components/HistoryDisplay.tsx | 29 +++++++++++---
 frontend/src/history_types.ts              | 45 +++++++---------------
 3 files changed, 55 insertions(+), 47 deletions(-)

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index cbefcfe..fc5521a 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -30,7 +30,10 @@ import { USER_CLOSE_WEB_SOCKET_CODE } from "./constants";
 import CodeTab from "./components/CodeTab";
 import OutputSettingsSection from "./components/OutputSettingsSection";
 import { History } from "./history_types";
-import HistoryDisplay from "./components/HistoryDisplay";
+import HistoryDisplay, {
+  extractHistoryTree,
+} from "./components/HistoryDisplay";
+import toast from "react-hot-toast";
 
 const IS_OPENAI_DOWN = false;
 
@@ -41,7 +44,6 @@ function App() {
   const [referenceImages, setReferenceImages] = useState<string[]>([]);
   const [executionConsole, setExecutionConsole] = useState<string[]>([]);
   const [updateInstruction, setUpdateInstruction] = useState("");
-  const [history, setHistory] = useState<string[]>([]);
 
   // Settings
   const [settings, setSettings] = usePersistedState<Settings>(
@@ -61,6 +63,7 @@ function App() {
 
   // App history
   const [appHistory, setAppHistory] = useState<History>([]);
+  // Tracks the currently viewed version from app history
   const [currentVersion, setCurrentVersion] = useState<number | null>(null);
 
   const [shouldIncludeResultImage, setShouldIncludeResultImage] =
@@ -115,7 +118,6 @@ function App() {
     setGeneratedCode("");
     setReferenceImages([]);
     setExecutionConsole([]);
-    setHistory([]);
     setAppHistory([]);
   };
 
@@ -143,7 +145,6 @@ function App() {
             {
               type: "ai_create",
               code,
-              // TODO: Doesn't typecheck correctly
               inputs: { image_url: referenceImages[0] },
             },
           ]);
@@ -154,11 +155,8 @@ function App() {
               {
                 type: "ai_edit",
                 code,
-                // TODO: Doesn't typecheck correctly
                 inputs: {
-                  // TODO: Fix this
-                  previous_commands: [],
-                  new_instruction: updateInstruction,
+                  prompt: updateInstruction,
                 },
               },
               ...prev,
@@ -191,7 +189,18 @@ function App() {
 
   // Subsequent updates
   async function doUpdate() {
-    const updatedHistory = [...history, generatedCode, updateInstruction];
+    if (currentVersion === null) {
+      toast.error(
+        "No current version set. Contact support or open a Github issue."
+      );
+      return;
+    }
+
+    const updatedHistory = [
+      ...extractHistoryTree(appHistory, currentVersion),
+      updateInstruction,
+    ];
+
     if (shouldIncludeResultImage) {
       const resultImage = await takeScreenshot();
       doGenerateCode({
@@ -208,7 +217,6 @@ function App() {
       });
     }
 
-    setHistory(updatedHistory);
     setGeneratedCode("");
     setUpdateInstruction("");
   }
diff --git a/frontend/src/components/HistoryDisplay.tsx b/frontend/src/components/HistoryDisplay.tsx
index 49a295d..69eb025 100644
--- a/frontend/src/components/HistoryDisplay.tsx
+++ b/frontend/src/components/HistoryDisplay.tsx
@@ -10,18 +10,35 @@ interface Props {
   shouldDisableReverts: boolean;
 }
 
+export function extractHistoryTree(
+  history: History,
+  version: number
+): string[] {
+  // History is in reverse chronological order
+
+  // Get all history items up to the current version
+  const extractedHistory = history.slice(version);
+
+  const obj: string[] = [];
+
+  // Reverse the history so that it is in chronological order for the server
+  extractedHistory.reverse().forEach((item) => {
+    // Don't include the image for ai_create since the server gets it passed and will include it directly
+    if (item.type !== "ai_create") {
+      obj.push(item.inputs.prompt);
+    }
+    obj.push(item.code);
+  });
+
+  return obj;
+}
+
 function displayHistoryItemType(itemType: HistoryItemType) {
   switch (itemType) {
     case "ai_create":
       return "Create";
     case "ai_edit":
       return "Edit";
-    case "code_create":
-      return "Create";
-    case "code_edit":
-      return "Code Edit";
-    case "revert":
-      return "Revert";
     default:
       // TODO: Error out since this is exhaustive
       return "Unknown";
diff --git a/frontend/src/history_types.ts b/frontend/src/history_types.ts
index 6fbaafe..ab19825 100644
--- a/frontend/src/history_types.ts
+++ b/frontend/src/history_types.ts
@@ -1,40 +1,23 @@
-export type HistoryItemType =
-  | "ai_create"
-  | "code_create"
-  | "ai_edit"
-  | "revert"
-  | "code_edit";
+export type HistoryItemType = "ai_create" | "ai_edit";
 
-export type HistoryItem = {
-  type: HistoryItemType;
-  code: string;
-  inputs:
-    | AiCreateInputs
-    | CodeCreateInputs
-    | AiEditInputs
-    | RevertInputs
-    | CodeEditInputs;
-};
+export type HistoryItem =
+  | {
+      type: "ai_create";
+      code: string;
+      inputs: AiCreateInputs;
+    }
+  | {
+      type: "ai_edit";
+      code: string;
+      inputs: AiEditInputs;
+    };
 
 export type AiCreateInputs = {
-  image_url?: string;
-};
-
-export type CodeCreateInputs = {
-  // Define specific properties relevant for code creation
+  image_url: string;
 };
 
 export type AiEditInputs = {
-  previous_commands: string[];
-  new_instruction: string;
-};
-
-export type RevertInputs = {
-  parent: number;
-};
-
-export type CodeEditInputs = {
-  // TODO: Fill in
+  prompt: string;
 };
 
 export type History = HistoryItem[];

From 79e36c95296406b5fd3225901c6f6c119fb8b4d3 Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Wed, 6 Dec 2023 19:07:22 -0500
Subject: [PATCH 10/22] move files around

---
 frontend/src/App.tsx                          |  5 ++--
 .../{ => history}/HistoryDisplay.tsx          | 25 +------------------
 frontend/src/components/history/utils.ts      | 24 ++++++++++++++++++
 3 files changed, 27 insertions(+), 27 deletions(-)
 rename frontend/src/components/{ => history}/HistoryDisplay.tsx (72%)
 create mode 100644 frontend/src/components/history/utils.ts

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index fc5521a..22ec502 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -30,9 +30,8 @@ import { USER_CLOSE_WEB_SOCKET_CODE } from "./constants";
 import CodeTab from "./components/CodeTab";
 import OutputSettingsSection from "./components/OutputSettingsSection";
 import { History } from "./history_types";
-import HistoryDisplay, {
-  extractHistoryTree,
-} from "./components/HistoryDisplay";
+import HistoryDisplay from "./components/history/HistoryDisplay";
+import { extractHistoryTree } from "./components/history/utils";
 import toast from "react-hot-toast";
 
 const IS_OPENAI_DOWN = false;
diff --git a/frontend/src/components/HistoryDisplay.tsx b/frontend/src/components/history/HistoryDisplay.tsx
similarity index 72%
rename from frontend/src/components/HistoryDisplay.tsx
rename to frontend/src/components/history/HistoryDisplay.tsx
index 69eb025..b626df4 100644
--- a/frontend/src/components/HistoryDisplay.tsx
+++ b/frontend/src/components/history/HistoryDisplay.tsx
@@ -1,5 +1,5 @@
 import { ScrollArea } from "@/components/ui/scroll-area";
-import { History, HistoryItemType } from "../history_types";
+import { History, HistoryItemType } from "../../history_types";
 import toast from "react-hot-toast";
 import classNames from "classnames";
 
@@ -10,29 +10,6 @@ interface Props {
   shouldDisableReverts: boolean;
 }
 
-export function extractHistoryTree(
-  history: History,
-  version: number
-): string[] {
-  // History is in reverse chronological order
-
-  // Get all history items up to the current version
-  const extractedHistory = history.slice(version);
-
-  const obj: string[] = [];
-
-  // Reverse the history so that it is in chronological order for the server
-  extractedHistory.reverse().forEach((item) => {
-    // Don't include the image for ai_create since the server gets it passed and will include it directly
-    if (item.type !== "ai_create") {
-      obj.push(item.inputs.prompt);
-    }
-    obj.push(item.code);
-  });
-
-  return obj;
-}
-
 function displayHistoryItemType(itemType: HistoryItemType) {
   switch (itemType) {
     case "ai_create":
diff --git a/frontend/src/components/history/utils.ts b/frontend/src/components/history/utils.ts
new file mode 100644
index 0000000..8c7065f
--- /dev/null
+++ b/frontend/src/components/history/utils.ts
@@ -0,0 +1,24 @@
+import { History } from "../../history_types";
+
+export function extractHistoryTree(
+  history: History,
+  version: number
+): string[] {
+  // History is in reverse chronological order
+
+  // Get all history items up to the current version
+  const extractedHistory = history.slice(version);
+
+  const obj: string[] = [];
+
+  // Reverse the history so that it is in chronological order for the server
+  extractedHistory.reverse().forEach((item) => {
+    // Don't include the image for ai_create since the server gets it passed and will include it directly
+    if (item.type !== "ai_create") {
+      obj.push(item.inputs.prompt);
+    }
+    obj.push(item.code);
+  });
+
+  return obj;
+}

From 97d651343a0fef7c5b1eac17a1d947e624b3dfc5 Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Wed, 6 Dec 2023 21:57:25 -0500
Subject: [PATCH 11/22] add some tests for history utils

---
 frontend/package.json                         |   6 +-
 frontend/src/components/history/utils.test.ts |  38 ++
 frontend/yarn.lock                            | 603 +++++++++++++++++-
 3 files changed, 640 insertions(+), 7 deletions(-)
 create mode 100644 frontend/src/components/history/utils.test.ts

diff --git a/frontend/package.json b/frontend/package.json
index 8a68a62..f5154cb 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -9,7 +9,8 @@
     "build": "tsc && vite build",
     "build-hosted": "tsc && vite build --mode prod",
     "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
-    "preview": "vite preview"
+    "preview": "vite preview",
+    "test": "vitest"
   },
   "dependencies": {
     "@codemirror/lang-html": "^6.4.6",
@@ -58,7 +59,8 @@
     "tailwindcss": "^3.3.5",
     "typescript": "^5.0.2",
     "vite": "^4.4.5",
-    "vite-plugin-html": "^3.2.0"
+    "vite-plugin-html": "^3.2.0",
+    "vitest": "^1.0.1"
   },
   "engines": {
     "node": ">=14.18.0"
diff --git a/frontend/src/components/history/utils.test.ts b/frontend/src/components/history/utils.test.ts
new file mode 100644
index 0000000..340d0d0
--- /dev/null
+++ b/frontend/src/components/history/utils.test.ts
@@ -0,0 +1,38 @@
+import { expect, test } from "vitest";
+import { extractHistoryTree } from "./utils";
+
+const data = [
+  {
+    type: "ai_edit" as const,
+    code: "<html>edit with better icons and red text</html>",
+    inputs: {
+      prompt: "make text red",
+    },
+  },
+  {
+    type: "ai_edit" as const,
+    code: "<html>edit with better icons</html>",
+    inputs: {
+      prompt: "use better icons",
+    },
+  },
+  {
+    type: "ai_create" as const,
+    code: "<html>create</html>",
+    inputs: {
+      image_url: "",
+    },
+  },
+];
+
+test("should only include history from this point onward", () => {
+  expect(extractHistoryTree(data, 0)).toEqual([
+    "<html>create</html>",
+    "use better icons",
+    "<html>edit with better icons</html>",
+    "make text red",
+    "<html>edit with better icons and red text</html>",
+  ]);
+
+  expect(extractHistoryTree(data, 2)).toEqual(["<html>create</html>"]);
+});
diff --git a/frontend/yarn.lock b/frontend/yarn.lock
index 66b48db..3062080 100644
--- a/frontend/yarn.lock
+++ b/frontend/yarn.lock
@@ -333,111 +333,221 @@
   resolved "https://registry.yarnpkg.com/@esbuild/android-arm64/-/android-arm64-0.18.20.tgz#984b4f9c8d0377443cc2dfcef266d02244593622"
   integrity sha512-Nz4rJcchGDtENV0eMKUNa6L12zz2zBDXuhj/Vjh18zGqB44Bi7MBMSXjgunJgjRhCmKOjnPuZp4Mb6OKqtMHLQ==
 
+"@esbuild/android-arm64@0.19.8":
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/@esbuild/android-arm64/-/android-arm64-0.19.8.tgz#fb7130103835b6d43ea499c3f30cfb2b2ed58456"
+  integrity sha512-B8JbS61bEunhfx8kasogFENgQfr/dIp+ggYXwTqdbMAgGDhRa3AaPpQMuQU0rNxDLECj6FhDzk1cF9WHMVwrtA==
+
 "@esbuild/android-arm@0.18.20":
   version "0.18.20"
   resolved "https://registry.yarnpkg.com/@esbuild/android-arm/-/android-arm-0.18.20.tgz#fedb265bc3a589c84cc11f810804f234947c3682"
   integrity sha512-fyi7TDI/ijKKNZTUJAQqiG5T7YjJXgnzkURqmGj13C6dCqckZBLdl4h7bkhHt/t0WP+zO9/zwroDvANaOqO5Sw==
 
+"@esbuild/android-arm@0.19.8":
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/@esbuild/android-arm/-/android-arm-0.19.8.tgz#b46e4d9e984e6d6db6c4224d72c86b7757e35bcb"
+  integrity sha512-31E2lxlGM1KEfivQl8Yf5aYU/mflz9g06H6S15ITUFQueMFtFjESRMoDSkvMo8thYvLBax+VKTPlpnx+sPicOA==
+
 "@esbuild/android-x64@0.18.20":
   version "0.18.20"
   resolved "https://registry.yarnpkg.com/@esbuild/android-x64/-/android-x64-0.18.20.tgz#35cf419c4cfc8babe8893d296cd990e9e9f756f2"
   integrity sha512-8GDdlePJA8D6zlZYJV/jnrRAi6rOiNaCC/JclcXpB+KIuvfBN4owLtgzY2bsxnx666XjJx2kDPUmnTtR8qKQUg==
 
+"@esbuild/android-x64@0.19.8":
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/@esbuild/android-x64/-/android-x64-0.19.8.tgz#a13db9441b5a4f4e4fec4a6f8ffacfea07888db7"
+  integrity sha512-rdqqYfRIn4jWOp+lzQttYMa2Xar3OK9Yt2fhOhzFXqg0rVWEfSclJvZq5fZslnz6ypHvVf3CT7qyf0A5pM682A==
+
 "@esbuild/darwin-arm64@0.18.20":
   version "0.18.20"
   resolved "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.18.20.tgz"
   integrity sha512-bxRHW5kHU38zS2lPTPOyuyTm+S+eobPUnTNkdJEfAddYgEcll4xkT8DB9d2008DtTbl7uJag2HuE5NZAZgnNEA==
 
+"@esbuild/darwin-arm64@0.19.8":
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/@esbuild/darwin-arm64/-/darwin-arm64-0.19.8.tgz#49f5718d36541f40dd62bfdf84da9c65168a0fc2"
+  integrity sha512-RQw9DemMbIq35Bprbboyf8SmOr4UXsRVxJ97LgB55VKKeJOOdvsIPy0nFyF2l8U+h4PtBx/1kRf0BelOYCiQcw==
+
 "@esbuild/darwin-x64@0.18.20":
   version "0.18.20"
   resolved "https://registry.yarnpkg.com/@esbuild/darwin-x64/-/darwin-x64-0.18.20.tgz#d70d5790d8bf475556b67d0f8b7c5bdff053d85d"
   integrity sha512-pc5gxlMDxzm513qPGbCbDukOdsGtKhfxD1zJKXjCCcU7ju50O7MeAZ8c4krSJcOIJGFR+qx21yMMVYwiQvyTyQ==
 
+"@esbuild/darwin-x64@0.19.8":
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/@esbuild/darwin-x64/-/darwin-x64-0.19.8.tgz#75c5c88371eea4bfc1f9ecfd0e75104c74a481ac"
+  integrity sha512-3sur80OT9YdeZwIVgERAysAbwncom7b4bCI2XKLjMfPymTud7e/oY4y+ci1XVp5TfQp/bppn7xLw1n/oSQY3/Q==
+
 "@esbuild/freebsd-arm64@0.18.20":
   version "0.18.20"
   resolved "https://registry.yarnpkg.com/@esbuild/freebsd-arm64/-/freebsd-arm64-0.18.20.tgz#98755cd12707f93f210e2494d6a4b51b96977f54"
   integrity sha512-yqDQHy4QHevpMAaxhhIwYPMv1NECwOvIpGCZkECn8w2WFHXjEwrBn3CeNIYsibZ/iZEUemj++M26W3cNR5h+Tw==
 
+"@esbuild/freebsd-arm64@0.19.8":
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-arm64/-/freebsd-arm64-0.19.8.tgz#9d7259fea4fd2b5f7437b52b542816e89d7c8575"
+  integrity sha512-WAnPJSDattvS/XtPCTj1tPoTxERjcTpH6HsMr6ujTT+X6rylVe8ggxk8pVxzf5U1wh5sPODpawNicF5ta/9Tmw==
+
 "@esbuild/freebsd-x64@0.18.20":
   version "0.18.20"
   resolved "https://registry.yarnpkg.com/@esbuild/freebsd-x64/-/freebsd-x64-0.18.20.tgz#c1eb2bff03915f87c29cece4c1a7fa1f423b066e"
   integrity sha512-tgWRPPuQsd3RmBZwarGVHZQvtzfEBOreNuxEMKFcd5DaDn2PbBxfwLcj4+aenoh7ctXcbXmOQIn8HI6mCSw5MQ==
 
+"@esbuild/freebsd-x64@0.19.8":
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-x64/-/freebsd-x64-0.19.8.tgz#abac03e1c4c7c75ee8add6d76ec592f46dbb39e3"
+  integrity sha512-ICvZyOplIjmmhjd6mxi+zxSdpPTKFfyPPQMQTK/w+8eNK6WV01AjIztJALDtwNNfFhfZLux0tZLC+U9nSyA5Zg==
+
 "@esbuild/linux-arm64@0.18.20":
   version "0.18.20"
   resolved "https://registry.yarnpkg.com/@esbuild/linux-arm64/-/linux-arm64-0.18.20.tgz#bad4238bd8f4fc25b5a021280c770ab5fc3a02a0"
   integrity sha512-2YbscF+UL7SQAVIpnWvYwM+3LskyDmPhe31pE7/aoTMFKKzIc9lLbyGUpmmb8a8AixOL61sQ/mFh3jEjHYFvdA==
 
+"@esbuild/linux-arm64@0.19.8":
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm64/-/linux-arm64-0.19.8.tgz#c577932cf4feeaa43cb9cec27b89cbe0df7d9098"
+  integrity sha512-z1zMZivxDLHWnyGOctT9JP70h0beY54xDDDJt4VpTX+iwA77IFsE1vCXWmprajJGa+ZYSqkSbRQ4eyLCpCmiCQ==
+
 "@esbuild/linux-arm@0.18.20":
   version "0.18.20"
   resolved "https://registry.yarnpkg.com/@esbuild/linux-arm/-/linux-arm-0.18.20.tgz#3e617c61f33508a27150ee417543c8ab5acc73b0"
   integrity sha512-/5bHkMWnq1EgKr1V+Ybz3s1hWXok7mDFUMQ4cG10AfW3wL02PSZi5kFpYKrptDsgb2WAJIvRcDm+qIvXf/apvg==
 
+"@esbuild/linux-arm@0.19.8":
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm/-/linux-arm-0.19.8.tgz#d6014d8b98b5cbc96b95dad3d14d75bb364fdc0f"
+  integrity sha512-H4vmI5PYqSvosPaTJuEppU9oz1dq2A7Mr2vyg5TF9Ga+3+MGgBdGzcyBP7qK9MrwFQZlvNyJrvz6GuCaj3OukQ==
+
 "@esbuild/linux-ia32@0.18.20":
   version "0.18.20"
   resolved "https://registry.yarnpkg.com/@esbuild/linux-ia32/-/linux-ia32-0.18.20.tgz#699391cccba9aee6019b7f9892eb99219f1570a7"
   integrity sha512-P4etWwq6IsReT0E1KHU40bOnzMHoH73aXp96Fs8TIT6z9Hu8G6+0SHSw9i2isWrD2nbx2qo5yUqACgdfVGx7TA==
 
+"@esbuild/linux-ia32@0.19.8":
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-ia32/-/linux-ia32-0.19.8.tgz#2379a0554307d19ac4a6cdc15b08f0ea28e7a40d"
+  integrity sha512-1a8suQiFJmZz1khm/rDglOc8lavtzEMRo0v6WhPgxkrjcU0LkHj+TwBrALwoz/OtMExvsqbbMI0ChyelKabSvQ==
+
 "@esbuild/linux-loong64@0.18.20":
   version "0.18.20"
   resolved "https://registry.yarnpkg.com/@esbuild/linux-loong64/-/linux-loong64-0.18.20.tgz#e6fccb7aac178dd2ffb9860465ac89d7f23b977d"
   integrity sha512-nXW8nqBTrOpDLPgPY9uV+/1DjxoQ7DoB2N8eocyq8I9XuqJ7BiAMDMf9n1xZM9TgW0J8zrquIb/A7s3BJv7rjg==
 
+"@esbuild/linux-loong64@0.19.8":
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-loong64/-/linux-loong64-0.19.8.tgz#e2a5bbffe15748b49356a6cd7b2d5bf60c5a7123"
+  integrity sha512-fHZWS2JJxnXt1uYJsDv9+b60WCc2RlvVAy1F76qOLtXRO+H4mjt3Tr6MJ5l7Q78X8KgCFudnTuiQRBhULUyBKQ==
+
 "@esbuild/linux-mips64el@0.18.20":
   version "0.18.20"
   resolved "https://registry.yarnpkg.com/@esbuild/linux-mips64el/-/linux-mips64el-0.18.20.tgz#eeff3a937de9c2310de30622a957ad1bd9183231"
   integrity sha512-d5NeaXZcHp8PzYy5VnXV3VSd2D328Zb+9dEq5HE6bw6+N86JVPExrA6O68OPwobntbNJ0pzCpUFZTo3w0GyetQ==
 
+"@esbuild/linux-mips64el@0.19.8":
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-mips64el/-/linux-mips64el-0.19.8.tgz#1359331e6f6214f26f4b08db9b9df661c57cfa24"
+  integrity sha512-Wy/z0EL5qZYLX66dVnEg9riiwls5IYnziwuju2oUiuxVc+/edvqXa04qNtbrs0Ukatg5HEzqT94Zs7J207dN5Q==
+
 "@esbuild/linux-ppc64@0.18.20":
   version "0.18.20"
   resolved "https://registry.yarnpkg.com/@esbuild/linux-ppc64/-/linux-ppc64-0.18.20.tgz#2f7156bde20b01527993e6881435ad79ba9599fb"
   integrity sha512-WHPyeScRNcmANnLQkq6AfyXRFr5D6N2sKgkFo2FqguP44Nw2eyDlbTdZwd9GYk98DZG9QItIiTlFLHJHjxP3FA==
 
+"@esbuild/linux-ppc64@0.19.8":
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-ppc64/-/linux-ppc64-0.19.8.tgz#9ba436addc1646dc89dae48c62d3e951ffe70951"
+  integrity sha512-ETaW6245wK23YIEufhMQ3HSeHO7NgsLx8gygBVldRHKhOlD1oNeNy/P67mIh1zPn2Hr2HLieQrt6tWrVwuqrxg==
+
 "@esbuild/linux-riscv64@0.18.20":
   version "0.18.20"
   resolved "https://registry.yarnpkg.com/@esbuild/linux-riscv64/-/linux-riscv64-0.18.20.tgz#6628389f210123d8b4743045af8caa7d4ddfc7a6"
   integrity sha512-WSxo6h5ecI5XH34KC7w5veNnKkju3zBRLEQNY7mv5mtBmrP/MjNBCAlsM2u5hDBlS3NGcTQpoBvRzqBcRtpq1A==
 
+"@esbuild/linux-riscv64@0.19.8":
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-riscv64/-/linux-riscv64-0.19.8.tgz#fbcf0c3a0b20f40b5fc31c3b7695f0769f9de66b"
+  integrity sha512-T2DRQk55SgoleTP+DtPlMrxi/5r9AeFgkhkZ/B0ap99zmxtxdOixOMI570VjdRCs9pE4Wdkz7JYrsPvsl7eESg==
+
 "@esbuild/linux-s390x@0.18.20":
   version "0.18.20"
   resolved "https://registry.yarnpkg.com/@esbuild/linux-s390x/-/linux-s390x-0.18.20.tgz#255e81fb289b101026131858ab99fba63dcf0071"
   integrity sha512-+8231GMs3mAEth6Ja1iK0a1sQ3ohfcpzpRLH8uuc5/KVDFneH6jtAJLFGafpzpMRO6DzJ6AvXKze9LfFMrIHVQ==
 
+"@esbuild/linux-s390x@0.19.8":
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-s390x/-/linux-s390x-0.19.8.tgz#989e8a05f7792d139d5564ffa7ff898ac6f20a4a"
+  integrity sha512-NPxbdmmo3Bk7mbNeHmcCd7R7fptJaczPYBaELk6NcXxy7HLNyWwCyDJ/Xx+/YcNH7Im5dHdx9gZ5xIwyliQCbg==
+
 "@esbuild/linux-x64@0.18.20":
   version "0.18.20"
   resolved "https://registry.yarnpkg.com/@esbuild/linux-x64/-/linux-x64-0.18.20.tgz#c7690b3417af318a9b6f96df3031a8865176d338"
   integrity sha512-UYqiqemphJcNsFEskc73jQ7B9jgwjWrSayxawS6UVFZGWrAAtkzjxSqnoclCXxWtfwLdzU+vTpcNYhpn43uP1w==
 
+"@esbuild/linux-x64@0.19.8":
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-x64/-/linux-x64-0.19.8.tgz#b187295393a59323397fe5ff51e769ec4e72212b"
+  integrity sha512-lytMAVOM3b1gPypL2TRmZ5rnXl7+6IIk8uB3eLsV1JwcizuolblXRrc5ShPrO9ls/b+RTp+E6gbsuLWHWi2zGg==
+
 "@esbuild/netbsd-x64@0.18.20":
   version "0.18.20"
   resolved "https://registry.yarnpkg.com/@esbuild/netbsd-x64/-/netbsd-x64-0.18.20.tgz#30e8cd8a3dded63975e2df2438ca109601ebe0d1"
   integrity sha512-iO1c++VP6xUBUmltHZoMtCUdPlnPGdBom6IrO4gyKPFFVBKioIImVooR5I83nTew5UOYrk3gIJhbZh8X44y06A==
 
+"@esbuild/netbsd-x64@0.19.8":
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/@esbuild/netbsd-x64/-/netbsd-x64-0.19.8.tgz#c1ec0e24ea82313cb1c7bae176bd5acd5bde7137"
+  integrity sha512-hvWVo2VsXz/8NVt1UhLzxwAfo5sioj92uo0bCfLibB0xlOmimU/DeAEsQILlBQvkhrGjamP0/el5HU76HAitGw==
+
 "@esbuild/openbsd-x64@0.18.20":
   version "0.18.20"
   resolved "https://registry.yarnpkg.com/@esbuild/openbsd-x64/-/openbsd-x64-0.18.20.tgz#7812af31b205055874c8082ea9cf9ab0da6217ae"
   integrity sha512-e5e4YSsuQfX4cxcygw/UCPIEP6wbIL+se3sxPdCiMbFLBWu0eiZOJ7WoD+ptCLrmjZBK1Wk7I6D/I3NglUGOxg==
 
+"@esbuild/openbsd-x64@0.19.8":
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/@esbuild/openbsd-x64/-/openbsd-x64-0.19.8.tgz#0c5b696ac66c6d70cf9ee17073a581a28af9e18d"
+  integrity sha512-/7Y7u77rdvmGTxR83PgaSvSBJCC2L3Kb1M/+dmSIvRvQPXXCuC97QAwMugBNG0yGcbEGfFBH7ojPzAOxfGNkwQ==
+
 "@esbuild/sunos-x64@0.18.20":
   version "0.18.20"
   resolved "https://registry.yarnpkg.com/@esbuild/sunos-x64/-/sunos-x64-0.18.20.tgz#d5c275c3b4e73c9b0ecd38d1ca62c020f887ab9d"
   integrity sha512-kDbFRFp0YpTQVVrqUd5FTYmWo45zGaXe0X8E1G/LKFC0v8x0vWrhOWSLITcCn63lmZIxfOMXtCfti/RxN/0wnQ==
 
+"@esbuild/sunos-x64@0.19.8":
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/@esbuild/sunos-x64/-/sunos-x64-0.19.8.tgz#2a697e1f77926ff09fcc457d8f29916d6cd48fb1"
+  integrity sha512-9Lc4s7Oi98GqFA4HzA/W2JHIYfnXbUYgekUP/Sm4BG9sfLjyv6GKKHKKVs83SMicBF2JwAX6A1PuOLMqpD001w==
+
 "@esbuild/win32-arm64@0.18.20":
   version "0.18.20"
   resolved "https://registry.yarnpkg.com/@esbuild/win32-arm64/-/win32-arm64-0.18.20.tgz#73bc7f5a9f8a77805f357fab97f290d0e4820ac9"
   integrity sha512-ddYFR6ItYgoaq4v4JmQQaAI5s7npztfV4Ag6NrhiaW0RrnOXqBkgwZLofVTlq1daVTQNhtI5oieTvkRPfZrePg==
 
+"@esbuild/win32-arm64@0.19.8":
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/@esbuild/win32-arm64/-/win32-arm64-0.19.8.tgz#ec029e62a2fca8c071842ecb1bc5c2dd20b066f1"
+  integrity sha512-rq6WzBGjSzihI9deW3fC2Gqiak68+b7qo5/3kmB6Gvbh/NYPA0sJhrnp7wgV4bNwjqM+R2AApXGxMO7ZoGhIJg==
+
 "@esbuild/win32-ia32@0.18.20":
   version "0.18.20"
   resolved "https://registry.yarnpkg.com/@esbuild/win32-ia32/-/win32-ia32-0.18.20.tgz#ec93cbf0ef1085cc12e71e0d661d20569ff42102"
   integrity sha512-Wv7QBi3ID/rROT08SABTS7eV4hX26sVduqDOTe1MvGMjNd3EjOz4b7zeexIR62GTIEKrfJXKL9LFxTYgkyeu7g==
 
+"@esbuild/win32-ia32@0.19.8":
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/@esbuild/win32-ia32/-/win32-ia32-0.19.8.tgz#cbb9a3146bde64dc15543e48afe418c7a3214851"
+  integrity sha512-AIAbverbg5jMvJznYiGhrd3sumfwWs8572mIJL5NQjJa06P8KfCPWZQ0NwZbPQnbQi9OWSZhFVSUWjjIrn4hSw==
+
 "@esbuild/win32-x64@0.18.20":
   version "0.18.20"
   resolved "https://registry.yarnpkg.com/@esbuild/win32-x64/-/win32-x64-0.18.20.tgz#786c5f41f043b07afb1af37683d7c33668858f6d"
   integrity sha512-kTdfRcSiDfQca/y9QIkng02avJ+NCaQvrMejlsB3RRv5sE9rRoeBPISaZpKxHELzRxZyLvNts1P27W3wV+8geQ==
 
+"@esbuild/win32-x64@0.19.8":
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/@esbuild/win32-x64/-/win32-x64-0.19.8.tgz#c8285183dbdb17008578dbacb6e22748709b4822"
+  integrity sha512-bfZ0cQ1uZs2PqpulNL5j/3w+GDhP36k1K5c38QdQg+Swy51jFZWWeIkteNsufkQxp986wnqRRsb/bHbY1WQ7TA==
+
 "@eslint-community/eslint-utils@^4.2.0", "@eslint-community/eslint-utils@^4.4.0":
   version "4.4.0"
   resolved "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz"
@@ -516,6 +626,13 @@
   resolved "https://registry.npmjs.org/@humanwhocodes/object-schema/-/object-schema-2.0.1.tgz"
   integrity sha512-dvuCeX5fC9dXgJn9t+X5atfmgQAzUOWqS1254Gh0m6i8wKd10ebXkfNKiRK+1GWi/yTvvLDHpoxLr0xxxeslWw==
 
+"@jest/schemas@^29.6.3":
+  version "29.6.3"
+  resolved "https://registry.yarnpkg.com/@jest/schemas/-/schemas-29.6.3.tgz#430b5ce8a4e0044a7e3819663305a7b3091c8e03"
+  integrity sha512-mo5j5X+jIZmJQveBKeS/clAueipV7KgiX1vMgCxam1RNYiqE1w62n0/tJJnHtjW8ZHcQco5gY85jA3mi0L+nSA==
+  dependencies:
+    "@sinclair/typebox" "^0.27.8"
+
 "@jridgewell/gen-mapping@^0.3.0", "@jridgewell/gen-mapping@^0.3.2":
   version "0.3.3"
   resolved "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz"
@@ -543,7 +660,7 @@
     "@jridgewell/gen-mapping" "^0.3.0"
     "@jridgewell/trace-mapping" "^0.3.9"
 
-"@jridgewell/sourcemap-codec@^1.4.10", "@jridgewell/sourcemap-codec@^1.4.14":
+"@jridgewell/sourcemap-codec@^1.4.10", "@jridgewell/sourcemap-codec@^1.4.14", "@jridgewell/sourcemap-codec@^1.4.15":
   version "1.4.15"
   resolved "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.15.tgz"
   integrity sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg==
@@ -1059,6 +1176,71 @@
     estree-walker "^2.0.1"
     picomatch "^2.2.2"
 
+"@rollup/rollup-android-arm-eabi@4.6.1":
+  version "4.6.1"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.6.1.tgz#0ea289f68ff248b50fea5716ca9f65f7d4dba3ae"
+  integrity sha512-0WQ0ouLejaUCRsL93GD4uft3rOmB8qoQMU05Kb8CmMtMBe7XUDLAltxVZI1q6byNqEtU7N1ZX1Vw5lIpgulLQA==
+
+"@rollup/rollup-android-arm64@4.6.1":
+  version "4.6.1"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.6.1.tgz#27c8c67fc5de574874085a1b480ac65b3e18378e"
+  integrity sha512-1TKm25Rn20vr5aTGGZqo6E4mzPicCUD79k17EgTLAsXc1zysyi4xXKACfUbwyANEPAEIxkzwue6JZ+stYzWUTA==
+
+"@rollup/rollup-darwin-arm64@4.6.1":
+  version "4.6.1"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.6.1.tgz#c5735c042980c85495411af7183dd20294763bd8"
+  integrity sha512-cEXJQY/ZqMACb+nxzDeX9IPLAg7S94xouJJCNVE5BJM8JUEP4HeTF+ti3cmxWeSJo+5D+o8Tc0UAWUkfENdeyw==
+
+"@rollup/rollup-darwin-x64@4.6.1":
+  version "4.6.1"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.6.1.tgz#af844bd54abb73ca3c9cf89a31eec17861d1375d"
+  integrity sha512-LoSU9Xu56isrkV2jLldcKspJ7sSXmZWkAxg7sW/RfF7GS4F5/v4EiqKSMCFbZtDu2Nc1gxxFdQdKwkKS4rwxNg==
+
+"@rollup/rollup-linux-arm-gnueabihf@4.6.1":
+  version "4.6.1"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.6.1.tgz#5e972f63c441eaf859551039b3f18db9b035977d"
+  integrity sha512-EfI3hzYAy5vFNDqpXsNxXcgRDcFHUWSx5nnRSCKwXuQlI5J9dD84g2Usw81n3FLBNsGCegKGwwTVsSKK9cooSQ==
+
+"@rollup/rollup-linux-arm64-gnu@4.6.1":
+  version "4.6.1"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.6.1.tgz#f4cfbc71e3b6fdb395b28b1472414e181515c72d"
+  integrity sha512-9lhc4UZstsegbNLhH0Zu6TqvDfmhGzuCWtcTFXY10VjLLUe4Mr0Ye2L3rrtHaDd/J5+tFMEuo5LTCSCMXWfUKw==
+
+"@rollup/rollup-linux-arm64-musl@4.6.1":
+  version "4.6.1"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.6.1.tgz#6a94c691830dc29bf708de7c640f494996130893"
+  integrity sha512-FfoOK1yP5ksX3wwZ4Zk1NgyGHZyuRhf99j64I5oEmirV8EFT7+OhUZEnP+x17lcP/QHJNWGsoJwrz4PJ9fBEXw==
+
+"@rollup/rollup-linux-x64-gnu@4.6.1":
+  version "4.6.1"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.6.1.tgz#f07bae3f7dc532d9ea5ab36c9071db329f9a1efb"
+  integrity sha512-DNGZvZDO5YF7jN5fX8ZqmGLjZEXIJRdJEdTFMhiyXqyXubBa0WVLDWSNlQ5JR2PNgDbEV1VQowhVRUh+74D+RA==
+
+"@rollup/rollup-linux-x64-musl@4.6.1":
+  version "4.6.1"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.6.1.tgz#357a34fdbf410af88ce48bd802bea6462bb9a8bc"
+  integrity sha512-RkJVNVRM+piYy87HrKmhbexCHg3A6Z6MU0W9GHnJwBQNBeyhCJG9KDce4SAMdicQnpURggSvtbGo9xAWOfSvIQ==
+
+"@rollup/rollup-win32-arm64-msvc@4.6.1":
+  version "4.6.1"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.6.1.tgz#b6e97fd38281667e35297033393cd1101f4a31be"
+  integrity sha512-v2FVT6xfnnmTe3W9bJXl6r5KwJglMK/iRlkKiIFfO6ysKs0rDgz7Cwwf3tjldxQUrHL9INT/1r4VA0n9L/F1vQ==
+
+"@rollup/rollup-win32-ia32-msvc@4.6.1":
+  version "4.6.1"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.6.1.tgz#a95db026c640c8128bfd38546d85342f2329beaf"
+  integrity sha512-YEeOjxRyEjqcWphH9dyLbzgkF8wZSKAKUkldRY6dgNR5oKs2LZazqGB41cWJ4Iqqcy9/zqYgmzBkRoVz3Q9MLw==
+
+"@rollup/rollup-win32-x64-msvc@4.6.1":
+  version "4.6.1"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.6.1.tgz#45785b5caf83200a34a9867ba50d69560880c120"
+  integrity sha512-0zfTlFAIhgz8V2G8STq8toAjsYYA6eci1hnXuyOTUFnymrtJwnS6uGKiv3v5UrPZkBlamLvrLV2iiaeqCKzb0A==
+
+"@sinclair/typebox@^0.27.8":
+  version "0.27.8"
+  resolved "https://registry.yarnpkg.com/@sinclair/typebox/-/typebox-0.27.8.tgz#6667fac16c436b5434a387a34dedb013198f6e6e"
+  integrity sha512-+Fj43pSMwJs4KRrH/938Uf+uAELIgVBmQzg/q1YG10djyfA3TnrU8N8XzqCh/okZdszqBQTZf96idMfE5lnwTA==
+
 "@types/babel__core@^7.20.3":
   version "7.20.4"
   resolved "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.4.tgz"
@@ -1236,12 +1418,60 @@
     "@types/babel__core" "^7.20.3"
     react-refresh "^0.14.0"
 
+"@vitest/expect@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@vitest/expect/-/expect-1.0.1.tgz#5e63902316a3c65948c6e36f284046962601fb88"
+  integrity sha512-3cdrb/eKD/0tygDX75YscuHEHMUJ70u3UoLSq2eqhWks57AyzvsDQbyn53IhZ0tBN7gA8Jj2VhXiOV2lef7thw==
+  dependencies:
+    "@vitest/spy" "1.0.1"
+    "@vitest/utils" "1.0.1"
+    chai "^4.3.10"
+
+"@vitest/runner@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@vitest/runner/-/runner-1.0.1.tgz#d94cab9e3008dba52f89e811540184334766ab61"
+  integrity sha512-/+z0vhJ0MfRPT3AyTvAK6m57rzlew/ct8B2a4LMv7NhpPaiI2QLGyOBMB3lcioWdJHjRuLi9aYppfOv0B5aRQA==
+  dependencies:
+    "@vitest/utils" "1.0.1"
+    p-limit "^5.0.0"
+    pathe "^1.1.1"
+
+"@vitest/snapshot@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@vitest/snapshot/-/snapshot-1.0.1.tgz#9d2a01c64726afa62264175554690e5ce148d4a5"
+  integrity sha512-wIPtPDGSxEZ+DpNMc94AsybX6LV6uN6sosf5TojyP1m2QbKwiRuLV/5RSsjt1oWViHsTj8mlcwrQQ1zHGO0fMw==
+  dependencies:
+    magic-string "^0.30.5"
+    pathe "^1.1.1"
+    pretty-format "^29.7.0"
+
+"@vitest/spy@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@vitest/spy/-/spy-1.0.1.tgz#d82af1c4d935e08443bf20432ba55afd001ac71f"
+  integrity sha512-yXwm1uKhBVr/5MhVeSmtNqK+0q2RXIchJt8kokEKdrWLtkPeDgdbZ6SjR1VQGZuNdWL6sSBnLayIyVvcS0qLfA==
+  dependencies:
+    tinyspy "^2.2.0"
+
+"@vitest/utils@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@vitest/utils/-/utils-1.0.1.tgz#ab2bf6de50845649b252a9d263765ab7f16bd6a2"
+  integrity sha512-MGPCHkzXbbAyscrhwGzh8uP1HPrTYLWaj1WTDtWSGrpe2yJWLRN9mF9ooKawr6NMOg9vTBtg2JqWLfuLC7Dknw==
+  dependencies:
+    diff-sequences "^29.6.3"
+    loupe "^2.3.7"
+    pretty-format "^29.7.0"
+
 acorn-jsx@^5.3.2:
   version "5.3.2"
   resolved "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz"
   integrity sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==
 
-acorn@^8.8.2, acorn@^8.9.0:
+acorn-walk@^8.3.0:
+  version "8.3.1"
+  resolved "https://registry.yarnpkg.com/acorn-walk/-/acorn-walk-8.3.1.tgz#2f10f5b69329d90ae18c58bf1fa8fccd8b959a43"
+  integrity sha512-TgUZgYvqZprrl7YldZNoa9OciCAyZR+Ejm9eXzKCmjsF5IKp/wgQ7Z/ZpjpGTIUPwrHQIcYeI8qDh4PsEwxMbw==
+
+acorn@^8.10.0, acorn@^8.8.2, acorn@^8.9.0:
   version "8.11.2"
   resolved "https://registry.npmjs.org/acorn/-/acorn-8.11.2.tgz"
   integrity sha512-nc0Axzp/0FILLEVsm4fNwLCwMttvhEI263QtVPQcbpfZZ3ts0hLsZGOpE6czNlid7CJ9MlyH8reXkpsf3YUY4w==
@@ -1282,6 +1512,11 @@ ansi-styles@^4.1.0:
   dependencies:
     color-convert "^2.0.1"
 
+ansi-styles@^5.0.0:
+  version "5.2.0"
+  resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-5.2.0.tgz#07449690ad45777d1924ac2abb2fc8895dba836b"
+  integrity sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==
+
 any-promise@^1.0.0:
   version "1.3.0"
   resolved "https://registry.npmjs.org/any-promise/-/any-promise-1.3.0.tgz"
@@ -1317,6 +1552,11 @@ array-union@^2.1.0:
   resolved "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz"
   integrity sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==
 
+assertion-error@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/assertion-error/-/assertion-error-1.1.0.tgz#e60b6b0e8f301bd97e5375215bda406c85118c0b"
+  integrity sha512-jgsaNduz+ndvGyFt3uSuWqvy4lCnIJiovtouQN5JZHOKCS2QuhEdbcQHFhVksz2N2U9hXJo8odG7ETyWlEeuDw==
+
 async@^3.2.3:
   version "3.2.5"
   resolved "https://registry.yarnpkg.com/async/-/async-3.2.5.tgz#ebd52a8fdaf7a2289a24df399f8d8485c8a46b66"
@@ -1396,6 +1636,11 @@ buffer-from@^1.0.0:
   resolved "https://registry.yarnpkg.com/buffer-from/-/buffer-from-1.1.2.tgz#2b146a6fd72e80b4f55d255f35ed59a3a9a41bd5"
   integrity sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ==
 
+cac@^6.7.14:
+  version "6.7.14"
+  resolved "https://registry.yarnpkg.com/cac/-/cac-6.7.14.tgz#804e1e6f506ee363cb0e3ccbb09cad5dd9870959"
+  integrity sha512-b6Ilus+c3RrdDk+JhLKUAQfzzgLEPy6wcXqS7f/xe1EETvsDP6GORG7SFuOs6cID5YkqchW/LXZbX5bc8j7ZcQ==
+
 callsites@^3.0.0:
   version "3.1.0"
   resolved "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz"
@@ -1419,6 +1664,19 @@ caniuse-lite@^1.0.30001538, caniuse-lite@^1.0.30001541:
   resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001562.tgz"
   integrity sha512-kfte3Hym//51EdX4239i+Rmp20EsLIYGdPkERegTgU19hQWCRhsRFGKHTliUlsry53tv17K7n077Kqa0WJU4ng==
 
+chai@^4.3.10:
+  version "4.3.10"
+  resolved "https://registry.yarnpkg.com/chai/-/chai-4.3.10.tgz#d784cec635e3b7e2ffb66446a63b4e33bd390384"
+  integrity sha512-0UXG04VuVbruMUYbJ6JctvH0YnC/4q3/AkT18q4NaITo91CUm0liMS9VqzT9vZhVQ/1eqPanMWjBM+Juhfb/9g==
+  dependencies:
+    assertion-error "^1.1.0"
+    check-error "^1.0.3"
+    deep-eql "^4.1.3"
+    get-func-name "^2.0.2"
+    loupe "^2.3.6"
+    pathval "^1.1.1"
+    type-detect "^4.0.8"
+
 chalk@^2.4.2:
   version "2.4.2"
   resolved "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz"
@@ -1436,6 +1694,13 @@ chalk@^4.0.0, chalk@^4.0.2, chalk@^4.1.1:
     ansi-styles "^4.1.0"
     supports-color "^7.1.0"
 
+check-error@^1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/check-error/-/check-error-1.0.3.tgz#a6502e4312a7ee969f646e83bb3ddd56281bd694"
+  integrity sha512-iKEoDYaRmd1mxM90a2OEfWhjsjPpYPuQ+lMYsoxB126+t8fw7ySEO48nmDg5COTjxDI65/Y2OWpeEHk3ZOe8zg==
+  dependencies:
+    get-func-name "^2.0.2"
+
 chokidar@^3.5.1, chokidar@^3.5.3:
   version "3.5.3"
   resolved "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz"
@@ -1564,7 +1829,7 @@ crelt@^1.0.5:
   resolved "https://registry.yarnpkg.com/crelt/-/crelt-1.0.6.tgz#7cc898ea74e190fb6ef9dae57f8f81cf7302df72"
   integrity sha512-VQ2MBenTq1fWZUH9DJNGti7kKv6EeAuYr3cLwxUWhIu1baTaXh4Ib5W2CqHVqib4/MqbYGJqiL3Zb8GJZr3l4g==
 
-cross-spawn@^7.0.2:
+cross-spawn@^7.0.2, cross-spawn@^7.0.3:
   version "7.0.3"
   resolved "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz"
   integrity sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==
@@ -1613,6 +1878,13 @@ debug@^4.1.0, debug@^4.1.1, debug@^4.3.2, debug@^4.3.4:
   dependencies:
     ms "2.1.2"
 
+deep-eql@^4.1.3:
+  version "4.1.3"
+  resolved "https://registry.yarnpkg.com/deep-eql/-/deep-eql-4.1.3.tgz#7c7775513092f7df98d8df9996dd085eb668cc6d"
+  integrity sha512-WaEtAOpRA1MQ0eohqZjpGD8zdI0Ovsm8mmFhaDN8dvDZzyoUMcYDnf5Y6iu7HTXxf8JDS23qWa4a+hKCDyOPzw==
+  dependencies:
+    type-detect "^4.0.0"
+
 deep-is@^0.1.3:
   version "0.1.4"
   resolved "https://registry.npmjs.org/deep-is/-/deep-is-0.1.4.tgz"
@@ -1628,6 +1900,11 @@ didyoumean@^1.2.2:
   resolved "https://registry.npmjs.org/didyoumean/-/didyoumean-1.2.2.tgz"
   integrity sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==
 
+diff-sequences@^29.6.3:
+  version "29.6.3"
+  resolved "https://registry.yarnpkg.com/diff-sequences/-/diff-sequences-29.6.3.tgz#4deaf894d11407c51efc8418012f9e70b84ea921"
+  integrity sha512-EjePK1srD3P08o2j4f0ExnylqRs5B9tJjcp9t1krH2qRi8CCdsYfwe9JgSLurFBWwq4uOlipzfk5fHNvwFKr8Q==
+
 dir-glob@^3.0.1:
   version "3.0.1"
   resolved "https://registry.npmjs.org/dir-glob/-/dir-glob-3.0.1.tgz"
@@ -1740,6 +2017,34 @@ esbuild@^0.18.10:
     "@esbuild/win32-ia32" "0.18.20"
     "@esbuild/win32-x64" "0.18.20"
 
+esbuild@^0.19.3:
+  version "0.19.8"
+  resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.19.8.tgz#ad05b72281d84483fa6b5345bd246c27a207b8f1"
+  integrity sha512-l7iffQpT2OrZfH2rXIp7/FkmaeZM0vxbxN9KfiCwGYuZqzMg/JdvX26R31Zxn/Pxvsrg3Y9N6XTcnknqDyyv4w==
+  optionalDependencies:
+    "@esbuild/android-arm" "0.19.8"
+    "@esbuild/android-arm64" "0.19.8"
+    "@esbuild/android-x64" "0.19.8"
+    "@esbuild/darwin-arm64" "0.19.8"
+    "@esbuild/darwin-x64" "0.19.8"
+    "@esbuild/freebsd-arm64" "0.19.8"
+    "@esbuild/freebsd-x64" "0.19.8"
+    "@esbuild/linux-arm" "0.19.8"
+    "@esbuild/linux-arm64" "0.19.8"
+    "@esbuild/linux-ia32" "0.19.8"
+    "@esbuild/linux-loong64" "0.19.8"
+    "@esbuild/linux-mips64el" "0.19.8"
+    "@esbuild/linux-ppc64" "0.19.8"
+    "@esbuild/linux-riscv64" "0.19.8"
+    "@esbuild/linux-s390x" "0.19.8"
+    "@esbuild/linux-x64" "0.19.8"
+    "@esbuild/netbsd-x64" "0.19.8"
+    "@esbuild/openbsd-x64" "0.19.8"
+    "@esbuild/sunos-x64" "0.19.8"
+    "@esbuild/win32-arm64" "0.19.8"
+    "@esbuild/win32-ia32" "0.19.8"
+    "@esbuild/win32-x64" "0.19.8"
+
 escalade@^3.1.1:
   version "3.1.1"
   resolved "https://registry.npmjs.org/escalade/-/escalade-3.1.1.tgz"
@@ -1860,6 +2165,21 @@ esutils@^2.0.2:
   resolved "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz"
   integrity sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==
 
+execa@^8.0.1:
+  version "8.0.1"
+  resolved "https://registry.yarnpkg.com/execa/-/execa-8.0.1.tgz#51f6a5943b580f963c3ca9c6321796db8cc39b8c"
+  integrity sha512-VyhnebXciFV2DESc+p6B+y0LjSm0krU4OgJN44qFAhBY0TJ+1V61tYD2+wHusZ6F9n5K+vl8k0sTy7PEfV4qpg==
+  dependencies:
+    cross-spawn "^7.0.3"
+    get-stream "^8.0.1"
+    human-signals "^5.0.0"
+    is-stream "^3.0.0"
+    merge-stream "^2.0.0"
+    npm-run-path "^5.1.0"
+    onetime "^6.0.0"
+    signal-exit "^4.1.0"
+    strip-final-newline "^3.0.0"
+
 fast-deep-equal@^3.1.1, fast-deep-equal@^3.1.3:
   version "3.1.3"
   resolved "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz"
@@ -1971,7 +2291,7 @@ fs.realpath@^1.0.0:
   resolved "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz"
   integrity sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==
 
-fsevents@~2.3.2:
+fsevents@~2.3.2, fsevents@~2.3.3:
   version "2.3.3"
   resolved "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz"
   integrity sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==
@@ -1986,11 +2306,21 @@ gensync@^1.0.0-beta.2:
   resolved "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz"
   integrity sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==
 
+get-func-name@^2.0.1, get-func-name@^2.0.2:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/get-func-name/-/get-func-name-2.0.2.tgz#0d7cf20cd13fda808669ffa88f4ffc7a3943fc41"
+  integrity sha512-8vXOvuE167CtIc3OyItco7N/dpRtBbYOsPsXCz7X/PMnlGjYjSGuZJgM1Y7mmew7BKf9BqvLX2tnOVy1BBUsxQ==
+
 get-nonce@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/get-nonce/-/get-nonce-1.0.1.tgz#fdf3f0278073820d2ce9426c18f07481b1e0cdf3"
   integrity sha512-FJhYRoDaiatfEkUK8HKlicmu/3SGFD51q3itKDGoSTysQJBnfOcxU5GxnhE1E6soB76MbT0MBtnKJuXyAx+96Q==
 
+get-stream@^8.0.1:
+  version "8.0.1"
+  resolved "https://registry.yarnpkg.com/get-stream/-/get-stream-8.0.1.tgz#def9dfd71742cd7754a7761ed43749a27d02eca2"
+  integrity sha512-VaUJspBffn/LMCJVoMvSAdmscJyS1auj5Zulnn5UoYcY531UWmdwhRWkcGKnGU93m5HSXP9LP2usOryrBtQowA==
+
 glob-parent@^5.1.2, glob-parent@~5.1.2:
   version "5.1.2"
   resolved "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz"
@@ -2111,6 +2441,11 @@ html2canvas@^1.4.1:
     css-line-break "^2.1.0"
     text-segmentation "^1.0.3"
 
+human-signals@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/human-signals/-/human-signals-5.0.0.tgz#42665a284f9ae0dade3ba41ebc37eb4b852f3a28"
+  integrity sha512-AXcZb6vzzrFAUE61HnN4mpLqd/cSIwNQjtNWR0euPm6y0iqx3G4gOXaIDdtdDwZmhwe82LA6+zinmW4UBWVePQ==
+
 ignore@^5.2.0, ignore@^5.2.4:
   version "5.2.4"
   resolved "https://registry.npmjs.org/ignore/-/ignore-5.2.4.tgz"
@@ -2185,6 +2520,11 @@ is-path-inside@^3.0.3:
   resolved "https://registry.npmjs.org/is-path-inside/-/is-path-inside-3.0.3.tgz"
   integrity sha512-Fd4gABb+ycGAmKou8eMftCupSir5lRxqf4aD/vd0cD2qc4HL07OjCeuHMr8Ro4CoMaeCKDB0/ECBOVWjTwUvPQ==
 
+is-stream@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/is-stream/-/is-stream-3.0.0.tgz#e6bfd7aa6bef69f4f472ce9bb681e3e57b4319ac"
+  integrity sha512-LnQR4bZ9IADDRSkvpqMGvt/tEJWclzklNgSw48V5EAaAeDd6qGvN8ei6k5p0tvxSR171VmGyHuTiAOfxAbr8kA==
+
 isexe@^2.0.0:
   version "2.0.0"
   resolved "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz"
@@ -2242,6 +2582,11 @@ json5@^2.2.3:
   resolved "https://registry.npmjs.org/json5/-/json5-2.2.3.tgz"
   integrity sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==
 
+jsonc-parser@^3.2.0:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/jsonc-parser/-/jsonc-parser-3.2.0.tgz#31ff3f4c2b9793f89c67212627c51c6394f88e76"
+  integrity sha512-gfFQZrcTc8CnKXp6Y4/CBT3fTc0OVuDofpre4aEeEpSBPV5X5v4+Vmx+8snU7RLPrNHPKSgLxGo9YuQzz20o+w==
+
 jsonfile@^6.0.1:
   version "6.1.0"
   resolved "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz"
@@ -2276,6 +2621,14 @@ lines-and-columns@^1.1.6:
   resolved "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz"
   integrity sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==
 
+local-pkg@^0.5.0:
+  version "0.5.0"
+  resolved "https://registry.yarnpkg.com/local-pkg/-/local-pkg-0.5.0.tgz#093d25a346bae59a99f80e75f6e9d36d7e8c925c"
+  integrity sha512-ok6z3qlYyCDS4ZEU27HaU6x/xZa9Whf8jD4ptH5UZTQYZVYeb9bnZ3ojVhiJNLiXK1Hfc0GNbLXcmZ5plLDDBg==
+  dependencies:
+    mlly "^1.4.2"
+    pkg-types "^1.0.3"
+
 locate-path@^6.0.0:
   version "6.0.0"
   resolved "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz"
@@ -2305,6 +2658,13 @@ loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.4.0:
   dependencies:
     js-tokens "^3.0.0 || ^4.0.0"
 
+loupe@^2.3.6, loupe@^2.3.7:
+  version "2.3.7"
+  resolved "https://registry.yarnpkg.com/loupe/-/loupe-2.3.7.tgz#6e69b7d4db7d3ab436328013d37d1c8c3540c697"
+  integrity sha512-zSMINGVYkdpYSOBmLi0D1Uo7JU9nVdQKrHxC8eYlV+9YKK9WePqAlL7lSlorG/U2Fw1w0hTBmaa/jrQ3UbPHtA==
+  dependencies:
+    get-func-name "^2.0.1"
+
 lower-case@^2.0.2:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/lower-case/-/lower-case-2.0.2.tgz#6fa237c63dbdc4a82ca0fd882e4722dc5e634e28"
@@ -2326,6 +2686,18 @@ lru-cache@^6.0.0:
   dependencies:
     yallist "^4.0.0"
 
+magic-string@^0.30.5:
+  version "0.30.5"
+  resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.30.5.tgz#1994d980bd1c8835dc6e78db7cbd4ae4f24746f9"
+  integrity sha512-7xlpfBaQaP/T6Vh8MO/EqXSW5En6INHEvEXQiuff7Gku0PWjU3uf6w/j9o7O+SpB5fOAkrI5HeoNgwjEO0pFsA==
+  dependencies:
+    "@jridgewell/sourcemap-codec" "^1.4.15"
+
+merge-stream@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/merge-stream/-/merge-stream-2.0.0.tgz#52823629a14dd00c9770fb6ad47dc6310f2c1f60"
+  integrity sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==
+
 merge2@^1.3.0, merge2@^1.4.1:
   version "1.4.1"
   resolved "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz"
@@ -2339,6 +2711,11 @@ micromatch@^4.0.4, micromatch@^4.0.5:
     braces "^3.0.2"
     picomatch "^2.3.1"
 
+mimic-fn@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/mimic-fn/-/mimic-fn-4.0.0.tgz#60a90550d5cb0b239cca65d893b1a53b29871ecc"
+  integrity sha512-vqiC06CuhBTUdZH+RYl8sFrL096vA45Ok5ISO6sE/Mr1jRbGH4Csnhi8f3wKVl7x8mO4Au7Ir9D3Oyv1VYMFJw==
+
 minimatch@^3.0.4, minimatch@^3.0.5, minimatch@^3.1.1, minimatch@^3.1.2:
   version "3.1.2"
   resolved "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz"
@@ -2353,6 +2730,16 @@ minimatch@^5.0.1:
   dependencies:
     brace-expansion "^2.0.1"
 
+mlly@^1.2.0, mlly@^1.4.2:
+  version "1.4.2"
+  resolved "https://registry.yarnpkg.com/mlly/-/mlly-1.4.2.tgz#7cf406aa319ff6563d25da6b36610a93f2a8007e"
+  integrity sha512-i/Ykufi2t1EZ6NaPLdfnZk2AX8cs0d+mTzVKuPfqPKPatxLApaBoxJQ9x1/uckXtrS/U5oisPMDkNs0yQTaBRg==
+  dependencies:
+    acorn "^8.10.0"
+    pathe "^1.1.1"
+    pkg-types "^1.0.3"
+    ufo "^1.3.0"
+
 ms@2.1.2:
   version "2.1.2"
   resolved "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz"
@@ -2367,7 +2754,7 @@ mz@^2.7.0:
     object-assign "^4.0.1"
     thenify-all "^1.0.0"
 
-nanoid@^3.3.6:
+nanoid@^3.3.6, nanoid@^3.3.7:
   version "3.3.7"
   resolved "https://registry.npmjs.org/nanoid/-/nanoid-3.3.7.tgz"
   integrity sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==
@@ -2415,6 +2802,13 @@ npm-run-path@^4.0.1:
   dependencies:
     path-key "^3.0.0"
 
+npm-run-path@^5.1.0:
+  version "5.1.0"
+  resolved "https://registry.yarnpkg.com/npm-run-path/-/npm-run-path-5.1.0.tgz#bc62f7f3f6952d9894bd08944ba011a6ee7b7e00"
+  integrity sha512-sJOdmRGrY2sjNTRMbSvluQqg+8X7ZK61yvzBEIDhz4f8z1TZFYABsqjjCBd/0PUNE9M6QDgHJXQkGUEm7Q+l9Q==
+  dependencies:
+    path-key "^4.0.0"
+
 nth-check@^2.0.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/nth-check/-/nth-check-2.1.1.tgz#c9eab428effce36cd6b92c924bdb000ef1f1ed1d"
@@ -2439,6 +2833,13 @@ once@^1.3.0:
   dependencies:
     wrappy "1"
 
+onetime@^6.0.0:
+  version "6.0.0"
+  resolved "https://registry.yarnpkg.com/onetime/-/onetime-6.0.0.tgz#7c24c18ed1fd2e9bca4bd26806a33613c77d34b4"
+  integrity sha512-1FlR+gjXK7X+AsAHso35MnyN5KqGwJRi/31ft6x0M194ht7S+rWAvd7PHss9xSKMzE0asv1pyIHaJYq+BbacAQ==
+  dependencies:
+    mimic-fn "^4.0.0"
+
 optionator@^0.9.3:
   version "0.9.3"
   resolved "https://registry.npmjs.org/optionator/-/optionator-0.9.3.tgz"
@@ -2458,6 +2859,13 @@ p-limit@^3.0.2:
   dependencies:
     yocto-queue "^0.1.0"
 
+p-limit@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-5.0.0.tgz#6946d5b7140b649b7a33a027d89b4c625b3a5985"
+  integrity sha512-/Eaoq+QyLSiXQ4lyYV23f14mZRQcXnxfHrN0vCai+ak9G0pp9iEQukIIZq5NccEvwRB8PUnZT0KsOoDCINS1qQ==
+  dependencies:
+    yocto-queue "^1.0.0"
+
 p-locate@^5.0.0:
   version "5.0.0"
   resolved "https://registry.npmjs.org/p-locate/-/p-locate-5.0.0.tgz"
@@ -2503,6 +2911,11 @@ path-key@^3.0.0, path-key@^3.1.0:
   resolved "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz"
   integrity sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==
 
+path-key@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/path-key/-/path-key-4.0.0.tgz#295588dc3aee64154f877adb9d780b81c554bf18"
+  integrity sha512-haREypq7xkM7ErfgIyA0z+Bj4AGKlMSdlQE2jvJo6huWD1EdkKYV+G/T4nq0YEF2vgTT8kqMFKo1uHn950r4SQ==
+
 path-parse@^1.0.7:
   version "1.0.7"
   resolved "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz"
@@ -2518,6 +2931,16 @@ pathe@^0.2.0:
   resolved "https://registry.yarnpkg.com/pathe/-/pathe-0.2.0.tgz#30fd7bbe0a0d91f0e60bae621f5d19e9e225c339"
   integrity sha512-sTitTPYnn23esFR3RlqYBWn4c45WGeLcsKzQiUpXJAyfcWkolvlYpV8FLo7JishK946oQwMFUCHXQ9AjGPKExw==
 
+pathe@^1.1.0, pathe@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/pathe/-/pathe-1.1.1.tgz#1dd31d382b974ba69809adc9a7a347e65d84829a"
+  integrity sha512-d+RQGp0MAYTIaDBIMmOfMwz3E+LOZnxx1HZd5R18mmCZY0QBlK0LDZfPc8FW8Ed2DlvsuE6PRjroDY+wg4+j/Q==
+
+pathval@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/pathval/-/pathval-1.1.1.tgz#8534e77a77ce7ac5a2512ea21e0fdb8fcf6c3d8d"
+  integrity sha512-Dp6zGqpTdETdR63lehJYPeIOqpiNBNtc7BpWSLrOje7UaIsE5aY92r/AunQA7rsXvet3lrJ3JnZX29UPTKXyKQ==
+
 picocolors@^1.0.0:
   version "1.0.0"
   resolved "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz"
@@ -2538,6 +2961,15 @@ pirates@^4.0.1:
   resolved "https://registry.npmjs.org/pirates/-/pirates-4.0.6.tgz"
   integrity sha512-saLsH7WeYYPiD25LDuLRRY/i+6HaPYr6G1OUlN39otzkSTxKnubR9RTxS3/Kk50s1g2JTgFwWQDQyplC5/SHZg==
 
+pkg-types@^1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/pkg-types/-/pkg-types-1.0.3.tgz#988b42ab19254c01614d13f4f65a2cfc7880f868"
+  integrity sha512-nN7pYi0AQqJnoLPC9eHFQ8AcyaixBUOwvqc5TDnIKCMEE6I0y8P7OKA7fPexsXGCGxQDl/cmrLAp26LhcwxZ4A==
+  dependencies:
+    jsonc-parser "^3.2.0"
+    mlly "^1.2.0"
+    pathe "^1.1.0"
+
 postcss-import@^15.1.0:
   version "15.1.0"
   resolved "https://registry.npmjs.org/postcss-import/-/postcss-import-15.1.0.tgz"
@@ -2591,11 +3023,29 @@ postcss@^8.4.23, postcss@^8.4.27, postcss@^8.4.31:
     picocolors "^1.0.0"
     source-map-js "^1.0.2"
 
+postcss@^8.4.32:
+  version "8.4.32"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.32.tgz#1dac6ac51ab19adb21b8b34fd2d93a86440ef6c9"
+  integrity sha512-D/kj5JNu6oo2EIy+XL/26JEDTlIbB8hw85G8StOE6L74RQAVVP5rej6wxCNqyMbR4RkPfqvezVbPw81Ngd6Kcw==
+  dependencies:
+    nanoid "^3.3.7"
+    picocolors "^1.0.0"
+    source-map-js "^1.0.2"
+
 prelude-ls@^1.2.1:
   version "1.2.1"
   resolved "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz"
   integrity sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==
 
+pretty-format@^29.7.0:
+  version "29.7.0"
+  resolved "https://registry.yarnpkg.com/pretty-format/-/pretty-format-29.7.0.tgz#ca42c758310f365bfa71a0bda0a807160b776812"
+  integrity sha512-Pdlw/oPxN+aXdmM9R00JVC9WVFoCLTKJvDVLgmJ+qAffBMxsV85l/Lu7sNx4zSzPyoL2euImuEwHhOXdEgNFZQ==
+  dependencies:
+    "@jest/schemas" "^29.6.3"
+    ansi-styles "^5.0.0"
+    react-is "^18.0.0"
+
 prop-types@^15.8.1:
   version "15.8.1"
   resolved "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz"
@@ -2649,6 +3099,11 @@ react-is@^16.13.1:
   resolved "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz"
   integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
 
+react-is@^18.0.0:
+  version "18.2.0"
+  resolved "https://registry.yarnpkg.com/react-is/-/react-is-18.2.0.tgz#199431eeaaa2e09f86427efbb4f1473edb47609b"
+  integrity sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==
+
 react-refresh@^0.14.0:
   version "0.14.0"
   resolved "https://registry.npmjs.org/react-refresh/-/react-refresh-0.14.0.tgz"
@@ -2746,6 +3201,25 @@ rollup@^3.27.1:
   optionalDependencies:
     fsevents "~2.3.2"
 
+rollup@^4.2.0:
+  version "4.6.1"
+  resolved "https://registry.yarnpkg.com/rollup/-/rollup-4.6.1.tgz#351501c86b5b4f976dde8c5837516452b59921f8"
+  integrity sha512-jZHaZotEHQaHLgKr8JnQiDT1rmatjgKlMekyksz+yk9jt/8z9quNjnKNRoaM0wd9DC2QKXjmWWuDYtM3jfF8pQ==
+  optionalDependencies:
+    "@rollup/rollup-android-arm-eabi" "4.6.1"
+    "@rollup/rollup-android-arm64" "4.6.1"
+    "@rollup/rollup-darwin-arm64" "4.6.1"
+    "@rollup/rollup-darwin-x64" "4.6.1"
+    "@rollup/rollup-linux-arm-gnueabihf" "4.6.1"
+    "@rollup/rollup-linux-arm64-gnu" "4.6.1"
+    "@rollup/rollup-linux-arm64-musl" "4.6.1"
+    "@rollup/rollup-linux-x64-gnu" "4.6.1"
+    "@rollup/rollup-linux-x64-musl" "4.6.1"
+    "@rollup/rollup-win32-arm64-msvc" "4.6.1"
+    "@rollup/rollup-win32-ia32-msvc" "4.6.1"
+    "@rollup/rollup-win32-x64-msvc" "4.6.1"
+    fsevents "~2.3.2"
+
 run-parallel@^1.1.9:
   version "1.2.0"
   resolved "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz"
@@ -2784,6 +3258,16 @@ shebang-regex@^3.0.0:
   resolved "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz"
   integrity sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==
 
+siginfo@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/siginfo/-/siginfo-2.0.0.tgz#32e76c70b79724e3bb567cb9d543eb858ccfaf30"
+  integrity sha512-ybx0WO1/8bSBLEWXZvEd7gMW3Sn3JFlW3TvX1nREbDLRNQNaeNN8WK0meBwPdAaOI7TtRRRJn/Es1zhrrCHu7g==
+
+signal-exit@^4.1.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-4.1.0.tgz#952188c1cbd546070e2dd20d0f41c0ae0530cb04"
+  integrity sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==
+
 slash@^3.0.0:
   version "3.0.0"
   resolved "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz"
@@ -2807,6 +3291,16 @@ source-map@^0.6.0, source-map@~0.6.0:
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
   integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==
 
+stackback@0.0.2:
+  version "0.0.2"
+  resolved "https://registry.yarnpkg.com/stackback/-/stackback-0.0.2.tgz#1ac8a0d9483848d1695e418b6d031a3c3ce68e3b"
+  integrity sha512-1XMJE5fQo1jGH6Y/7ebnwPOBEkIEnT4QF32d5R1+VXdXveM0IBMJt8zfaxX1P3QhVwrYe+576+jkANtSS2mBbw==
+
+std-env@^3.5.0:
+  version "3.6.0"
+  resolved "https://registry.yarnpkg.com/std-env/-/std-env-3.6.0.tgz#94807562bddc68fa90f2e02c5fd5b6865bb4e98e"
+  integrity sha512-aFZ19IgVmhdB2uX599ve2kE6BIE3YMnQ6Gp6BURhW/oIzpXGKr878TQfAQZn1+i0Flcc/UKUy1gOlcfaUBCryg==
+
 strip-ansi@^6.0.0, strip-ansi@^6.0.1:
   version "6.0.1"
   resolved "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz"
@@ -2814,11 +3308,23 @@ strip-ansi@^6.0.0, strip-ansi@^6.0.1:
   dependencies:
     ansi-regex "^5.0.1"
 
+strip-final-newline@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/strip-final-newline/-/strip-final-newline-3.0.0.tgz#52894c313fbff318835280aed60ff71ebf12b8fd"
+  integrity sha512-dOESqjYr96iWYylGObzd39EuNTa5VJxyvVAEm5Jnh7KGo75V43Hk1odPQkNDyXNmUR6k+gEiDVXnjB8HJ3crXw==
+
 strip-json-comments@^3.1.1:
   version "3.1.1"
   resolved "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.1.1.tgz"
   integrity sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==
 
+strip-literal@^1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/strip-literal/-/strip-literal-1.3.0.tgz#db3942c2ec1699e6836ad230090b84bb458e3a07"
+  integrity sha512-PugKzOsyXpArk0yWmUwqOZecSO0GH0bPoctLcqNDH9J04pVW3lflYE0ujElBGTloevcxF5MofAOZ7C5l2b+wLg==
+  dependencies:
+    acorn "^8.10.0"
+
 style-mod@^4.0.0, style-mod@^4.1.0:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/style-mod/-/style-mod-4.1.0.tgz#a313a14f4ae8bb4d52878c0053c4327fb787ec09"
@@ -2942,6 +3448,21 @@ tiny-invariant@^1.1.0:
   resolved "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.3.1.tgz"
   integrity sha512-AD5ih2NlSssTCwsMznbvwMZpJ1cbhkGd2uueNxzv2jDlEeZdU04JQfRnggJQ8DrcVBGjAsCKwFBbDlVNtEMlzw==
 
+tinybench@^2.5.1:
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/tinybench/-/tinybench-2.5.1.tgz#3408f6552125e53a5a48adee31261686fd71587e"
+  integrity sha512-65NKvSuAVDP/n4CqH+a9w2kTlLReS9vhsAP06MWx+/89nMinJyB2icyl58RIcqCmIggpojIGeuJGhjU1aGMBSg==
+
+tinypool@^0.8.1:
+  version "0.8.1"
+  resolved "https://registry.yarnpkg.com/tinypool/-/tinypool-0.8.1.tgz#b6c4e4972ede3e3e5cda74a3da1679303d386b03"
+  integrity sha512-zBTCK0cCgRROxvs9c0CGK838sPkeokNGdQVUUwHAbynHFlmyJYj825f/oRs528HaIJ97lo0pLIlDUzwN+IorWg==
+
+tinyspy@^2.2.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/tinyspy/-/tinyspy-2.2.0.tgz#9dc04b072746520b432f77ea2c2d17933de5d6ce"
+  integrity sha512-d2eda04AN/cPOR89F7Xv5bK/jrQEhmcLFe6HFldoeO9AJtps+fqEnh486vnT/8y4bw38pSyxDcTCAq+Ks2aJTg==
+
 to-fast-properties@^2.0.0:
   version "2.0.0"
   resolved "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz"
@@ -2981,6 +3502,11 @@ type-check@^0.4.0, type-check@~0.4.0:
   dependencies:
     prelude-ls "^1.2.1"
 
+type-detect@^4.0.0, type-detect@^4.0.8:
+  version "4.0.8"
+  resolved "https://registry.yarnpkg.com/type-detect/-/type-detect-4.0.8.tgz#7646fb5f18871cfbb7749e69bd39a6388eb7450c"
+  integrity sha512-0fr/mIH1dlO+x7TlcMy+bIDqKPsw/70tVyeHW787goQjhmqaZe10uwLujubK9q9Lg6Fiho1KUKDYz0Z7k7g5/g==
+
 type-fest@^0.20.2:
   version "0.20.2"
   resolved "https://registry.npmjs.org/type-fest/-/type-fest-0.20.2.tgz"
@@ -2996,6 +3522,11 @@ typescript@^5.0.2:
   resolved "https://registry.npmjs.org/typescript/-/typescript-5.2.2.tgz"
   integrity sha512-mI4WrpHsbCIcwT9cF4FZvr80QUeKvsUsUvKDoR+X/7XHQH98xYD8YHZg7ANtz2GtZt/CBq2QJ0thkGJMHfqc1w==
 
+ufo@^1.3.0:
+  version "1.3.2"
+  resolved "https://registry.yarnpkg.com/ufo/-/ufo-1.3.2.tgz#c7d719d0628a1c80c006d2240e0d169f6e3c0496"
+  integrity sha512-o+ORpgGwaYQXgqGDwd+hkS4PuZ3QnmqMMxRuajK/a38L6fTpcE5GPIfrf+L/KemFzfUpeUQc1rRS1iDBozvnFA==
+
 undici-types@~5.26.4:
   version "5.26.5"
   resolved "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz"
@@ -3048,6 +3579,17 @@ utrie@^1.0.2:
   dependencies:
     base64-arraybuffer "^1.0.2"
 
+vite-node@1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/vite-node/-/vite-node-1.0.1.tgz#c16c9df9b5d47b74156a6501c9db5b380d992768"
+  integrity sha512-Y2Jnz4cr2azsOMMYuVPrQkp3KMnS/0WV8ezZjCy4hU7O5mUHCAVOnFmoEvs1nvix/4mYm74Len8bYRWZJMNP6g==
+  dependencies:
+    cac "^6.7.14"
+    debug "^4.3.4"
+    pathe "^1.1.1"
+    picocolors "^1.0.0"
+    vite "^5.0.0-beta.15 || ^5.0.0"
+
 vite-plugin-checker@^0.6.2:
   version "0.6.2"
   resolved "https://registry.npmjs.org/vite-plugin-checker/-/vite-plugin-checker-0.6.2.tgz"
@@ -3100,6 +3642,44 @@ vite@^4.4.5:
   optionalDependencies:
     fsevents "~2.3.2"
 
+"vite@^5.0.0-beta.15 || ^5.0.0", "vite@^5.0.0-beta.19 || ^5.0.0":
+  version "5.0.6"
+  resolved "https://registry.yarnpkg.com/vite/-/vite-5.0.6.tgz#f9e13503a4c5ccd67312c67803dec921f3bdea7c"
+  integrity sha512-MD3joyAEBtV7QZPl2JVVUai6zHms3YOmLR+BpMzLlX2Yzjfcc4gTgNi09d/Rua3F4EtC8zdwPU8eQYyib4vVMQ==
+  dependencies:
+    esbuild "^0.19.3"
+    postcss "^8.4.32"
+    rollup "^4.2.0"
+  optionalDependencies:
+    fsevents "~2.3.3"
+
+vitest@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/vitest/-/vitest-1.0.1.tgz#3ba1307066842bc801084fa384ce0b23941b91f7"
+  integrity sha512-MHsOj079S28hDsvdDvyD1pRj4dcS51EC5Vbe0xvOYX+WryP8soiK2dm8oULi+oA/8Xa/h6GoJEMTmcmBy5YM+Q==
+  dependencies:
+    "@vitest/expect" "1.0.1"
+    "@vitest/runner" "1.0.1"
+    "@vitest/snapshot" "1.0.1"
+    "@vitest/spy" "1.0.1"
+    "@vitest/utils" "1.0.1"
+    acorn-walk "^8.3.0"
+    cac "^6.7.14"
+    chai "^4.3.10"
+    debug "^4.3.4"
+    execa "^8.0.1"
+    local-pkg "^0.5.0"
+    magic-string "^0.30.5"
+    pathe "^1.1.1"
+    picocolors "^1.0.0"
+    std-env "^3.5.0"
+    strip-literal "^1.3.0"
+    tinybench "^2.5.1"
+    tinypool "^0.8.1"
+    vite "^5.0.0-beta.19 || ^5.0.0"
+    vite-node "1.0.1"
+    why-is-node-running "^2.2.2"
+
 vscode-jsonrpc@6.0.0:
   version "6.0.0"
   resolved "https://registry.npmjs.org/vscode-jsonrpc/-/vscode-jsonrpc-6.0.0.tgz"
@@ -3156,6 +3736,14 @@ which@^2.0.1:
   dependencies:
     isexe "^2.0.0"
 
+why-is-node-running@^2.2.2:
+  version "2.2.2"
+  resolved "https://registry.yarnpkg.com/why-is-node-running/-/why-is-node-running-2.2.2.tgz#4185b2b4699117819e7154594271e7e344c9973e"
+  integrity sha512-6tSwToZxTOcotxHeA+qGCq1mVzKR3CwcJGmVcY+QE8SHy6TnpFnh8PAvPNHYr7EcuVeG0QSMxtYCuO1ta/G/oA==
+  dependencies:
+    siginfo "^2.0.0"
+    stackback "0.0.2"
+
 wrappy@1:
   version "1.0.2"
   resolved "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz"
@@ -3180,3 +3768,8 @@ yocto-queue@^0.1.0:
   version "0.1.0"
   resolved "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz"
   integrity sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==
+
+yocto-queue@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/yocto-queue/-/yocto-queue-1.0.0.tgz#7f816433fb2cbc511ec8bf7d263c3b58a1a3c251"
+  integrity sha512-9bnSc/HEW2uRy67wc+T8UwauLuPJVn28jb+GtJY16iiKWyvmYJRXVT4UamsAEGQfPohgr2q4Tq0sQbQlxTfi1g==

From eff532bcf5b003dcbd1022cb6cd180bb0775861e Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Wed, 6 Dec 2023 21:58:06 -0500
Subject: [PATCH 12/22] update test data

---
 frontend/src/components/history/utils.test.ts | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/frontend/src/components/history/utils.test.ts b/frontend/src/components/history/utils.test.ts
index 340d0d0..89041bf 100644
--- a/frontend/src/components/history/utils.test.ts
+++ b/frontend/src/components/history/utils.test.ts
@@ -4,21 +4,21 @@ import { extractHistoryTree } from "./utils";
 const data = [
   {
     type: "ai_edit" as const,
-    code: "<html>edit with better icons and red text</html>",
+    code: "<html>3. edit with better icons and red text</html>",
     inputs: {
       prompt: "make text red",
     },
   },
   {
     type: "ai_edit" as const,
-    code: "<html>edit with better icons</html>",
+    code: "<html>2. edit with better icons</html>",
     inputs: {
       prompt: "use better icons",
     },
   },
   {
     type: "ai_create" as const,
-    code: "<html>create</html>",
+    code: "<html>1. create</html>",
     inputs: {
       image_url: "",
     },
@@ -27,12 +27,12 @@ const data = [
 
 test("should only include history from this point onward", () => {
   expect(extractHistoryTree(data, 0)).toEqual([
-    "<html>create</html>",
+    "<html>1. create</html>",
     "use better icons",
-    "<html>edit with better icons</html>",
+    "<html>2. edit with better icons</html>",
     "make text red",
-    "<html>edit with better icons and red text</html>",
+    "<html>3. edit with better icons and red text</html>",
   ]);
 
-  expect(extractHistoryTree(data, 2)).toEqual(["<html>create</html>"]);
+  expect(extractHistoryTree(data, 2)).toEqual(["<html>1. create</html>"]);
 });

From f5ddb779b46c0a3433f04859949f0c36f09474ab Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Wed, 6 Dec 2023 22:24:25 -0500
Subject: [PATCH 13/22] make history forward chronology and have non-changing
 indices to refer to items

---
 frontend/src/App.tsx                          |  4 ++--
 .../src/components/history/HistoryDisplay.tsx |  4 ++--
 frontend/src/components/history/utils.test.ts | 16 ++++++-------
 frontend/src/components/history/utils.ts      | 24 +++++++++----------
 4 files changed, 24 insertions(+), 24 deletions(-)

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 22ec502..a5e3581 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -151,6 +151,7 @@ function App() {
         } else {
           setAppHistory((prev) => {
             const newHistory: History = [
+              ...prev,
               {
                 type: "ai_edit",
                 code,
@@ -158,9 +159,8 @@ function App() {
                   prompt: updateInstruction,
                 },
               },
-              ...prev,
             ];
-            setCurrentVersion(0);
+            setCurrentVersion(newHistory.length - 1);
             return newHistory;
           });
         }
diff --git a/frontend/src/components/history/HistoryDisplay.tsx b/frontend/src/components/history/HistoryDisplay.tsx
index b626df4..43b4614 100644
--- a/frontend/src/components/history/HistoryDisplay.tsx
+++ b/frontend/src/components/history/HistoryDisplay.tsx
@@ -32,7 +32,7 @@ export default function HistoryDisplay({
     <div className="flex flex-col h-screen">
       <h1 className="font-bold mb-2">History</h1>
       <ScrollArea className="flex-1 overflow-y-auto">
-        <ul className="space-y-0">
+        <ul className="space-y-0 flex flex-col-reverse">
           {history.map((item, index) => (
             <li
               key={index}
@@ -53,7 +53,7 @@ export default function HistoryDisplay({
               }
             >
               <h2 className="text-sm">{displayHistoryItemType(item.type)}</h2>
-              <h2 className="text-sm">v{history.length - index}</h2>
+              <h2 className="text-sm">v{index + 1}</h2>
             </li>
           ))}
         </ul>
diff --git a/frontend/src/components/history/utils.test.ts b/frontend/src/components/history/utils.test.ts
index 89041bf..3eb5039 100644
--- a/frontend/src/components/history/utils.test.ts
+++ b/frontend/src/components/history/utils.test.ts
@@ -3,10 +3,10 @@ import { extractHistoryTree } from "./utils";
 
 const data = [
   {
-    type: "ai_edit" as const,
-    code: "<html>3. edit with better icons and red text</html>",
+    type: "ai_create" as const,
+    code: "<html>1. create</html>",
     inputs: {
-      prompt: "make text red",
+      image_url: "",
     },
   },
   {
@@ -17,16 +17,16 @@ const data = [
     },
   },
   {
-    type: "ai_create" as const,
-    code: "<html>1. create</html>",
+    type: "ai_edit" as const,
+    code: "<html>3. edit with better icons and red text</html>",
     inputs: {
-      image_url: "",
+      prompt: "make text red",
     },
   },
 ];
 
 test("should only include history from this point onward", () => {
-  expect(extractHistoryTree(data, 0)).toEqual([
+  expect(extractHistoryTree(data, 2)).toEqual([
     "<html>1. create</html>",
     "use better icons",
     "<html>2. edit with better icons</html>",
@@ -34,5 +34,5 @@ test("should only include history from this point onward", () => {
     "<html>3. edit with better icons and red text</html>",
   ]);
 
-  expect(extractHistoryTree(data, 2)).toEqual(["<html>1. create</html>"]);
+  expect(extractHistoryTree(data, 0)).toEqual(["<html>1. create</html>"]);
 });
diff --git a/frontend/src/components/history/utils.ts b/frontend/src/components/history/utils.ts
index 8c7065f..c82a43f 100644
--- a/frontend/src/components/history/utils.ts
+++ b/frontend/src/components/history/utils.ts
@@ -4,21 +4,21 @@ export function extractHistoryTree(
   history: History,
   version: number
 ): string[] {
-  // History is in reverse chronological order
-
   // Get all history items up to the current version
-  const extractedHistory = history.slice(version);
+  const extractedHistory = history.slice(0, version + 1);
 
-  const obj: string[] = [];
-
-  // Reverse the history so that it is in chronological order for the server
-  extractedHistory.reverse().forEach((item) => {
-    // Don't include the image for ai_create since the server gets it passed and will include it directly
-    if (item.type !== "ai_create") {
-      obj.push(item.inputs.prompt);
+  // Convert the history into a flat array of strings that the backend expects
+  const flatHistory: string[] = [];
+  extractedHistory.forEach((item) => {
+    if (item.type === "ai_create") {
+      // Don't include the image for ai_create since the server
+      // gets it passed and will include it directly
+      flatHistory.push(item.code);
+    } else {
+      flatHistory.push(item.inputs.prompt);
+      flatHistory.push(item.code);
     }
-    obj.push(item.code);
   });
 
-  return obj;
+  return flatHistory;
 }

From 0e8eef4554b16572a0a0d74852274a499532f26a Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Wed, 6 Dec 2023 22:36:31 -0500
Subject: [PATCH 14/22] add parent for each item in history

---
 frontend/src/App.tsx                          | 44 ++++++++++++++-----
 .../src/components/history/HistoryDisplay.tsx |  7 ++-
 frontend/src/components/history/utils.test.ts |  3 ++
 frontend/src/history_types.ts                 |  2 +
 4 files changed, 43 insertions(+), 13 deletions(-)

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index a5e3581..802e960 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -126,7 +126,10 @@ function App() {
     setAppState(AppState.CODE_READY);
   };
 
-  function doGenerateCode(params: CodeGenerationParams) {
+  function doGenerateCode(
+    params: CodeGenerationParams,
+    parentVersion?: number
+  ) {
     setExecutionConsole([]);
     setAppState(AppState.CODING);
 
@@ -143,6 +146,7 @@ function App() {
           setAppHistory([
             {
               type: "ai_create",
+              parent: null,
               code,
               inputs: { image_url: referenceImages[0] },
             },
@@ -150,10 +154,20 @@ function App() {
           setCurrentVersion(0);
         } else {
           setAppHistory((prev) => {
+            // Validate parent version
+            if (!parentVersion) {
+              toast.error(
+                "No parent version set. Contact support or open a Github issue."
+              );
+              return prev;
+            }
+
             const newHistory: History = [
               ...prev,
               {
                 type: "ai_edit",
+                // TODO: It should never be null
+                parent: parentVersion,
                 code,
                 inputs: {
                   prompt: updateInstruction,
@@ -202,18 +216,24 @@ function App() {
 
     if (shouldIncludeResultImage) {
       const resultImage = await takeScreenshot();
-      doGenerateCode({
-        generationType: "update",
-        image: referenceImages[0],
-        resultImage: resultImage,
-        history: updatedHistory,
-      });
+      doGenerateCode(
+        {
+          generationType: "update",
+          image: referenceImages[0],
+          resultImage: resultImage,
+          history: updatedHistory,
+        },
+        currentVersion
+      );
     } else {
-      doGenerateCode({
-        generationType: "update",
-        image: referenceImages[0],
-        history: updatedHistory,
-      });
+      doGenerateCode(
+        {
+          generationType: "update",
+          image: referenceImages[0],
+          history: updatedHistory,
+        },
+        currentVersion
+      );
     }
 
     setGeneratedCode("");
diff --git a/frontend/src/components/history/HistoryDisplay.tsx b/frontend/src/components/history/HistoryDisplay.tsx
index 43b4614..f28a300 100644
--- a/frontend/src/components/history/HistoryDisplay.tsx
+++ b/frontend/src/components/history/HistoryDisplay.tsx
@@ -52,7 +52,12 @@ export default function HistoryDisplay({
                   : revertToVersion(index)
               }
             >
-              <h2 className="text-sm">{displayHistoryItemType(item.type)}</h2>
+              <div className="flex gap-x-1">
+                <h2 className="text-sm">{displayHistoryItemType(item.type)}</h2>
+                {item.parent && item.parent !== index - 1 && (
+                  <h2 className="text-sm">(parent: v{item.parent + 1})</h2>
+                )}
+              </div>
               <h2 className="text-sm">v{index + 1}</h2>
             </li>
           ))}
diff --git a/frontend/src/components/history/utils.test.ts b/frontend/src/components/history/utils.test.ts
index 3eb5039..2f0a34e 100644
--- a/frontend/src/components/history/utils.test.ts
+++ b/frontend/src/components/history/utils.test.ts
@@ -4,6 +4,7 @@ import { extractHistoryTree } from "./utils";
 const data = [
   {
     type: "ai_create" as const,
+    parent: null,
     code: "<html>1. create</html>",
     inputs: {
       image_url: "",
@@ -11,6 +12,7 @@ const data = [
   },
   {
     type: "ai_edit" as const,
+    parent: 0,
     code: "<html>2. edit with better icons</html>",
     inputs: {
       prompt: "use better icons",
@@ -18,6 +20,7 @@ const data = [
   },
   {
     type: "ai_edit" as const,
+    parent: 1,
     code: "<html>3. edit with better icons and red text</html>",
     inputs: {
       prompt: "make text red",
diff --git a/frontend/src/history_types.ts b/frontend/src/history_types.ts
index ab19825..a832329 100644
--- a/frontend/src/history_types.ts
+++ b/frontend/src/history_types.ts
@@ -3,11 +3,13 @@ export type HistoryItemType = "ai_create" | "ai_edit";
 export type HistoryItem =
   | {
       type: "ai_create";
+      parent: null | number;
       code: string;
       inputs: AiCreateInputs;
     }
   | {
       type: "ai_edit";
+      parent: null | number;
       code: string;
       inputs: AiEditInputs;
     };

From 874afc1e665a68b02e1cb8ac04a6385b1af13169 Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Thu, 7 Dec 2023 09:22:22 -0500
Subject: [PATCH 15/22] fix bug and show prompt

---
 frontend/src/App.tsx                               | 2 +-
 frontend/src/components/history/HistoryDisplay.tsx | 7 ++++++-
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 802e960..ff7c83c 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -155,7 +155,7 @@ function App() {
         } else {
           setAppHistory((prev) => {
             // Validate parent version
-            if (!parentVersion) {
+            if (parentVersion === null) {
               toast.error(
                 "No parent version set. Contact support or open a Github issue."
               );
diff --git a/frontend/src/components/history/HistoryDisplay.tsx b/frontend/src/components/history/HistoryDisplay.tsx
index f28a300..aa00920 100644
--- a/frontend/src/components/history/HistoryDisplay.tsx
+++ b/frontend/src/components/history/HistoryDisplay.tsx
@@ -30,7 +30,7 @@ export default function HistoryDisplay({
 }: Props) {
   return history.length === 0 ? null : (
     <div className="flex flex-col h-screen">
-      <h1 className="font-bold mb-2">History</h1>
+      <h1 className="font-bold mb-2">Versions</h1>
       <ScrollArea className="flex-1 overflow-y-auto">
         <ul className="space-y-0 flex flex-col-reverse">
           {history.map((item, index) => (
@@ -58,6 +58,11 @@ export default function HistoryDisplay({
                   <h2 className="text-sm">(parent: v{item.parent + 1})</h2>
                 )}
               </div>
+              <h2 className="text-sm">
+                {item.type === "ai_edit"
+                  ? item.inputs.prompt
+                  : item.inputs.image_url}
+              </h2>
               <h2 className="text-sm">v{index + 1}</h2>
             </li>
           ))}

From dd0f3b76489ef7feb8fcd431ba6176982f494d0b Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Thu, 7 Dec 2023 09:36:37 -0500
Subject: [PATCH 16/22] fix errors

---
 frontend/src/App.tsx                            | 14 ++++++++------
 .../src/components/history/HistoryDisplay.tsx   |  8 +++++---
 frontend/src/history_types.ts                   | 17 +++++++++--------
 3 files changed, 22 insertions(+), 17 deletions(-)

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index ff7c83c..deb8a29 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -128,7 +128,7 @@ function App() {
 
   function doGenerateCode(
     params: CodeGenerationParams,
-    parentVersion?: number
+    parentVersion: number | null
   ) {
     setExecutionConsole([]);
     setAppState(AppState.CODING);
@@ -166,7 +166,6 @@ function App() {
               ...prev,
               {
                 type: "ai_edit",
-                // TODO: It should never be null
                 parent: parentVersion,
                 code,
                 inputs: {
@@ -193,10 +192,13 @@ function App() {
 
     setReferenceImages(referenceImages);
     if (referenceImages.length > 0) {
-      doGenerateCode({
-        generationType: "create",
-        image: referenceImages[0],
-      });
+      doGenerateCode(
+        {
+          generationType: "create",
+          image: referenceImages[0],
+        },
+        currentVersion
+      );
     }
   }
 
diff --git a/frontend/src/components/history/HistoryDisplay.tsx b/frontend/src/components/history/HistoryDisplay.tsx
index aa00920..beb78a2 100644
--- a/frontend/src/components/history/HistoryDisplay.tsx
+++ b/frontend/src/components/history/HistoryDisplay.tsx
@@ -54,9 +54,11 @@ export default function HistoryDisplay({
             >
               <div className="flex gap-x-1">
                 <h2 className="text-sm">{displayHistoryItemType(item.type)}</h2>
-                {item.parent && item.parent !== index - 1 && (
-                  <h2 className="text-sm">(parent: v{item.parent + 1})</h2>
-                )}
+                {item.parent && item.parent !== index - 1 ? (
+                  <h2 className="text-sm">
+                    (parent: v{(item.parent || 0) + 1})
+                  </h2>
+                ) : null}
               </div>
               <h2 className="text-sm">
                 {item.type === "ai_edit"
diff --git a/frontend/src/history_types.ts b/frontend/src/history_types.ts
index a832329..4826595 100644
--- a/frontend/src/history_types.ts
+++ b/frontend/src/history_types.ts
@@ -1,18 +1,19 @@
 export type HistoryItemType = "ai_create" | "ai_edit";
 
+type CommonHistoryItem = {
+  parent: null | number;
+  code: string;
+};
+
 export type HistoryItem =
-  | {
+  | ({
       type: "ai_create";
-      parent: null | number;
-      code: string;
       inputs: AiCreateInputs;
-    }
-  | {
+    } & CommonHistoryItem)
+  | ({
       type: "ai_edit";
-      parent: null | number;
-      code: string;
       inputs: AiEditInputs;
-    };
+    } & CommonHistoryItem);
 
 export type AiCreateInputs = {
   image_url: string;

From 2457a3f5bdb0882b3b8611b382788f03412a3f83 Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Thu, 7 Dec 2023 09:38:42 -0500
Subject: [PATCH 17/22] update name

---
 frontend/src/App.tsx                              |  4 ++--
 .../src/components/history/HistoryDisplay.tsx     |  4 ++--
 frontend/src/components/history/utils.test.ts     | 15 ++++++++-------
 frontend/src/history_types.ts                     |  2 +-
 4 files changed, 13 insertions(+), 12 deletions(-)

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index deb8a29..fe0b02e 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -146,7 +146,7 @@ function App() {
           setAppHistory([
             {
               type: "ai_create",
-              parent: null,
+              parentIndex: null,
               code,
               inputs: { image_url: referenceImages[0] },
             },
@@ -166,7 +166,7 @@ function App() {
               ...prev,
               {
                 type: "ai_edit",
-                parent: parentVersion,
+                parentIndex: parentVersion,
                 code,
                 inputs: {
                   prompt: updateInstruction,
diff --git a/frontend/src/components/history/HistoryDisplay.tsx b/frontend/src/components/history/HistoryDisplay.tsx
index beb78a2..767319b 100644
--- a/frontend/src/components/history/HistoryDisplay.tsx
+++ b/frontend/src/components/history/HistoryDisplay.tsx
@@ -54,9 +54,9 @@ export default function HistoryDisplay({
             >
               <div className="flex gap-x-1">
                 <h2 className="text-sm">{displayHistoryItemType(item.type)}</h2>
-                {item.parent && item.parent !== index - 1 ? (
+                {item.parentIndex && item.parentIndex !== index - 1 ? (
                   <h2 className="text-sm">
-                    (parent: v{(item.parent || 0) + 1})
+                    (parent: v{(item.parentIndex || 0) + 1})
                   </h2>
                 ) : null}
               </div>
diff --git a/frontend/src/components/history/utils.test.ts b/frontend/src/components/history/utils.test.ts
index 2f0a34e..c434f9b 100644
--- a/frontend/src/components/history/utils.test.ts
+++ b/frontend/src/components/history/utils.test.ts
@@ -1,26 +1,27 @@
 import { expect, test } from "vitest";
 import { extractHistoryTree } from "./utils";
+import type { History } from "../../history_types";
 
-const data = [
+const data: History = [
   {
-    type: "ai_create" as const,
-    parent: null,
+    type: "ai_create",
+    parentIndex: null,
     code: "<html>1. create</html>",
     inputs: {
       image_url: "",
     },
   },
   {
-    type: "ai_edit" as const,
-    parent: 0,
+    type: "ai_edit",
+    parentIndex: 0,
     code: "<html>2. edit with better icons</html>",
     inputs: {
       prompt: "use better icons",
     },
   },
   {
-    type: "ai_edit" as const,
-    parent: 1,
+    type: "ai_edit",
+    parentIndex: 1,
     code: "<html>3. edit with better icons and red text</html>",
     inputs: {
       prompt: "make text red",
diff --git a/frontend/src/history_types.ts b/frontend/src/history_types.ts
index 4826595..55ca3f4 100644
--- a/frontend/src/history_types.ts
+++ b/frontend/src/history_types.ts
@@ -1,7 +1,7 @@
 export type HistoryItemType = "ai_create" | "ai_edit";
 
 type CommonHistoryItem = {
-  parent: null | number;
+  parentIndex: null | number;
   code: string;
 };
 

From 52adb4602b4deeec6eb461424df18f29546e3355 Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Thu, 7 Dec 2023 09:39:19 -0500
Subject: [PATCH 18/22] move files

---
 frontend/src/App.tsx                                   | 2 +-
 frontend/src/components/history/HistoryDisplay.tsx     | 2 +-
 frontend/src/{ => components/history}/history_types.ts | 0
 frontend/src/components/history/utils.test.ts          | 2 +-
 frontend/src/components/history/utils.ts               | 2 +-
 5 files changed, 4 insertions(+), 4 deletions(-)
 rename frontend/src/{ => components/history}/history_types.ts (100%)

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index fe0b02e..216c572 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -29,7 +29,7 @@ import html2canvas from "html2canvas";
 import { USER_CLOSE_WEB_SOCKET_CODE } from "./constants";
 import CodeTab from "./components/CodeTab";
 import OutputSettingsSection from "./components/OutputSettingsSection";
-import { History } from "./history_types";
+import { History } from "./components/history/history_types";
 import HistoryDisplay from "./components/history/HistoryDisplay";
 import { extractHistoryTree } from "./components/history/utils";
 import toast from "react-hot-toast";
diff --git a/frontend/src/components/history/HistoryDisplay.tsx b/frontend/src/components/history/HistoryDisplay.tsx
index 767319b..216e5bb 100644
--- a/frontend/src/components/history/HistoryDisplay.tsx
+++ b/frontend/src/components/history/HistoryDisplay.tsx
@@ -1,5 +1,5 @@
 import { ScrollArea } from "@/components/ui/scroll-area";
-import { History, HistoryItemType } from "../../history_types";
+import { History, HistoryItemType } from "./history_types";
 import toast from "react-hot-toast";
 import classNames from "classnames";
 
diff --git a/frontend/src/history_types.ts b/frontend/src/components/history/history_types.ts
similarity index 100%
rename from frontend/src/history_types.ts
rename to frontend/src/components/history/history_types.ts
diff --git a/frontend/src/components/history/utils.test.ts b/frontend/src/components/history/utils.test.ts
index c434f9b..a0dfd87 100644
--- a/frontend/src/components/history/utils.test.ts
+++ b/frontend/src/components/history/utils.test.ts
@@ -1,6 +1,6 @@
 import { expect, test } from "vitest";
 import { extractHistoryTree } from "./utils";
-import type { History } from "../../history_types";
+import type { History } from "./history_types";
 
 const data: History = [
   {
diff --git a/frontend/src/components/history/utils.ts b/frontend/src/components/history/utils.ts
index c82a43f..7356ee1 100644
--- a/frontend/src/components/history/utils.ts
+++ b/frontend/src/components/history/utils.ts
@@ -1,4 +1,4 @@
-import { History } from "../../history_types";
+import { History } from "./history_types";
 
 export function extractHistoryTree(
   history: History,

From a559cd3120ba14c17e9f647ff9a410b2ef5679e2 Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Thu, 7 Dec 2023 10:09:35 -0500
Subject: [PATCH 19/22] update to extract history tree with parent indices

---
 frontend/src/components/history/utils.test.ts | 67 ++++++++++++++++++-
 frontend/src/components/history/utils.ts      | 35 ++++++----
 2 files changed, 86 insertions(+), 16 deletions(-)

diff --git a/frontend/src/components/history/utils.test.ts b/frontend/src/components/history/utils.test.ts
index a0dfd87..0dc26bd 100644
--- a/frontend/src/components/history/utils.test.ts
+++ b/frontend/src/components/history/utils.test.ts
@@ -2,7 +2,7 @@ import { expect, test } from "vitest";
 import { extractHistoryTree } from "./utils";
 import type { History } from "./history_types";
 
-const data: History = [
+const basicLinearHistory: History = [
   {
     type: "ai_create",
     parentIndex: null,
@@ -29,8 +29,32 @@ const data: History = [
   },
 ];
 
+const basicBranchingHistory: History = [
+  ...basicLinearHistory,
+  {
+    type: "ai_edit",
+    parentIndex: 1,
+    code: "<html>4. edit with better icons and green text</html>",
+    inputs: {
+      prompt: "make text green",
+    },
+  },
+];
+
+const longerBranchingHistory: History = [
+  ...basicBranchingHistory,
+  {
+    type: "ai_edit",
+    parentIndex: 3,
+    code: "<html>5. edit with better icons and green, bold text</html>",
+    inputs: {
+      prompt: "make text bold",
+    },
+  },
+];
+
 test("should only include history from this point onward", () => {
-  expect(extractHistoryTree(data, 2)).toEqual([
+  expect(extractHistoryTree(basicLinearHistory, 2)).toEqual([
     "<html>1. create</html>",
     "use better icons",
     "<html>2. edit with better icons</html>",
@@ -38,5 +62,42 @@ test("should only include history from this point onward", () => {
     "<html>3. edit with better icons and red text</html>",
   ]);
 
-  expect(extractHistoryTree(data, 0)).toEqual(["<html>1. create</html>"]);
+  expect(extractHistoryTree(basicLinearHistory, 0)).toEqual([
+    "<html>1. create</html>",
+  ]);
+
+  // Test branching
+  expect(extractHistoryTree(basicBranchingHistory, 3)).toEqual([
+    "<html>1. create</html>",
+    "use better icons",
+    "<html>2. edit with better icons</html>",
+    "make text green",
+    "<html>4. edit with better icons and green text</html>",
+  ]);
+
+  expect(extractHistoryTree(longerBranchingHistory, 4)).toEqual([
+    "<html>1. create</html>",
+    "use better icons",
+    "<html>2. edit with better icons</html>",
+    "make text green",
+    "<html>4. edit with better icons and green text</html>",
+    "make text bold",
+    "<html>5. edit with better icons and green, bold text</html>",
+  ]);
+
+  expect(extractHistoryTree(longerBranchingHistory, 2)).toEqual([
+    "<html>1. create</html>",
+    "use better icons",
+    "<html>2. edit with better icons</html>",
+    "make text red",
+    "<html>3. edit with better icons and red text</html>",
+  ]);
+
+  // Errors - TODO: Handle these
+  // Bad index
+  // TODO: Throw an exception instead?
+  expect(extractHistoryTree(basicLinearHistory, 100)).toEqual([]);
+  expect(extractHistoryTree(basicLinearHistory, -2)).toEqual([]);
+
+  // Bad tree
 });
diff --git a/frontend/src/components/history/utils.ts b/frontend/src/components/history/utils.ts
index 7356ee1..cfa6171 100644
--- a/frontend/src/components/history/utils.ts
+++ b/frontend/src/components/history/utils.ts
@@ -1,24 +1,33 @@
-import { History } from "./history_types";
+import { History, HistoryItem } from "./history_types";
 
 export function extractHistoryTree(
   history: History,
   version: number
 ): string[] {
-  // Get all history items up to the current version
-  const extractedHistory = history.slice(0, version + 1);
-
-  // Convert the history into a flat array of strings that the backend expects
   const flatHistory: string[] = [];
-  extractedHistory.forEach((item) => {
-    if (item.type === "ai_create") {
-      // Don't include the image for ai_create since the server
-      // gets it passed and will include it directly
-      flatHistory.push(item.code);
+
+  let currentIndex: number | null = version;
+  while (currentIndex !== null) {
+    // TODO: Handle currentIndex being out of bounds
+    const item: HistoryItem = history[currentIndex];
+    console.log(item);
+
+    if (item) {
+      if (item.type === "ai_create") {
+        // Don't include the image for ai_create
+        flatHistory.unshift(item.code);
+      } else {
+        flatHistory.unshift(item.code);
+        flatHistory.unshift(item.inputs.prompt);
+      }
+
+      // Move to the parent of the current item
+      currentIndex = item.parentIndex;
     } else {
-      flatHistory.push(item.inputs.prompt);
-      flatHistory.push(item.code);
+      // Break the loop if the item is not found (should not happen in a well-formed history)
+      break;
     }
-  });
+  }
 
   return flatHistory;
 }

From 0301f24fd89a3e6dcde5c61773f34f76b7b24a84 Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Thu, 7 Dec 2023 11:26:48 -0500
Subject: [PATCH 20/22] fix up pretty printing

---
 backend/main.py  |  3 ++-
 backend/utils.py | 14 +++++++++++---
 2 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/backend/main.py b/backend/main.py
index cb8242a..517eef7 100644
--- a/backend/main.py
+++ b/backend/main.py
@@ -1,6 +1,7 @@
 # Load environment variables first
 from dotenv import load_dotenv
 
+
 load_dotenv()
 
 
@@ -14,6 +15,7 @@ from fastapi.responses import HTMLResponse
 import openai
 from llm import stream_openai_response
 from mock import mock_completion
+from utils import pprint_prompt
 from image_generation import create_alt_url_mapping, generate_images
 from prompts import assemble_prompt
 from routes import screenshot
@@ -183,7 +185,6 @@ async def stream_code(websocket: WebSocket):
             prompt_messages += [
                 {"role": "assistant" if index % 2 == 0 else "user", "content": text}
             ]
-
         image_cache = create_alt_url_mapping(params["history"][-2])
 
     if SHOULD_MOCK_AI_RESPONSE:
diff --git a/backend/utils.py b/backend/utils.py
index 88c3a67..17d6423 100644
--- a/backend/utils.py
+++ b/backend/utils.py
@@ -1,4 +1,9 @@
 import copy
+import json
+
+
+def pprint_prompt(prompt_messages):
+    print(json.dumps(truncate_data_strings(prompt_messages), indent=4))
 
 
 def truncate_data_strings(data):
@@ -10,9 +15,12 @@ def truncate_data_strings(data):
             # Recursively call the function if the value is a dictionary or a list
             if isinstance(value, (dict, list)):
                 cloned_data[key] = truncate_data_strings(value)
-            # Truncate the string if it starts with 'data:'
-            elif isinstance(value, str) and value.startswith("data:"):
-                cloned_data[key] = value[:20]
+            # Truncate the string if it it's long and add ellipsis and length
+            elif isinstance(value, str):
+                cloned_data[key] = value[:40]
+                if len(value) > 40:
+                    cloned_data[key] += "..." + f" ({len(value)} chars)"
+
     elif isinstance(cloned_data, list):
         # Process each item in the list
         cloned_data = [truncate_data_strings(item) for item in cloned_data]

From b45e9dea29b63d8618e67d8c77057251fc0cf26d Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Thu, 7 Dec 2023 11:29:05 -0500
Subject: [PATCH 21/22] clean up

---
 frontend/src/components/history/utils.ts | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/frontend/src/components/history/utils.ts b/frontend/src/components/history/utils.ts
index cfa6171..cfdfbbc 100644
--- a/frontend/src/components/history/utils.ts
+++ b/frontend/src/components/history/utils.ts
@@ -8,9 +8,7 @@ export function extractHistoryTree(
 
   let currentIndex: number | null = version;
   while (currentIndex !== null) {
-    // TODO: Handle currentIndex being out of bounds
     const item: HistoryItem = history[currentIndex];
-    console.log(item);
 
     if (item) {
       if (item.type === "ai_create") {
@@ -24,6 +22,7 @@ export function extractHistoryTree(
       // Move to the parent of the current item
       currentIndex = item.parentIndex;
     } else {
+      // TODO: Throw an exception here?
       // Break the loop if the item is not found (should not happen in a well-formed history)
       break;
     }

From 2f53540e2d6b9f6199ff8c651ab86e4ca31d393e Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Thu, 7 Dec 2023 11:41:28 -0500
Subject: [PATCH 22/22] fix bug

---
 frontend/src/components/history/HistoryDisplay.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/components/history/HistoryDisplay.tsx b/frontend/src/components/history/HistoryDisplay.tsx
index 216e5bb..c13de1e 100644
--- a/frontend/src/components/history/HistoryDisplay.tsx
+++ b/frontend/src/components/history/HistoryDisplay.tsx
@@ -54,7 +54,7 @@ export default function HistoryDisplay({
             >
               <div className="flex gap-x-1">
                 <h2 className="text-sm">{displayHistoryItemType(item.type)}</h2>
-                {item.parentIndex && item.parentIndex !== index - 1 ? (
+                {item.parentIndex !== null && item.parentIndex !== index - 1 ? (
                   <h2 className="text-sm">
                     (parent: v{(item.parentIndex || 0) + 1})
                   </h2>