From 817c7ab47159f6a25f9e6e3ecb4d100633e40f29 Mon Sep 17 00:00:00 2001
From: Anbraten <anton@ju60.de>
Date: Mon, 4 Sep 2023 08:35:35 +0200
Subject: [PATCH 1/5] feat: improve chat id passing

---
 ai/models.py                            |  3 ++-
 ai/pyserver.py                          |  4 ++-
 ai/question.py                          | 33 +++++++++++++++++--------
 server/api/repos/[repo_id]/chat.post.ts | 29 +++++++++++++++-------
 4 files changed, 48 insertions(+), 21 deletions(-)

diff --git a/ai/models.py b/ai/models.py
index a0a4e93..8f73585 100644
--- a/ai/models.py
+++ b/ai/models.py
@@ -14,5 +14,6 @@ class IssueIndexInfo(BaseModel):
 class Conversation(BaseModel):
     repo_id: int
     question: str
-    chat_id: int
+    chat_id: str
     answer: str = ""
+    source_documents: List[str] = []
diff --git a/ai/pyserver.py b/ai/pyserver.py
index 114a8a1..621a1bd 100644
--- a/ai/pyserver.py
+++ b/ai/pyserver.py
@@ -24,9 +24,11 @@ def perform_index(indexInfo: IndexInfo):
 
 @app.post("/ask")
 def conversation(conversationInput: Conversation):
