Add search and chat buttons

Author: Eroxl

.gitignore

@@ -2,7 +2,8 @@
 **/.DS_Store
 
 # -=- Eroxl's Device Specific Ignores -=-
-**/Icon?
+Icon?
+!icons
 
 # -=- Node Modules -=-
 **/node_modules/**
@@ -15,4 +16,4 @@
 **/cypress/videos
 
 # -=- Security -=-
-/config/.env
+/config/.env

backend/src/helpers/getChatResponse.ts

@@ -3,6 +3,8 @@ import ChromaClient from './clients/ChromaClient';
 
 import type { ChatCompletionRequestMessage } from 'openai';
 
+const RELATIVE_TEXT_COUNT = 3;
+
 const CONTEXT_PROMPT_TEMPLATE = '### Context: ';
 
 const QUESTION_PROMPT_TEMPLATE = '### Question: ';
@@ -47,7 +49,7 @@ const getChatResponse = async (
     // ~ Query the database for the most similar message
     const similarMessages = await blockCollection.query(
       embeddings.data.data[0].embedding,
-      1,
+      RELATIVE_TEXT_COUNT,
       {
         userID: user,
       },
@@ -89,6 +91,9 @@ const getChatResponse = async (
       .join('\n')
 
 
+    // ~ TODO: Start adding support for streaming the response
+    //         https://www.reddit.com/r/ChatGPT/comments/11m3jdw/chatgpt_api_streaming/
+    //         https://gist.github.com/montanaflynn/6a438f0be606daede899
     const response = await OpenAIClient.createChatCompletion({
       messages: [
         {

web/src/components/pageInfo/PageSidebar.tsx

@@ -1,6 +1,9 @@
 import React, { useState, useEffect } from 'react';
+import Image from 'next/image';
 
 import PageSidebarItem from './PageSidebarItem';
+import Brain from '../../public/icons/Brain.svg';
+import Search from '../../public/icons/Search.svg';
 
 export interface PageSidebarItemProps {
   _id: string,
@@ -55,6 +58,36 @@ const PageSidebar = () => {
 
   return (
     <div className="absolute h-screen pt-12 pr-3 select-none print:h-max w-52 print:w-0 bg-amber-400/10 no-scrollbar dark:bg-white/10">
+      <div className="flex flex-col w-full gap-2 pb-2 pl-3">
+        <button
+          className="flex flex-row gap-1 p-2 py-1 text-left text-white rounded hover:bg-white/20"
+          onClick={() => {
+            document.dispatchEvent(new CustomEvent('openSearchModal'));
+          }}
+        >
+          <Image
+            src={Search}
+            alt="Search"
+            width={24}
+            height={24}
+          />
+          Search
+        </button>
+        <button
+          className="flex flex-row gap-1 p-2 py-1 text-left text-white rounded hover:bg-white/20"
+          onClick={() => {
+            document.dispatchEvent(new CustomEvent('openChatPage'));
+          }}
+        >
+          <Image
+            src={Brain}
+            alt="Chat"
+            width={24}
+            height={24}
+          />
+          Chat
+        </button>
+      </div>
       {/* ~ Render the page tree after it has been loaded */}
       {!isLoading && (
         (pageTree as PageSidebarItemProps[]).map((pageItem) => {