-    conversationInput.answer = ask(
+    answer, source_documents = ask(
         conversationInput.repo_id,
         conversationInput.chat_id,
         conversationInput.question,
     )
+    conversationInput.answer = answer
+    conversationInput.source_documents = source_documents
     return conversationInput
diff --git a/ai/question.py b/ai/question.py
index 99a2d7d..f4cb4ce 100644
--- a/ai/question.py
+++ b/ai/question.py
@@ -15,15 +15,29 @@
 chatMemories = {}
 
 
-def _get_chat(chat_id: int):
+def _cleanup_chats():
+    for chat_id in chatMemories.keys():
+        # drop chats that are older than 5 minutes
+        if time.time() - chatMemories[chat_id].lastQuestion > 5 * 60:
+            del chatMemories[chat_id]
+
+
+def _get_chat(chat_id: str):
+    _cleanup_chats()
+
     if chat_id not in chatMemories:
-        chatMemories[chat_id] = ConversationBufferMemory(
-            memory_key="chat_history", return_messages=True, output_key="answer"
-        )
+        chatMemories[chat_id] = {
+            memory: ConversationBufferMemory(
+                memory_key="chat_history", return_messages=True, output_key="answer"
+            ),
+        }
+
+    chatMemories[chat_id].lastQuestion = time.time()
+
     return chatMemories[chat_id]
 
 
-def ask(repo_id: int, chat_id: int, question: str):
+def ask(repo_id: int, chat_id: str, question: str):
     embeddings = OpenAIEmbeddings(disallowed_special=())
 
     repo_path = os.path.join(data_path, str(repo_id))
@@ -49,14 +63,13 @@ def ask(repo_id: int, chat_id: int, question: str):
     end = time.time()
 
     result = qa(question)
-    return result["answer"]
-
+    print(f"Answer: {result['answer']}")
+    print(f"Sources: {[x.metadata['source'] for x in result['source_documents']]}")
     end = time.time()
 
+    # TODO: return source_documents
 
-def close_chat(chat_id: int):
-    if chat_id in chatMemories:
-        del chatMemories[chat_id]
+    return result["answer"], [x.metadata["source"] for x in result["source_documents"]]
 
 
 if __name__ == "__main__":
diff --git a/server/api/repos/[repo_id]/chat.post.ts b/server/api/repos/[repo_id]/chat.post.ts
index f6298ed..30f645e 100644
--- a/server/api/repos/[repo_id]/chat.post.ts
+++ b/server/api/repos/[repo_id]/chat.post.ts
@@ -1,7 +1,7 @@
 export default defineEventHandler(async (event) => {
   const user = await requireUser(event);
 
-  const repoId = event.context.params?.repo_id;
+  const repoId = getRouterParam(event, 'repo_id');
   if (!repoId) {
     throw createError({
       statusCode: 400,
@@ -11,17 +11,28 @@ export default defineEventHandler(async (event) => {
 
   const repo = await requireAccessToRepo(user, parseInt(repoId, 10));
 
-  const message = (await readBody(event))?.message;
+  const body = await readBody(event);
+  const message = body?.message;
+  const chatId = body?.chat_id;
+  if (!message || !chatId) {
+    throw createError({
+      statusCode: 400,
+      statusMessage: 'message and chat_id are required',
+    });
+  }
 
   const config = useRuntimeConfig();
-  const chatResponse = await $fetch<{ error?: string; answer: string }>(`${config.ai.url}/ask`, {
-    method: 'POST',
-    body: {
-      repo_id: repo.id,
-      chat_id: repo.id, // TODO: support opening and closing chats
-      question: message,
+  const chatResponse = await $fetch<{ error?: string; answer: string; source_documents: string[] }>(
+    `${config.ai.url}/ask`,
+    {
+      method: 'POST',
+      body: {
+        repo_id: repo.id,
+        chat_id: `${user.id}-${chatId}`,
+        question: message,
+      },
     },
-  });
+  );
 
   if (chatResponse.error) {
     console.error(chatResponse.error);

From 1d5d8358618a1df893288b9c5f1ebbf82e69e2f5 Mon Sep 17 00:00:00 2001
From: Anbraten <anton@ju60.de>
Date: Mon, 4 Sep 2023 10:19:09 +0200
Subject: [PATCH 2/5] add chat id

---
 pages/repos/[repo_id]/chat.vue          | 60 +++++++++++++++----------
 server/api/repos/[repo_id]/chat.post.ts | 25 +++--------
 2 files changed, 44 insertions(+), 41 deletions(-)

diff --git a/pages/repos/[repo_id]/chat.vue b/pages/repos/[repo_id]/chat.vue
index 193e3f8..497f5ce 100644
--- a/pages/repos/[repo_id]/chat.vue
+++ b/pages/repos/[repo_id]/chat.vue
@@ -25,7 +25,7 @@
       >
         <template v-if="message.sender === 'user'">
           <div class="w-10 flex-shrink-0" />
-          <UAlert color="primary" variant="subtle">
+          <UAlert title="" color="primary" variant="subtle">
             <template #title>
               <vue-markdown :source="message.text" />
             </template>
@@ -38,7 +38,7 @@
           <div class="flex items-center justify-center w-10 h-10 p-2 flex-shrink-0">
             <span class="text-2xl">❌</span>
           </div>
-          <UAlert color="red" variant="subtle">
+          <UAlert title="" color="red" variant="subtle">
             <template #title>
               <vue-markdown :source="message.text" />
             </template>
@@ -49,7 +49,7 @@
           <div class="flex items-center justify-center rounded w-10 h-10 p-2 flex-shrink-0">
             <span class="text-2xl">🤖</span>
           </div>
-          <UAlert color="violet" variant="subtle">
+          <UAlert title="" color="violet" variant="subtle">
             <template #title>
               <vue-markdown :source="message.text" />
             </template>
@@ -112,6 +112,19 @@ const repoId = route.params.repo_id;
 
 const { data: repo } = await useFetch(`/api/repos/${repoId}`);
 
+function makeId(length: number) {
+  let result = '';
+  const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
+  const charactersLength = characters.length;
+  let counter = 0;
+  while (counter < length) {
+    result += characters.charAt(Math.floor(Math.random() * charactersLength));
+    counter += 1;
+  }
+  return result;
+}
+const chatId = makeId(10);
+
 async function askQuestion(message: string) {
   inputText.value = message;
   await sendMessage();
@@ -136,27 +149,28 @@ async function sendMessage() {
 
   thinking.value = true;
 
-  const res = await $fetch(`/api/repos/${repoId}/chat`, {
-    method: 'POST',
-    body: JSON.stringify({
-      message,
-    }),
-    ignoreResponseError: true,
-  });
-
-  if (res.error) {
-    chatHistory.value.push({
-      id: Date.now(),
-      sender: 'error',
-      text: res.error,
+  try {
+    const res = await $fetch(`/api/repos/${repoId}/chat`, {
+      method: 'POST',
+      body: JSON.stringify({
+        message,
+        chat_id: chatId,
+      }),
     });
-  }
 
-  if (res.answer) {
+    if (res.answer) {
+      chatHistory.value.push({
+        id: Date.now(),
+        sender: 'assistant',
+        text: res.answer,
+      });
+    }
+  } catch (e) {
+    const error = e as Error;
     chatHistory.value.push({
       id: Date.now(),
-      sender: 'assistant',
-      text: res.answer,
+      sender: 'error',
+      text: error.message,
     });
   }
 
@@ -175,11 +189,11 @@ async function reIndex() {
       description: 'Repo synced successfully',
       color: 'green',
     });
-  } catch (error) {
-    console.error(error);
+  } catch (e) {
+    const error = e as Error;
     toast.add({
       title: 'Error',
-      description: 'An error occurred while syncing the repo',
+      description: error.message,
       color: 'red',
     });
   }
diff --git a/server/api/repos/[repo_id]/chat.post.ts b/server/api/repos/[repo_id]/chat.post.ts
index 30f645e..573b555 100644
--- a/server/api/repos/[repo_id]/chat.post.ts
+++ b/server/api/repos/[repo_id]/chat.post.ts
@@ -22,25 +22,14 @@ export default defineEventHandler(async (event) => {
   }
 
   const config = useRuntimeConfig();
-  const chatResponse = await $fetch<{ error?: string; answer: string; source_documents: string[] }>(
-    `${config.ai.url}/ask`,
-    {
-      method: 'POST',
-      body: {
-        repo_id: repo.id,
-        chat_id: `${user.id}-${chatId}`,
-        question: message,
-      },
+  const chatResponse = await $fetch<{ answer: string; source_documents: string[] }>(`${config.ai.url}/ask`, {
+    method: 'POST',
+    body: {
+      repo_id: repo.id,
+      chat_id: `${user.id}-${chatId}`,
+      question: message,
     },
-  );
-
-  if (chatResponse.error) {
-    console.error(chatResponse.error);
-    throw createError({
-      statusCode: 500,
-      statusMessage: 'chatbot error',
-    });
-  }
+  });
 
   return chatResponse;
 });

From 33db625f6db2b57dd75909dfc0b5aba7d12e7c5f Mon Sep 17 00:00:00 2001
From: Anbraten <anton@ju60.de>
Date: Mon, 4 Sep 2023 10:21:01 +0200
Subject: [PATCH 3/5] remove todo

---
 ai/question.py | 2 --
 1 file changed, 2 deletions(-)

diff --git a/ai/question.py b/ai/question.py
index f4cb4ce..8380e0e 100644
--- a/ai/question.py
+++ b/ai/question.py
@@ -67,8 +67,6 @@ def ask(repo_id: int, chat_id: str, question: str):
     print(f"Sources: {[x.metadata['source'] for x in result['source_documents']]}")
     end = time.time()
 
-    # TODO: return source_documents
-
     return result["answer"], [x.metadata["source"] for x in result["source_documents"]]
 
 

From 18b359c7707519222cbdfb1f910344e940459a51 Mon Sep 17 00:00:00 2001
From: Anbraten <anton@ju60.de>
Date: Tue, 5 Sep 2023 12:44:59 +0200
Subject: [PATCH 4/5] feat: add a file-tree

---
 components/FileTree.vue                      | 106 +++++++++++++++++++
 pages/repos/[repo_id]/chat.vue               |   6 ++
 server/api/repos/[repo_id]/files/file.get.ts |  32 ++++++
 server/api/repos/[repo_id]/files/tree.get.ts |  41 +++++++
 4 files changed, 185 insertions(+)
 create mode 100644 components/FileTree.vue
 create mode 100644 server/api/repos/[repo_id]/files/file.get.ts
 create mode 100644 server/api/repos/[repo_id]/files/tree.get.ts

diff --git a/components/FileTree.vue b/components/FileTree.vue
new file mode 100644
index 0000000..c801e43
--- /dev/null
+++ b/components/FileTree.vue
@@ -0,0 +1,106 @@
+<template>
+  <UVerticalNavigation
+    :links="fileTree"
+    :ui="{
+      label: 'truncate relative text-gray-900 dark:text-white flex-initial text-left',
+    }"
+    @click="clickTree"
+  >
+    <template #default="{ link }">
+      <div class="relative text-left w-full">
+        <div class="mb-2">
+          {{ link.label }}
+        </div>
+        <UVerticalNavigation v-if="link.children" :links="link.children" />
+      </div>
+    </template>
+    <!-- <template #badge="{ link }">
+      <div class="flex-1 flex justify-between relative truncate">
+        <div>{{ link.badge }}</div>
+        <div>{{ link.time }}</div>
+      </div>
+    </template> -->
+  </UVerticalNavigation>
+</template>
+
+<script setup lang="ts">
+type File = {
+  path: string;
+  name: string;
+  type: 'file';
+};
+
+type Directory = {
+  path: string;
+  name: string;
+  type: 'directory';
+  children?: (Directory | File)[];
+};
+
+type Link = {
+  label: string;
+  icon?: string;
+  badge?: string;
+  time?: string;
+  children?: Link[];
+};
+
+const props = defineProps<{
+  loadPath: (path: string) => Promise<Directory>;
+}>();
+
+const root = ref<Directory>({
+  path: '/',
+  name: '/',
+  type: 'directory',
+  children: [],
+});
+
+function directoryToLink(d: Directory | File): Link {
+  return {
+    label: d.name,
+    icon: d.type === 'directory' ? 'i-heroicons-folder-20-solid' : 'i-heroicons-document-20-solid',
+    children: d.type === 'directory' ? d.children?.map((child) => directoryToLink(child)) : undefined,
+  };
+}
+
+const fileTree = computed(() => root.value.children?.map((c) => directoryToLink(c)) || []);
+
+function setDirectoryRecursive(parent: Directory, directory: Directory): Directory {
+  let children = parent.children || [];
+
+  if (children.find((c) => directory.path.startsWith(c.path))) {
+    children = children.map((c) => {
+      if (c.type === 'file' || directory.path.startsWith(c.path)) {
+        return c;
+      }
+
+      if (parent.path === directory.path) {
+        return directory;
+      }
+
+      return setDirectoryRecursive(c, directory);
+    });
+  } else {
+    children.push(directory);
+  }
+
+  return { ...parent, children };
+}
+
+async function loadPath(path: string) {
+  const directory = await props.loadPath(path);
+  console.log(directory);
+  console.log(root.value);
+  root.value = setDirectoryRecursive(root.value, directory);
+  console.log(root.value);
+}
+
+onMounted(async () => {
+  await loadPath('/');
+});
+
+function clickTree(e) {
+  console.log(e);
+}
+</script>
diff --git a/pages/repos/[repo_id]/chat.vue b/pages/repos/[repo_id]/chat.vue
index 497f5ce..0977bde 100644
--- a/pages/repos/[repo_id]/chat.vue
+++ b/pages/repos/[repo_id]/chat.vue
@@ -97,6 +97,8 @@
         <UButton icon="i-mdi-send" size="lg" :ui="{ rounded: 'rounded-full' }" @click="sendMessage" />
       </label>
     </div>
+
+    <FileTree :load-path="loadPath" />
   </div>
 </template>
 
@@ -199,6 +201,10 @@ async function reIndex() {
   }
   loading.value = false;
 }
+
+async function loadPath(path: string) {
+  return await $fetch(`/api/repos/${repoId}/files/tree?path=${path}`);
+}
 </script>
 
 <style scoped>
diff --git a/server/api/repos/[repo_id]/files/file.get.ts b/server/api/repos/[repo_id]/files/file.get.ts
new file mode 100644
index 0000000..04ea391
--- /dev/null
+++ b/server/api/repos/[repo_id]/files/file.get.ts
@@ -0,0 +1,32 @@
+import path from 'path';
+import fs from 'fs/promises';
+
+export default defineEventHandler(async (event) => {
+  const user = await requireUser(event);
+
+  const repoId = getRouterParam(event, 'repo_id');
+  if (!repoId) {
+    throw createError({
+      statusCode: 400,
+      statusMessage: 'repo_id is required',
+    });
+  }
+
+  const body = getQuery(event);
+  const _path = body.path as string;
+  if (!_path) {
+    throw createError({
+      statusCode: 400,
+      statusMessage: 'path is required',
+    });
+  }
+
+  const repo = await requireAccessToRepo(user, parseInt(repoId, 10));
+
+  const config = useRuntimeConfig();
+  const folder = path.join(config.data_path, repo.id.toString());
+
+  const file = await fs.readFile(path.join(folder, 'repo', _path), { encoding: 'utf-8' });
+
+  return file;
+});
diff --git a/server/api/repos/[repo_id]/files/tree.get.ts b/server/api/repos/[repo_id]/files/tree.get.ts
new file mode 100644
index 0000000..3ab0383
--- /dev/null
+++ b/server/api/repos/[repo_id]/files/tree.get.ts
@@ -0,0 +1,41 @@
+import path from 'path';
+import fs from 'fs/promises';
+
+export default defineEventHandler(async (event) => {
+  const user = await requireUser(event);
+
+  const repoId = getRouterParam(event, 'repo_id');
+  if (!repoId) {
+    throw createError({
+      statusCode: 400,
+      statusMessage: 'repo_id is required',
+    });
+  }
+
+  const body = getQuery(event);
+  const _path = body.path as string;
+  if (!_path) {
+    throw createError({
+      statusCode: 400,
+      statusMessage: 'path is required',
+    });
+  }
+
+  const repo = await requireAccessToRepo(user, parseInt(repoId, 10));
+
+  const config = useRuntimeConfig();
+  const folder = path.join(config.data_path, repo.id.toString());
+
+  const files = await fs.readdir(path.join(folder, 'repo', _path), { withFileTypes: true });
+
+  return {
+    name: path.basename(_path),
+    path: _path,
+    type: 'directory',
+    children: files.map((file) => ({
+      name: file.name,
+      path: path.join(_path, file.name),
+      type: file.isDirectory() ? 'directory' : 'file',
+    })),
+  };
+});

From a7c8c22b901a9f926fb2f29a1501b4066bb5814a Mon Sep 17 00:00:00 2001
From: Anbraten <anton@ju60.de>
Date: Tue, 5 Sep 2023 15:26:15 +0200
Subject: [PATCH 5/5] add file tree and code editor ui

---
 components/CodePanel.vue                      |  11 +
 components/FileTree.vue                       |  95 +-----
 components/FileTreeFolder.vue                 |  57 ++++
 components/RepoExplorer.vue                   |  43 +++
 .../__snapshots__/file-tree.test.ts.snap      |  94 ++++++
 components/file-tree-utils.test.ts            |  77 +++++
 components/file-tree-utils.ts                 |  49 +++
 package.json                                  |   8 +-
 pages/repos/[repo_id]/chat.vue                |  23 +-
 pnpm-lock.yaml                                | 290 ++++++++++++++++++
 vitest.config.ts                              |   7 +
 11 files changed, 661 insertions(+), 93 deletions(-)
 create mode 100644 components/CodePanel.vue
 create mode 100644 components/FileTreeFolder.vue
 create mode 100644 components/RepoExplorer.vue
 create mode 100644 components/__snapshots__/file-tree.test.ts.snap
 create mode 100644 components/file-tree-utils.test.ts
 create mode 100644 components/file-tree-utils.ts
 create mode 100644 vitest.config.ts

diff --git a/components/CodePanel.vue b/components/CodePanel.vue
new file mode 100644
index 0000000..5ef6266
--- /dev/null
+++ b/components/CodePanel.vue
@@ -0,0 +1,11 @@
+<template>
+  <div class="bg-zinc-900 p-4">
+    <pre>{{ code }}</pre>
+  </div>
+</template>
+
+<script setup lang="ts">
+defineProps<{
+  code: string;
+}>();
+</script>
diff --git a/components/FileTree.vue b/components/FileTree.vue
index c801e43..c54da58 100644
--- a/components/FileTree.vue
+++ b/components/FileTree.vue
@@ -1,52 +1,16 @@
 <template>
-  <UVerticalNavigation
-    :links="fileTree"
-    :ui="{
-      label: 'truncate relative text-gray-900 dark:text-white flex-initial text-left',
-    }"
-    @click="clickTree"
-  >
-    <template #default="{ link }">
-      <div class="relative text-left w-full">
-        <div class="mb-2">
-          {{ link.label }}
-        </div>
-        <UVerticalNavigation v-if="link.children" :links="link.children" />
-      </div>
-    </template>
-    <!-- <template #badge="{ link }">
-      <div class="flex-1 flex justify-between relative truncate">
-        <div>{{ link.badge }}</div>
-        <div>{{ link.time }}</div>
-      </div>
-    </template> -->
-  </UVerticalNavigation>
+  <FileTreeFolder :root="root" :load-directory="loadDirectory" @click-item="$emit('clickItem', $event)" />
 </template>
 
 <script setup lang="ts">
-type File = {
-  path: string;
-  name: string;
-  type: 'file';
-};
-
-type Directory = {
-  path: string;
-  name: string;
-  type: 'directory';
-  children?: (Directory | File)[];
-};
-
-type Link = {
-  label: string;
-  icon?: string;
-  badge?: string;
-  time?: string;
-  children?: Link[];
-};
+import { Directory, setDirectoryRecursive } from './file-tree-utils';
 
 const props = defineProps<{
-  loadPath: (path: string) => Promise<Directory>;
+  loadDirectory: (path: string) => Promise<Directory>;
+}>();
+
+defineEmits<{
+  (event: 'clickItem', o: { path: string; type: 'file' | 'directory' }): void;
 }>();
 
 const root = ref<Directory>({
@@ -56,51 +20,12 @@ const root = ref<Directory>({
   children: [],
 });
 
-function directoryToLink(d: Directory | File): Link {
-  return {
-    label: d.name,
-    icon: d.type === 'directory' ? 'i-heroicons-folder-20-solid' : 'i-heroicons-document-20-solid',
-    children: d.type === 'directory' ? d.children?.map((child) => directoryToLink(child)) : undefined,
-  };
-}
-
-const fileTree = computed(() => root.value.children?.map((c) => directoryToLink(c)) || []);
-
-function setDirectoryRecursive(parent: Directory, directory: Directory): Directory {
-  let children = parent.children || [];
-
-  if (children.find((c) => directory.path.startsWith(c.path))) {
-    children = children.map((c) => {
-      if (c.type === 'file' || directory.path.startsWith(c.path)) {
-        return c;
-      }
-
-      if (parent.path === directory.path) {
-        return directory;
-      }
-
-      return setDirectoryRecursive(c, directory);
-    });
-  } else {
-    children.push(directory);
-  }
-
-  return { ...parent, children };
-}
-
-async function loadPath(path: string) {
-  const directory = await props.loadPath(path);
-  console.log(directory);
-  console.log(root.value);
+async function loadDirectory(path: string) {
+  const directory = await props.loadDirectory(path);
   root.value = setDirectoryRecursive(root.value, directory);
-  console.log(root.value);
 }
 
 onMounted(async () => {
-  await loadPath('/');
+  await loadDirectory('/');
 });
-
-function clickTree(e) {
-  console.log(e);
-}
 </script>
diff --git a/components/FileTreeFolder.vue b/components/FileTreeFolder.vue
new file mode 100644
index 0000000..0d281ac
--- /dev/null
+++ b/components/FileTreeFolder.vue
@@ -0,0 +1,57 @@
+<template>
+  <div class="flex flex-col overflow-y">
+    <div v-for="c in root.children" :key="c.name">
+      <div
+        v-if="c.type === 'file'"
+        class="flex items-center gap-1 w-full cursor-pointer hover:bg-zinc-200 hover:dark:bg-zinc-700 rounded-md"
+        @click="$emit('clickItem', { path: c.path, type: 'file' })"
+      >
+        <UIcon name="i-heroicons-document" />
+        <span>{{ c.name }}</span>
+      </div>
+      <div v-else>
+        <div
+          class="flex items-center cursor-pointer hover:bg-zinc-200 hover:dark:bg-zinc-700 rounded-md gap-1 w-full"
+          @click="_loadDirectory(c)"
+        >
+          <UIcon v-if="isOpened[c.path]" name="i-heroicons-folder-open" />
+          <UIcon v-else name="i-heroicons-folder-20-solid" />
+          <span>{{ c.name }}</span>
+        </div>
+        <FileTreeFolder
+          v-if="isOpened[c.path]"
+          :root="c"
+          class="ml-2"
+          :load-directory="loadDirectory"
+          @click-item="$emit('clickItem', $event)"
+        />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { Directory } from './file-tree-utils';
+
+const props = defineProps<{
+  root: Directory;
+  loadDirectory: (path: string) => Promise<Directory>;
+}>();
+
+const emit = defineEmits<{
+  (event: 'clickItem', o: { path: string; type: 'file' | 'directory' }): void;
+}>();
+
+const isOpened = ref({} as Record<string, boolean>);
+
+async function _loadDirectory(d: Directory) {
+  if (d.children && d.children.length > 0) {
+    isOpened.value[d.path] = !isOpened.value[d.path];
+    emit('clickItem', { path: d.path, type: 'directory' });
+    return;
+  }
+
+  await props.loadDirectory(d.path);
+  isOpened.value[d.path] = true;
+}
+</script>
diff --git a/components/RepoExplorer.vue b/components/RepoExplorer.vue
new file mode 100644
index 0000000..8c721d7
--- /dev/null
+++ b/components/RepoExplorer.vue
@@ -0,0 +1,43 @@
+<template>
+  <div class="flex gap-4">
+    <div class="w-48 overflow flex-shrink-0">
+      <FileTree :load-directory="loadDirectory" @click-item="clickTreeItem" />
+    </div>
+    <div v-if="code" class="flex-grow">
+      <CodePanel :code="code" />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+const props = defineProps<{
+  repoId: string;
+}>();
+
+const repoId = toRef(props, 'repoId');
+const code = ref<string>();
+
+async function loadDirectory(path: string) {
+  return await $fetch(`/api/repos/${repoId.value}/files/tree`, {
+    query: {
+      path,
+    },
+  });
+}
+
+async function clickTreeItem({ path, type }: { path: string; type: 'file' | 'directory' }) {
+  if (type === 'directory') {
+    return;
+  }
+
+  code.value = undefined;
+
+  const c = await $fetch(`/api/repos/${repoId.value}/files/file`, {
+    query: {
+      path,
+    },
+  });
+
+  code.value = c;
+}
+</script>
diff --git a/components/__snapshots__/file-tree.test.ts.snap b/components/__snapshots__/file-tree.test.ts.snap
new file mode 100644
index 0000000..6c2587c
--- /dev/null
+++ b/components/__snapshots__/file-tree.test.ts.snap
@@ -0,0 +1,94 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`file-tree > should add a sub-sub-folder while not having the sub-folder yet 1`] = `
+{
+  "children": [
+    {
+      "name": "file1.txt",
+      "path": "/file1.txt",
+      "type": "file",
+    },
+    {
+      "children": [
+        {
+          "children": [
+            {
+              "children": [
+                {
+                  "name": "file4.txt",
+                  "path": "/folder1/folder2/folder3/file4.txt",
+                  "type": "file",
+                },
+              ],
+              "name": "folder3",
+              "path": "/folder1/folder2/folder3",
+              "type": "directory",
+            },
+          ],
+          "name": "folder2",
+          "path": "/folder1/folder2",
+          "type": "directory",
+        },
+      ],
+      "name": "folder1",
+      "path": "/folder1",
+      "type": "directory",
+    },
+  ],
+  "name": "root",
+  "path": "/",
+  "type": "directory",
+}
+`;
+
+exports[`file-tree > should replace a sub-folder 1`] = `
+{
+  "children": [
+    {
+      "name": "file1.txt",
+      "path": "/file1.txt",
+      "type": "file",
+    },
+    {
+      "children": [
+        {
+          "name": "file1.txt",
+          "path": "/folder1/subfile1.txt",
+          "type": "file",
+        },
+        {
+          "name": "folder2",
+          "path": "/folder1/folder2",
+          "type": "directory",
+        },
+      ],
+      "name": "folder1",
+      "path": "/folder1",
+      "type": "directory",
+    },
+  ],
+  "name": "root",
+  "path": "/",
+  "type": "directory",
+}
+`;
+
+exports[`file-tree > should replace root folder 1`] = `
+{
+  "children": [
+    {
+      "name": "file1.txt",
+      "path": "/file1.txt",
+      "type": "file",
+    },
+    {
+      "name": "folder1",
+      "path": "/folder1",
+      "type": "directory",
+    },
+  ],
+  "name": "root",
+  "path": "/",
+  "type": "directory",
+}
+`;
diff --git a/components/file-tree-utils.test.ts b/components/file-tree-utils.test.ts
new file mode 100644
index 0000000..f0c8f5e
--- /dev/null
+++ b/components/file-tree-utils.test.ts
@@ -0,0 +1,77 @@
+import { expect, describe, it } from 'vitest';
+import { Directory, setDirectoryRecursive } from './file-tree';
+
+describe('file-tree', () => {
+  const fileTree: Directory = {
+    name: '/',
+    path: '/',
+    type: 'directory',
+  };
+
+  const dir: Directory = {
+    name: 'root',
+    path: '/',
+    type: 'directory',
+    children: [
+      {
+        type: 'file',
+        name: 'file1.txt',
+        path: '/file1.txt',
+      },
+      {
+        type: 'directory',
+        name: 'folder1',
+        path: '/folder1',
+      },
+    ],
+  };
+
+  const subDir: Directory = {
+    type: 'directory',
+    name: 'folder1',
+    path: '/folder1',
+    children: [
+      {
+        type: 'file',
+        name: 'file1.txt',
+        path: '/folder1/subfile1.txt',
+      },
+      {
+        type: 'directory',
+        name: 'folder2',
+        path: '/folder1/folder2',
+      },
+    ],
+  };
+
+  const subSubSubDir: Directory = {
+    type: 'directory',
+    name: 'folder3',
+    path: '/folder1/folder2/folder3',
+    children: [
+      {
+        type: 'file',
+        name: 'file4.txt',
+        path: '/folder1/folder2/folder3/file4.txt',
+      },
+    ],
+  };
+
+  it('should replace root folder', () => {
+    const result = setDirectoryRecursive(fileTree, dir);
+
+    expect(result).toMatchSnapshot();
+  });
+
+  it('should replace a sub-folder', () => {
+    const result = setDirectoryRecursive(dir, subDir);
+
+    expect(result).toMatchSnapshot();
+  });
+
+  it('should add a sub-sub-folder while not having the sub-folder yet', () => {
+    const result = setDirectoryRecursive(dir, subSubSubDir);
+
+    expect(result).toMatchSnapshot();
+  });
+});
diff --git a/components/file-tree-utils.ts b/components/file-tree-utils.ts
new file mode 100644
index 0000000..9c53cf3
--- /dev/null
+++ b/components/file-tree-utils.ts
@@ -0,0 +1,49 @@
+export type File = {
+  path: string;
+  name: string;
+  type: 'file';
+};
+
+export type Directory = {
+  path: string;
+  name: string;
+  type: 'directory';
+  children?: (Directory | File)[];
+};
+
+export function setDirectoryRecursive(parent: Directory, directory: Directory): Directory {
+  if (parent.path === directory.path) {
+    return directory;
+  }
+
+  let children = parent.children || [];
+
+  if (!children.find((c) => directory.path.startsWith(c.path))) {
+    const a = directory.path.replace(new RegExp(`^${parent.path}\/`), '').split('/');
+    const name = a[0];
+    if (name !== '') {
+      children.push({
+        path: `${parent.path}/${name}`,
+        name,
+        type: 'directory',
+        children: [],
+      });
+
+      console.log('should add', directory.path, name);
+    }
+  }
+
+  children = children.map((c) => {
+    if (c.type === 'file') {
+      return c;
+    }
+
+    if (parent.path === directory.path) {
+      return directory;
+    }
+
+    return setDirectoryRecursive(c, directory);
+  });
+
+  return { ...parent, children };
+}
diff --git a/package.json b/package.json
index a18b423..37f8fa7 100644
--- a/package.json
+++ b/package.json
@@ -15,7 +15,9 @@
     "clean": "rm -rf dist/ node_modules/ .eslintcache",
     "format:check": "prettier --check .",
     "format:fix": "prettier --write .",
-    "typecheck": "tsc --noEmit"
+    "typecheck": "tsc --noEmit",
+    "test": "vitest",
+    "test:watch": "vitest --watch --ui"
   },
   "devDependencies": {
     "@iconify/json": "^2.2.106",
@@ -25,6 +27,7 @@
     "@types/better-sqlite3": "^7.6.4",
     "@types/jsonwebtoken": "^9.0.2",
     "@types/node": "^18",
+    "@vitest/ui": "^0.34.3",
     "better-sqlite3": "^8.5.0",
     "dotenv": "^16.3.1",
     "drizzle-kit": "^0.19.12",
@@ -33,7 +36,8 @@
     "nuxt": "^3.6.5",
     "prettier": "^3.0.1",
     "tsx": "^3.12.7",
-    "typescript": "^5.1.6"
+    "typescript": "^5.1.6",
+    "vitest": "^0.34.3"
   },
   "dependencies": {
     "@gitbeaker/core": "^39.10.3",
diff --git a/pages/repos/[repo_id]/chat.vue b/pages/repos/[repo_id]/chat.vue
index 0977bde..c334a1d 100644
--- a/pages/repos/[repo_id]/chat.vue
+++ b/pages/repos/[repo_id]/chat.vue
@@ -6,7 +6,9 @@
     <div class="flex w-full p-2 items-center">
       <span class="mx-auto text-2xl">{{ repo.name }}</span>
 
-      <NuxtLink :to="repo.url" target="_blank">
+      <UButton label="Show code" variant="outline" @click="isCodePanelOpen = true" />
+
+      <NuxtLink :to="repo.url" target="_blank" class="ml-2">
         <UButton icon="i-ion-git-pull-request" variant="outline" label="Open repo" />
       </NuxtLink>
 
@@ -98,7 +100,18 @@
       </label>
     </div>
 
-    <FileTree :load-path="loadPath" />
+    <USlideover v-model="isCodePanelOpen" side="left" :overlay="false" :ui="{ width: 'w-screen max-w-4xl' }">
+      <UCard
+        class="flex flex-col flex-1"
+        :ui="{ body: { base: 'flex-1' }, ring: '', divide: 'divide-y divide-gray-100 dark:divide-gray-800' }"
+      >
+        <template #header>
+          <p>Source code</p>
+        </template>
+
+        <RepoExplorer :repo-id="repoId" />
+      </UCard>
+    </USlideover>
   </div>
 </template>
 
@@ -114,6 +127,8 @@ const repoId = route.params.repo_id;
 
 const { data: repo } = await useFetch(`/api/repos/${repoId}`);
 
+const isCodePanelOpen = ref(false);
+
 function makeId(length: number) {
   let result = '';
   const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
@@ -201,10 +216,6 @@ async function reIndex() {
   }
   loading.value = false;
 }
-
-async function loadPath(path: string) {
-  return await $fetch(`/api/repos/${repoId}/files/tree?path=${path}`);
-}
 </script>
 
 <style scoped>
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 53af44a..1018eb2 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -64,6 +64,9 @@ devDependencies:
   '@types/node':
     specifier: ^18
     version: 18.17.12
+  '@vitest/ui':
+    specifier: ^0.34.3
+    version: 0.34.3(vitest@0.34.3)
   dotenv:
     specifier: ^16.3.1
     version: 16.3.1
@@ -88,6 +91,9 @@ devDependencies:
   typescript:
     specifier: ^5.1.6
     version: 5.2.2
+  vitest:
+    specifier: ^0.34.3
+    version: 0.34.3(@vitest/ui@0.34.3)
 
 packages:
 
@@ -1161,6 +1167,13 @@ packages:
       wrap-ansi-cjs: /wrap-ansi@7.0.0
     dev: true
 
+  /@jest/schemas@29.6.3:
+    resolution: {integrity: sha512-mo5j5X+jIZmJQveBKeS/clAueipV7KgiX1vMgCxam1RNYiqE1w62n0/tJJnHtjW8ZHcQco5gY85jA3mi0L+nSA==}
+    engines: {node: ^14.15.0 || ^16.10.0 || >=18.0.0}
+    dependencies:
+      '@sinclair/typebox': 0.27.8
+    dev: true
+
   /@jridgewell/gen-mapping@0.3.3:
     resolution: {integrity: sha512-HLhSWOLRi875zjjMG/r+Nv0oCW8umGb0BgEhyX3dDX3egwZtB8PqLnjz3yedt8R5StBrzcg4aBpnh8UA9D1BoQ==}
     engines: {node: '>=6.0.0'}
@@ -2316,6 +2329,10 @@ packages:
       - supports-color
     dev: true
 
+  /@sinclair/typebox@0.27.8:
+    resolution: {integrity: sha512-+Fj43pSMwJs4KRrH/938Uf+uAELIgVBmQzg/q1YG10djyfA3TnrU8N8XzqCh/okZdszqBQTZf96idMfE5lnwTA==}
+    dev: true
+
   /@tailwindcss/aspect-ratio@0.4.2(tailwindcss@3.3.3):
     resolution: {integrity: sha512-8QPrypskfBa7QIMuKHg2TA7BqES6vhBrDLOv8Unb6FcFyd3TjKbc6lcmb9UPQHxfl24sXoJ41ux/H7qQQvfaSQ==}
     peerDependencies:
@@ -2389,6 +2406,16 @@ packages:
     resolution: {integrity: sha512-wJsiX1tosQ+J5+bY5LrSahHxr2wT+uME5UDwdN1kg4frt40euqA+wzECkmq4t5QbveHiJepfdThgQrPw6KiSlg==}
     dev: false
 
+  /@types/chai-subset@1.3.3:
+    resolution: {integrity: sha512-frBecisrNGz+F4T6bcc+NLeolfiojh5FxW2klu669+8BARtyQv2C/GkNW6FUodVe4BroGMP/wER/YDGc7rEllw==}
+    dependencies:
+      '@types/chai': 4.3.6
+    dev: true
+
+  /@types/chai@4.3.6:
+    resolution: {integrity: sha512-VOVRLM1mBxIRxydiViqPcKn6MIxZytrbMpd6RJLIWKxUNr3zux8no0Oc7kJx0WAPIitgZ0gkrDS+btlqQpubpw==}
+    dev: true
+
   /@types/eslint-scope@3.7.4:
     resolution: {integrity: sha512-9K4zoImiZc3HlIp6AVUDE4CWYx22a+lhSZMYNpbjW04+YF0KWj4pJXnEMjdnFTiQibFFmElcsasJXDbdI/EPhA==}
     dependencies:
@@ -2523,6 +2550,59 @@ packages:
       vue: 3.3.4
     dev: true
 
+  /@vitest/expect@0.34.3:
+    resolution: {integrity: sha512-F8MTXZUYRBVsYL1uoIft1HHWhwDbSzwAU9Zgh8S6WFC3YgVb4AnFV2GXO3P5Em8FjEYaZtTnQYoNwwBrlOMXgg==}
+    dependencies:
+      '@vitest/spy': 0.34.3
+      '@vitest/utils': 0.34.3
+      chai: 4.3.8
+    dev: true
+
+  /@vitest/runner@0.34.3:
+    resolution: {integrity: sha512-lYNq7N3vR57VMKMPLVvmJoiN4bqwzZ1euTW+XXYH5kzr3W/+xQG3b41xJn9ChJ3AhYOSoweu974S1V3qDcFESA==}
+    dependencies:
+      '@vitest/utils': 0.34.3
+      p-limit: 4.0.0
+      pathe: 1.1.1
+    dev: true
+
+  /@vitest/snapshot@0.34.3:
+    resolution: {integrity: sha512-QyPaE15DQwbnIBp/yNJ8lbvXTZxS00kRly0kfFgAD5EYmCbYcA+1EEyRalc93M0gosL/xHeg3lKAClIXYpmUiQ==}
+    dependencies:
+      magic-string: 0.30.3
+      pathe: 1.1.1
+      pretty-format: 29.6.3
+    dev: true
+
+  /@vitest/spy@0.34.3:
+    resolution: {integrity: sha512-N1V0RFQ6AI7CPgzBq9kzjRdPIgThC340DGjdKdPSE8r86aUSmeliTUgkTqLSgtEwWWsGfBQ+UetZWhK0BgJmkQ==}
+    dependencies:
+      tinyspy: 2.1.1
+    dev: true
+
+  /@vitest/ui@0.34.3(vitest@0.34.3):
+    resolution: {integrity: sha512-iNcOQ0xML9znOReiwpKJrTLSj5zFxmveD3VCxIJNqnsaMYpONSbSiiJLC1Y1dYlkmiHylp+ElNcUZYIMWdxRvA==}
+    peerDependencies:
+      vitest: '>=0.30.1 <1'
+    dependencies:
+      '@vitest/utils': 0.34.3
+      fast-glob: 3.3.1
+      fflate: 0.8.0
+      flatted: 3.2.7
+      pathe: 1.1.1
+      picocolors: 1.0.0
+      sirv: 2.0.3
+      vitest: 0.34.3(@vitest/ui@0.34.3)
+    dev: true
+
+  /@vitest/utils@0.34.3:
+    resolution: {integrity: sha512-kiSnzLG6m/tiT0XEl4U2H8JDBjFtwVlaE8I3QfGiMFR0QvnRDfYfdP3YvTBWM/6iJDAyaPY6yVQiCTUc7ZzTHA==}
+    dependencies:
+      diff-sequences: 29.6.3
+      loupe: 2.3.6
+      pretty-format: 29.6.3
+    dev: true
+
   /@vue-macros/common@1.7.2(vue@3.3.4):
     resolution: {integrity: sha512-0/2A4kWLTCNEx+DDQKLvs7zXpfjgAbGBZ58SIvDN1DjGXhG4WaIUZtgMqzA6bvc5dNN7RaOatZYubkVumwmjWA==}
     engines: {node: '>=16.14.0'}
@@ -2863,6 +2943,11 @@ packages:
       acorn: 8.10.0
     dev: true
 
+  /acorn-walk@8.2.0:
+    resolution: {integrity: sha512-k+iyHEuPgSw6SbuDpGQM+06HQUa04DZ3o+F6CSzXMvvI5KMvnaEqXe+YVe555R9nn6GPt404fos4wcgpw12SDA==}
+    engines: {node: '>=0.4.0'}
+    dev: true
+
   /acorn@8.10.0:
     resolution: {integrity: sha512-F0SAmZ8iUtS//m8DmCTA0jlh6TDKkHQyK6xc6V4KDTyZKA9dnvX9/3sRTVQrWm79glUAZbnmmNcdYwUIHWVybw==}
     engines: {node: '>=0.4.0'}
@@ -2957,6 +3042,11 @@ packages:
       color-convert: 2.0.1
     dev: true
 
+  /ansi-styles@5.2.0:
+    resolution: {integrity: sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==}
+    engines: {node: '>=10'}
+    dev: true
+
   /ansi-styles@6.2.1:
     resolution: {integrity: sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==}
     engines: {node: '>=12'}
@@ -3063,6 +3153,10 @@ packages:
       util: 0.12.5
     dev: true
 
+  /assertion-error@1.1.0:
+    resolution: {integrity: sha512-jgsaNduz+ndvGyFt3uSuWqvy4lCnIJiovtouQN5JZHOKCS2QuhEdbcQHFhVksz2N2U9hXJo8odG7ETyWlEeuDw==}
+    dev: true
+
   /ast-kit@0.10.0:
     resolution: {integrity: sha512-8y01XClpURgvxTJmM4AY2oHa1B/6iysALB9yJM1j4ak3Z2ZsnU0ewjDZzqOHdbNdit6hC0DGZNrBqNuCrv51fQ==}
     engines: {node: '>=16.14.0'}
@@ -3421,6 +3515,19 @@ packages:
   /caniuse-lite@1.0.30001524:
     resolution: {integrity: sha512-Jj917pJtYg9HSJBF95HVX3Cdr89JUyLT4IZ8SvM5aDRni95swKgYi3TgYLH5hnGfPE/U1dg6IfZ50UsIlLkwSA==}
 
+  /chai@4.3.8:
+    resolution: {integrity: sha512-vX4YvVVtxlfSZ2VecZgFUTU5qPCYsobVI2O9FmwEXBhDigYGQA6jRXCycIs1yJnnWbZ6/+a2zNIF5DfVCcJBFQ==}
+    engines: {node: '>=4'}
+    dependencies:
+      assertion-error: 1.1.0
+      check-error: 1.0.2
+      deep-eql: 4.1.3
+      get-func-name: 2.0.0
+      loupe: 2.3.6
+      pathval: 1.1.1
+      type-detect: 4.0.8
+    dev: true
+
   /chalk@2.4.2:
     resolution: {integrity: sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==}
     engines: {node: '>=4'}
@@ -3442,6 +3549,10 @@ packages:
     engines: {node: ^12.17.0 || ^14.13 || >=16.0.0}
     dev: true
 
+  /check-error@1.0.2:
+    resolution: {integrity: sha512-BrgHpW9NURQgzoNyjfq0Wu6VFO6D7IZEmJNdtgNqpzGG8RuNFHt2jQxWlAs4HMe119chBnv+34syEZtc6IhLtA==}
+    dev: true
+
   /chokidar@3.5.3:
     resolution: {integrity: sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==}
     engines: {node: '>= 8.10.0'}
@@ -3943,6 +4054,13 @@ packages:
       strip-dirs: 2.1.0
     dev: true
 
+  /deep-eql@4.1.3:
+    resolution: {integrity: sha512-WaEtAOpRA1MQ0eohqZjpGD8zdI0Ovsm8mmFhaDN8dvDZzyoUMcYDnf5Y6iu7HTXxf8JDS23qWa4a+hKCDyOPzw==}
+    engines: {node: '>=6'}
+    dependencies:
+      type-detect: 4.0.8
+    dev: true
+
   /deep-equal@1.0.1:
     resolution: {integrity: sha512-bHtC0iYvWhyaTzvV3CZgPeZQqCOBGyGsVV7v4eevpdkLHfiSrXUdBG+qAuSz4RI70sszvjQ1QSZ98An1yNwpSw==}
     dev: true
@@ -4054,6 +4172,11 @@ packages:
     resolution: {integrity: sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==}
     dev: true
 
+  /diff-sequences@29.6.3:
+    resolution: {integrity: sha512-EjePK1srD3P08o2j4f0ExnylqRs5B9tJjcp9t1krH2qRi8CCdsYfwe9JgSLurFBWwq4uOlipzfk5fHNvwFKr8Q==}
+    engines: {node: ^14.15.0 || ^16.10.0 || >=18.0.0}
+    dev: true
+
   /diff@5.1.0:
     resolution: {integrity: sha512-D+mk+qE8VC/PAUrlAU34N+VfXev0ghe5ywmpqrawphmVZc1bEfn56uo9qpyGp1p4xpzOHkSW4ztBd6L7Xx4ACw==}
     engines: {node: '>=0.3.1'}
@@ -4659,6 +4782,10 @@ packages:
       web-streams-polyfill: 3.2.1
     dev: true
 
+  /fflate@0.8.0:
+    resolution: {integrity: sha512-FAdS4qMuFjsJj6XHbBaZeXOgaypXp8iw/Tpyuq/w3XA41jjLHT8NPA+n7czH/DDhdncq0nAyDZmPeWXh2qmdIg==}
+    dev: true
+
   /file-type@3.9.0:
     resolution: {integrity: sha512-RLoqTXE8/vPmMuTI88DAzhMYC99I8BWv7zYP4A1puo5HIjEJ5EX48ighy4ZyKMG9EDXxBgW6e++cn7d1xuFghA==}
     engines: {node: '>=0.10.0'}
@@ -4853,6 +4980,10 @@ packages:
     engines: {node: 6.* || 8.* || >= 10.*}
     dev: true
 
+  /get-func-name@2.0.0:
+    resolution: {integrity: sha512-Hm0ixYtaSZ/V7C8FJrtZIuBBI+iSgL+1Aq82zSu8VQNB4S3Gk8e7Qs3VwBDJAhmRZcFqkl3tQu36g/Foh5I5ig==}
+    dev: true
+
   /get-intrinsic@1.2.1:
     resolution: {integrity: sha512-2DcsyfABl+gVHEfCOaTrWgyt+tb6MSEGmKq+kI5HwLbIYgjgmMcV8KQ41uaKz1xxUcn9tJtgFbQUEVcEbd0FYw==}
     dependencies:
@@ -5866,6 +5997,12 @@ packages:
   /lodash@4.17.21:
     resolution: {integrity: sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==}
 
+  /loupe@2.3.6:
+    resolution: {integrity: sha512-RaPMZKiMy8/JruncMU5Bt6na1eftNoo++R4Y+N2FrxkDVTrGvcyzFTsaGif4QTeKESheMGegbhw6iUAq+5A8zA==}
+    dependencies:
+      get-func-name: 2.0.0
+    dev: true
+
   /lru-cache@10.0.1:
     resolution: {integrity: sha512-IJ4uwUTi2qCccrioU6g9g/5rvvVl13bsdczUUcqbciD9iLr095yj8DQKdObriEvuNSx325N1rV1O0sJFszx75g==}
     engines: {node: 14 || >=16.14}
@@ -6834,6 +6971,13 @@ packages:
       yocto-queue: 0.1.0
     dev: true
 
+  /p-limit@4.0.0:
+    resolution: {integrity: sha512-5b0R4txpzjPWVw/cXXUResoD4hb6U/x9BH08L7nw+GN1sezDzPdxeRvpc9c433fZhBan/wusjbCsqwqm4EIBIQ==}
+    engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
+    dependencies:
+      yocto-queue: 1.0.0
+    dev: true
+
   /p-locate@5.0.0:
     resolution: {integrity: sha512-LaNjtRWUBY++zB5nE/NwcaoMylSPk+S+ZHNB1TzdbMJMny6dynpAGt7X/tl/QYq3TIeE6nxHppbo2LGymrG5Pw==}
     engines: {node: '>=10'}
@@ -6968,6 +7112,10 @@ packages:
   /pathe@1.1.1:
     resolution: {integrity: sha512-d+RQGp0MAYTIaDBIMmOfMwz3E+LOZnxx1HZd5R18mmCZY0QBlK0LDZfPc8FW8Ed2DlvsuE6PRjroDY+wg4+j/Q==}
 
+  /pathval@1.1.1:
+    resolution: {integrity: sha512-Dp6zGqpTdETdR63lehJYPeIOqpiNBNtc7BpWSLrOje7UaIsE5aY92r/AunQA7rsXvet3lrJ3JnZX29UPTKXyKQ==}
+    dev: true
+
   /pend@1.2.0:
     resolution: {integrity: sha512-F3asv42UuXchdzt+xXqfW1OGlVBe+mxa2mqI0pg5yAHZPvFmY3Y6drSf/GQ1A86WgWEN9Kzh/WrgKa6iGcHXLg==}
     dev: true
@@ -7527,6 +7675,15 @@ packages:
     engines: {node: ^14.13.1 || >=16.0.0}
     dev: true
 
+  /pretty-format@29.6.3:
+    resolution: {integrity: sha512-ZsBgjVhFAj5KeK+nHfF1305/By3lechHQSMWCTl8iHSbfOm2TN5nHEtFc/+W7fAyUeCs2n5iow72gld4gW0xDw==}
+    engines: {node: ^14.15.0 || ^16.10.0 || >=18.0.0}
+    dependencies:
+      '@jest/schemas': 29.6.3
+      ansi-styles: 5.2.0
+      react-is: 18.2.0
+    dev: true
+
   /proc-log@3.0.0:
     resolution: {integrity: sha512-++Vn7NS4Xf9NacaU9Xq3URUuqZETPsf8L4j5/ckhaRYsfPeRyzGw+iDjFhV/Jr3uNmTvvddEJFWh5R1gRgUH8A==}
     engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
@@ -7621,6 +7778,10 @@ packages:
       strip-json-comments: 2.0.1
     dev: false
 
+  /react-is@18.2.0:
+    resolution: {integrity: sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==}
+    dev: true
+
   /read-cache@1.0.0:
     resolution: {integrity: sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==}
     dependencies:
@@ -7926,6 +8087,10 @@ packages:
       object-inspect: 1.12.3
     dev: false
 
+  /siginfo@2.0.0:
+    resolution: {integrity: sha512-ybx0WO1/8bSBLEWXZvEd7gMW3Sn3JFlW3TvX1nREbDLRNQNaeNN8WK0meBwPdAaOI7TtRRRJn/Es1zhrrCHu7g==}
+    dev: true
+
   /signal-exit@3.0.7:
     resolution: {integrity: sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==}
     dev: true
@@ -8068,6 +8233,10 @@ packages:
       minipass: 7.0.3
     dev: true
 
+  /stackback@0.0.2:
+    resolution: {integrity: sha512-1XMJE5fQo1jGH6Y/7ebnwPOBEkIEnT4QF32d5R1+VXdXveM0IBMJt8zfaxX1P3QhVwrYe+576+jkANtSS2mBbw==}
+    dev: true
+
   /standard-as-callback@2.1.0:
     resolution: {integrity: sha512-qoRRSyROncaz1z0mvYqIE4lCd9p2R90i6GxW3uZv5ucSu8tU7B5HXUP1gG8pVZsYNVaXjk8ClXHPttLyxAL48A==}
     dev: true
@@ -8397,6 +8566,20 @@ packages:
     resolution: {integrity: sha512-AD5ih2NlSssTCwsMznbvwMZpJ1cbhkGd2uueNxzv2jDlEeZdU04JQfRnggJQ8DrcVBGjAsCKwFBbDlVNtEMlzw==}
     dev: true
 
+  /tinybench@2.5.0:
+    resolution: {integrity: sha512-kRwSG8Zx4tjF9ZiyH4bhaebu+EDz1BOx9hOigYHlUW4xxI/wKIUQUqo018UlU4ar6ATPBsaMrdbKZ+tmPdohFA==}
+    dev: true
+
+  /tinypool@0.7.0:
+    resolution: {integrity: sha512-zSYNUlYSMhJ6Zdou4cJwo/p7w5nmAH17GRfU/ui3ctvjXFErXXkruT4MWW6poDeXgCaIBlGLrfU6TbTXxyGMww==}
+    engines: {node: '>=14.0.0'}
+    dev: true
+
+  /tinyspy@2.1.1:
+    resolution: {integrity: sha512-XPJL2uSzcOyBMky6OFrusqWlzfFrXtE0hPuMgW8A2HmaqrPo4ZQHRN/V0QXN3FSjKxpsbRrFc5LI7KOwBsT1/w==}
+    engines: {node: '>=14.0.0'}
+    dev: true
+
   /titleize@3.0.0:
     resolution: {integrity: sha512-KxVu8EYHDPBdUYdKZdKtU2aj2XfEx9AfjXxE/Aj0vT06w2icA09Vus1rh6eSu1y01akYg6BjIK/hxyLJINoMLQ==}
     engines: {node: '>=12'}
@@ -8470,6 +8653,11 @@ packages:
       safe-buffer: 5.2.1
     dev: false
 
+  /type-detect@4.0.8:
+    resolution: {integrity: sha512-0fr/mIH1dlO+x7TlcMy+bIDqKPsw/70tVyeHW787goQjhmqaZe10uwLujubK9q9Lg6Fiho1KUKDYz0Z7k7g5/g==}
+    engines: {node: '>=4'}
+    dev: true
+
   /type-fest@0.21.3:
     resolution: {integrity: sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==}
     engines: {node: '>=10'}
@@ -8804,6 +8992,28 @@ packages:
       - terser
     dev: true
 
+  /vite-node@0.34.3(@types/node@18.17.12):
+    resolution: {integrity: sha512-+0TzJf1g0tYXj6tR2vEyiA42OPq68QkRZCu/ERSo2PtsDJfBpDyEfuKbRvLmZqi/CgC7SCBtyC+WjTGNMRIaig==}
+    engines: {node: '>=v14.18.0'}
+    hasBin: true
+    dependencies:
+      cac: 6.7.14
+      debug: 4.3.4
+      mlly: 1.4.1
+      pathe: 1.1.1
+      picocolors: 1.0.0
+      vite: 4.4.9(@types/node@18.17.12)
+    transitivePeerDependencies:
+      - '@types/node'
+      - less
+      - lightningcss
+      - sass
+      - stylus
+      - sugarss
+      - supports-color
+      - terser
+    dev: true
+
   /vite-plugin-checker@0.6.2(typescript@5.2.2)(vite@4.3.9):
     resolution: {integrity: sha512-YvvvQ+IjY09BX7Ab+1pjxkELQsBd4rPhWNw8WLBeFVxu/E7O+n6VYAqNsKdK/a2luFlX/sMpoWdGFfg4HvwdJQ==}
     engines: {node: '>=14.16'}
@@ -8969,6 +9179,72 @@ packages:
       fsevents: 2.3.3
     dev: true
 
+  /vitest@0.34.3(@vitest/ui@0.34.3):
+    resolution: {integrity: sha512-7+VA5Iw4S3USYk+qwPxHl8plCMhA5rtfwMjgoQXMT7rO5ldWcdsdo3U1QD289JgglGK4WeOzgoLTsGFu6VISyQ==}
+    engines: {node: '>=v14.18.0'}
+    hasBin: true
+    peerDependencies:
+      '@edge-runtime/vm': '*'
+      '@vitest/browser': '*'
+      '@vitest/ui': '*'
+      happy-dom: '*'
+      jsdom: '*'
+      playwright: '*'
+      safaridriver: '*'
+      webdriverio: '*'
+    peerDependenciesMeta:
+      '@edge-runtime/vm':
+        optional: true
+      '@vitest/browser':
+        optional: true
+      '@vitest/ui':
+        optional: true
+      happy-dom:
+        optional: true
+      jsdom:
+        optional: true
+      playwright:
+        optional: true
+      safaridriver:
+        optional: true
+      webdriverio:
+        optional: true
+    dependencies:
+      '@types/chai': 4.3.6
+      '@types/chai-subset': 1.3.3
+      '@types/node': 18.17.12
+      '@vitest/expect': 0.34.3
+      '@vitest/runner': 0.34.3
+      '@vitest/snapshot': 0.34.3
+      '@vitest/spy': 0.34.3
+      '@vitest/ui': 0.34.3(vitest@0.34.3)
+      '@vitest/utils': 0.34.3
+      acorn: 8.10.0
+      acorn-walk: 8.2.0
+      cac: 6.7.14
+      chai: 4.3.8
+      debug: 4.3.4
+      local-pkg: 0.4.3
+      magic-string: 0.30.3
+      pathe: 1.1.1
+      picocolors: 1.0.0
+      std-env: 3.4.3
+      strip-literal: 1.3.0
+      tinybench: 2.5.0
+      tinypool: 0.7.0
+      vite: 4.4.9(@types/node@18.17.12)
+      vite-node: 0.34.3(@types/node@18.17.12)
+      why-is-node-running: 2.2.2
+    transitivePeerDependencies:
+      - less
+      - lightningcss
+      - sass
+      - stylus
+      - sugarss
+      - supports-color
+      - terser
+    dev: true
+
   /vscode-jsonrpc@6.0.0:
     resolution: {integrity: sha512-wnJA4BnEjOSyFMvjZdpiOwhSq9uDoK8e/kpRJDTaMYzwlkrhG1fwDIZI94CLsLzlCK5cIbMMtFlJlfR57Lavmg==}
     engines: {node: '>=8.0.0 || >=10.0.0'}
@@ -9169,6 +9445,15 @@ packages:
       isexe: 2.0.0
     dev: true
 
+  /why-is-node-running@2.2.2:
+    resolution: {integrity: sha512-6tSwToZxTOcotxHeA+qGCq1mVzKR3CwcJGmVcY+QE8SHy6TnpFnh8PAvPNHYr7EcuVeG0QSMxtYCuO1ta/G/oA==}
+    engines: {node: '>=8'}
+    hasBin: true
+    dependencies:
+      siginfo: 2.0.0
+      stackback: 0.0.2
+    dev: true
+
   /wide-align@1.1.5:
     resolution: {integrity: sha512-eDMORYaPNZ4sQIuuYPDHdQvf4gyCF9rEEV/yPxGfwPkRodwEgiMUUXTx/dex+Me0wxx53S+NgUHaP7y3MGlDmg==}
     dependencies:
@@ -9291,6 +9576,11 @@ packages:
     engines: {node: '>=10'}
     dev: true
 
+  /yocto-queue@1.0.0:
+    resolution: {integrity: sha512-9bnSc/HEW2uRy67wc+T8UwauLuPJVn28jb+GtJY16iiKWyvmYJRXVT4UamsAEGQfPohgr2q4Tq0sQbQlxTfi1g==}
+    engines: {node: '>=12.20'}
+    dev: true
+
   /zhead@2.0.10:
     resolution: {integrity: sha512-irug8fXNKjqazkA27cFQs7C6/ZD3qNiEzLC56kDyzQART/Z9GMGfg8h2i6fb9c8ZWnIx/QgOgFJxK3A/CYHG0g==}
     dev: true
diff --git a/vitest.config.ts b/vitest.config.ts
new file mode 100644
index 0000000..c503419
--- /dev/null
+++ b/vitest.config.ts
@@ -0,0 +1,7 @@
+import { configDefaults, defineConfig } from 'vitest/config';
+
+export default defineConfig({
+  test: {
+    exclude: [...configDefaults.exclude, 'data/**/*'],
+  },
+});