From fd5339d90abdb664111bb4ae54a68b6a3ff6c5f1 Mon Sep 17 00:00:00 2001
From: n4ze3m <n4ze3m@gmail.com>
Date: Sat, 19 Oct 2024 18:22:33 +0530
Subject: [PATCH 1/8] Bump version to 1.3.1

Minor version bump to reflect updates.
---
 wxt.config.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/wxt.config.ts b/wxt.config.ts
index eac1c2b..5d06de7 100644
--- a/wxt.config.ts
+++ b/wxt.config.ts
@@ -50,7 +50,7 @@ export default defineConfig({
   outDir: "build",
 
   manifest: {
-    version: "1.3.0",
+    version: "1.3.1",
     name:
       process.env.TARGET === "firefox"
         ? "Page Assist - A Web UI for Local AI Models"

From 7be993c0578f2e8ee7a16c409908a859675bb3af Mon Sep 17 00:00:00 2001
From: n4ze3m <n4ze3m@gmail.com>
Date: Sat, 19 Oct 2024 23:54:09 +0530
Subject: [PATCH 2/8] feat: Add HTML preview to code blocks

Adds an HTML preview feature to the code block component, allowing users to view the rendered output of their HTML code snippets. This improves the user experience by providing a more interactive and informative way to understand the code.
---
 src/components/Common/CodeBlock.tsx           | 65 +++++++++++++++----
 .../Option/Playground/PlaygroundChat.tsx      |  2 +-
 2 files changed, 53 insertions(+), 14 deletions(-)

diff --git a/src/components/Common/CodeBlock.tsx b/src/components/Common/CodeBlock.tsx
index ea112f2..d48a699 100644
--- a/src/components/Common/CodeBlock.tsx
+++ b/src/components/Common/CodeBlock.tsx
@@ -1,6 +1,6 @@
-import { Tooltip } from "antd"
-import { CheckIcon, ClipboardIcon } from "lucide-react"
-import { FC,  useState } from "react"
+import { Tooltip, Modal } from "antd"
+import { CheckIcon, ClipboardIcon, EyeIcon, Maximize2Icon } from "lucide-react"
+import { FC, useState } from "react"
 import { useTranslation } from "react-i18next"
 import { Prism as SyntaxHighlighter } from "react-syntax-highlighter"
 import { coldarkDark } from "react-syntax-highlighter/dist/cjs/styles/prism"
@@ -10,26 +10,47 @@ interface Props {
   value: string
 }
 
-export const CodeBlock: FC<Props> =({ language, value }) => {
+export const CodeBlock: FC<Props> = ({ language, value }) => {
   const [isBtnPressed, setIsBtnPressed] = useState(false)
+  const [previewVisible, setPreviewVisible] = useState(false)
   const { t } = useTranslation("common")
+
+  const handleCopy = () => {
+    navigator.clipboard.writeText(value)
+    setIsBtnPressed(true)
+    setTimeout(() => {
+      setIsBtnPressed(false)
+    }, 4000)
+  }
+
+  const handlePreview = () => {
+    setPreviewVisible(true)
+  }
+
+  const handlePreviewClose = () => {
+    setPreviewVisible(false)
+  }
+
   return (
     <>
-      <div className="code relative text-base font-sans codeblock bg-zinc-950  rounded-md overflow-hidden">
+      <div className="code relative text-base font-sans codeblock bg-zinc-950 rounded-md overflow-hidden">
         <div className="flex bg-gray-800 items-center justify-between py-1.5 px-4">
           <span className="text-xs lowercase text-gray-200">{language}</span>
 
           <div className="flex items-center">
+            {language.toLowerCase() === "html" && (
+              <Tooltip title={t("preview")}>
+                <button
+                  onClick={handlePreview}
+                  className="flex gap-1.5 items-center rounded bg-none p-1 text-xs text-gray-200 hover:bg-gray-700 hover:text-gray-100 focus:outline-none">
+                  <EyeIcon className="h-4 w-4" />
+                </button>
+              </Tooltip>
+            )}
             <Tooltip title={t("copyToClipboard")}>
               <button
-                onClick={() => {
-                  navigator.clipboard.writeText(value)
-                  setIsBtnPressed(true)
-                  setTimeout(() => {
-                    setIsBtnPressed(false)
-                  }, 4000)
-                }}
-                className="flex gap-1.5 items-center rounded bg-none p-1 text-xs text-gray-200 hover:bg-gray-700 hover:text-gray-100 focus:outline-none focus:ring-2 focus:ring-gray-500 focus:ring-offset-2 focus:ring-offset-gray-100">
+                onClick={handleCopy}
+                className="flex gap-1.5 items-center rounded bg-none p-1 text-xs text-gray-200 hover:bg-gray-700 hover:text-gray-100 focus:outline-none">
                 {!isBtnPressed ? (
                   <ClipboardIcon className="h-4 w-4" />
                 ) : (
@@ -61,6 +82,24 @@ export const CodeBlock: FC<Props> =({ language, value }) => {
           {value}
         </SyntaxHighlighter>
       </div>
+      {previewVisible && (
+        <Modal
+          open={previewVisible}
+          onCancel={handlePreviewClose}
+          footer={null}
+          width="80%"
+          zIndex={999999}
+          centered
+          bodyStyle={{ padding: 0 }}>
+          <div className="relative  w-full h-[80vh]">
+            <iframe
+              srcDoc={value}
+              title="HTML Preview"
+              className="w-full h-full"
+            />
+          </div>
+        </Modal>
+      )}
     </>
   )
 }
diff --git a/src/components/Option/Playground/PlaygroundChat.tsx b/src/components/Option/Playground/PlaygroundChat.tsx
index e34c594..5d980f9 100644
--- a/src/components/Option/Playground/PlaygroundChat.tsx
+++ b/src/components/Option/Playground/PlaygroundChat.tsx
@@ -61,7 +61,7 @@ export const PlaygroundChat = () => {
         )}
       </div>
       {!isAtBottom && (
-        <div className="fixed md:bottom-44 bottom-36 z-[9999999] left-0 right-0 flex justify-center">
+        <div className="fixed md:bottom-44 bottom-36 z-[99999] left-0 right-0 flex justify-center">
           <button
             onClick={scrollToBottom}
             className="bg-gray-100 dark:bg-gray-800 p-1 rounded-full shadow-md hover:bg-gray-200 dark:hover:bg-gray-700 transition-colors duration-200">

From a2f9002b8115176fa1dfca28ffbf485278cc4ac2 Mon Sep 17 00:00:00 2001
From: n4ze3m <n4ze3m@gmail.com>
Date: Sun, 20 Oct 2024 17:45:56 +0530
Subject: [PATCH 3/8] feat: enhance playground UI

Refine the Playground's UI to improve user experience:

- Streamline chat window layout for better message readability
- Introduce a knowledge selection dropdown for easier context setting
- Improve image upload integration for a smoother workflow
- Optimize spacing and styling for a more polished visual appearance
---
 src/components/Common/CodeBlock.tsx           |  6 ++-
 src/components/Common/Playground/Message.tsx  |  4 +-
 src/components/Icons/Fireworks.tsx            |  2 +-
 .../Option/Playground/PlaygroundChat.tsx      |  6 +--
 .../Option/Playground/PlaygroundForm.tsx      | 39 ++++++++++---------
 5 files changed, 32 insertions(+), 25 deletions(-)

diff --git a/src/components/Common/CodeBlock.tsx b/src/components/Common/CodeBlock.tsx
index d48a699..9fd759d 100644
--- a/src/components/Common/CodeBlock.tsx
+++ b/src/components/Common/CodeBlock.tsx
@@ -90,7 +90,11 @@ export const CodeBlock: FC<Props> = ({ language, value }) => {
           width="80%"
           zIndex={999999}
           centered
-          bodyStyle={{ padding: 0 }}>
+          styles={{
+            body: {
+              padding: 0
+            }
+          }}>
           <div className="relative  w-full h-[80vh]">
             <iframe
               srcDoc={value}
diff --git a/src/components/Common/Playground/Message.tsx b/src/components/Common/Playground/Message.tsx
index c2d4290..9d664a1 100644
--- a/src/components/Common/Playground/Message.tsx
+++ b/src/components/Common/Playground/Message.tsx
@@ -48,8 +48,8 @@ export const PlaygroundMessage = (props: Props) => {
 
   return (
     <div className="group w-full text-gray-800 dark:text-gray-100">
-      <div className="text-base  md:max-w-2xl lg:max-w-xl xl:max-w-3xl flex lg:px-0 m-auto w-full">
-        <div className="flex flex-row gap-4 md:gap-6 md:max-w-2xl lg:max-w-xl xl:max-w-3xl p-4 md:py-6 lg:px-0 m-auto w-full">
+      <div className="text-base md:max-w-2xl lg:max-w-xl xl:max-w-3xl  flex lg:px-0 m-auto w-full">
+        <div className="flex flex-row gap-4 md:gap-6 p-4 md:py-6 lg:px-0 m-auto w-full">
           <div className="w-8 flex flex-col relative items-end">
             <div className="relative h-7 w-7 p-1 rounded-sm text-white flex items-center justify-center  text-opacity-100r">
               {props.isBot ? (
diff --git a/src/components/Icons/Fireworks.tsx b/src/components/Icons/Fireworks.tsx
index 95ed708..2940bea 100644
--- a/src/components/Icons/Fireworks.tsx
+++ b/src/components/Icons/Fireworks.tsx
@@ -12,7 +12,7 @@ export const FireworksMonoIcon = React.forwardRef<
       ref={ref}
       {...props}>
       <path
-        fill="#fff"
+        fill="#6720FF"
         d="M318.563 221.755c-17.7 0-33.584-10.508-40.357-26.777L196.549 0h47.793l74.5 178.361L393.273 0h47.793L358.92 195.048c-6.808 16.199-22.657 26.707-40.357 26.707zM425.111 314.933c-17.63 0-33.444-10.439-40.287-26.567-6.877-16.269-3.317-34.842 9.112-47.445l148.721-150.64 18.572 43.813-136.153 137.654 194.071-1.082 18.573 43.813-212.574.524-.07-.07h.035zM0 314.408l18.573-43.813 194.07 1.082L76.525 133.988l18.573-43.813 148.721 150.641c12.428 12.568 16.024 31.21 9.111 47.444-6.842 16.164-22.727 26.567-40.287 26.567L.07 314.339l-.07.069z"></path>
     </svg>
   )
diff --git a/src/components/Option/Playground/PlaygroundChat.tsx b/src/components/Option/Playground/PlaygroundChat.tsx
index 5d980f9..0049fba 100644
--- a/src/components/Option/Playground/PlaygroundChat.tsx
+++ b/src/components/Option/Playground/PlaygroundChat.tsx
@@ -27,7 +27,7 @@ export const PlaygroundChat = () => {
     <>
       <div
         ref={containerRef}
-        className="custom-scrollbar grow flex flex-col md:translate-x-0 transition-transform duration-300 ease-in-out overflow-y-auto h-[calc(100vh-200px)]">
+        className="custom-scrollbar grow flex flex-col md:translate-x-0 transition-transform duration-300 ease-in-out overflow-y-auto h-[calc(100vh-160px)]">
         {messages.length === 0 && (
           <div className="mt-32">
             <PlaygroundEmpty />
@@ -61,10 +61,10 @@ export const PlaygroundChat = () => {
         )}
       </div>
       {!isAtBottom && (
-        <div className="fixed md:bottom-44 bottom-36 z-[99999] left-0 right-0 flex justify-center">
+        <div className="fixed md:bottom-40 bottom-36 z-20 left-0 right-0 flex justify-center">
           <button
             onClick={scrollToBottom}
-            className="bg-gray-100 dark:bg-gray-800 p-1 rounded-full shadow-md hover:bg-gray-200 dark:hover:bg-gray-700 transition-colors duration-200">
+            className="bg-gray-100 border dark:border-gray-700 dark:bg-gray-800 p-1 rounded-full shadow-md hover:bg-gray-200 dark:hover:bg-gray-700 transition-colors duration-200">
             <ChevronDown className="size-4 text-gray-600 dark:text-gray-300" />
           </button>
         </div>
diff --git a/src/components/Option/Playground/PlaygroundForm.tsx b/src/components/Option/Playground/PlaygroundForm.tsx
index cb2029a..be312e2 100644
--- a/src/components/Option/Playground/PlaygroundForm.tsx
+++ b/src/components/Option/Playground/PlaygroundForm.tsx
@@ -190,7 +190,7 @@ export const PlaygroundForm = ({ dropedFile }: Props) => {
   }
 
   return (
-    <div className="px-3 pt-3 md:px-6 md:pt-6 bg-gray-50 dark:bg-[#262626] border rounded-t-xl  dark:border-gray-600">
+    <div className="px-3 pt-3 md:px-4 md:pt-4 bg-gray-100 dark:bg-[#262626] border rounded-t-xl  dark:border-gray-600">
       <div
         className={`h-full rounded-md shadow relative ${
           form.values.image.length === 0 ? "hidden" : "block"
@@ -213,7 +213,7 @@ export const PlaygroundForm = ({ dropedFile }: Props) => {
         </div>
       </div>
       <div>
-        <div className="flex bg-white dark:bg-transparent">
+        <div className="flex rounded-t-xl bg-white dark:bg-transparent">
           <form
             onSubmit={form.onSubmit(async (value) => {
               stopListening()
@@ -264,7 +264,7 @@ export const PlaygroundForm = ({ dropedFile }: Props) => {
                 required
                 onPaste={handlePaste}
                 rows={1}
-                style={{ minHeight: "60px" }}
+                style={{ minHeight: "40px" }}
                 tabIndex={0}
                 placeholder={t("form.textarea.placeholder")}
                 {...form.getInputProps("message")}
@@ -286,7 +286,23 @@ export const PlaygroundForm = ({ dropedFile }: Props) => {
                   )}
                 </div>
                 <div className="flex !justify-end gap-3">
-                  <KnowledgeSelect />
+                  
+
+                  {!selectedKnowledge && (
+                    <Tooltip title={t("tooltip.uploadImage")}>
+                      <button
+                        type="button"
+                        onClick={() => {
+                          inputRef.current?.click()
+                        }}
+                        className={`flex items-center justify-center dark:text-gray-300 ${
+                          chatMode === "rag" ? "hidden" : "block"
+                        }`}>
+                        <ImageIcon className="h-5 w-5" />
+                      </button>
+                    </Tooltip>
+                  )}
+
                   {browserSupportsSpeechRecognition && (
                     <Tooltip title={t("tooltip.speechToText")}>
                       <button
@@ -314,21 +330,8 @@ export const PlaygroundForm = ({ dropedFile }: Props) => {
                       </button>
                     </Tooltip>
                   )}
+                  <KnowledgeSelect />
 
-                  {!selectedKnowledge && (
-                    <Tooltip title={t("tooltip.uploadImage")}>
-                      <button
-                        type="button"
-                        onClick={() => {
-                          inputRef.current?.click()
-                        }}
-                        className={`flex items-center justify-center dark:text-gray-300 ${
-                          chatMode === "rag" ? "hidden" : "block"
-                        }`}>
-                        <ImageIcon className="h-5 w-5" />
-                      </button>
-                    </Tooltip>
-                  )}
                   {!isSending ? (
                     <Dropdown.Button
                       htmlType="submit"

From 9cc309e9fd81477bd300a5252592f7b1b86144d4 Mon Sep 17 00:00:00 2001
From: n4ze3m <n4ze3m@gmail.com>
Date: Sat, 26 Oct 2024 15:37:02 +0530
Subject: [PATCH 4/8] feat: Add code download functionality

Adds a new "Download Code" button to the code block component, allowing users to download the code displayed for offline use.

This feature enhances user convenience and provides a more versatile experience for exploring and utilizing code snippets.
---
 src/assets/locale/da/common.json              |  3 +-
 src/assets/locale/de/common.json              |  3 +-
 src/assets/locale/en/common.json              |  3 +-
 src/assets/locale/es/common.json              |  3 +-
 src/assets/locale/fa/common.json              |  3 +-
 src/assets/locale/fr/common.json              |  3 +-
 src/assets/locale/it/common.json              |  3 +-
 src/assets/locale/ja-JP/common.json           |  3 +-
 src/assets/locale/ml/common.json              |  3 +-
 src/assets/locale/no/common.json              |  3 +-
 src/assets/locale/pt-BR/common.json           |  3 +-
 src/assets/locale/ru/common.json              |  3 +-
 src/assets/locale/zh/common.json              |  3 +-
 src/components/Common/CodeBlock.tsx           | 37 +++++++++++--------
 src/components/Layouts/Layout.tsx             |  4 +-
 .../Option/Playground/PlaygroundChat.tsx      |  4 +-
 src/hooks/useMessageOption.tsx                |  2 +-
 src/utils/langauge-extension.ts               | 29 +++++++++++++++
 18 files changed, 82 insertions(+), 33 deletions(-)
 create mode 100644 src/utils/langauge-extension.ts

diff --git a/src/assets/locale/da/common.json b/src/assets/locale/da/common.json
index 5a60ec5..0c48185 100644
--- a/src/assets/locale/da/common.json
+++ b/src/assets/locale/da/common.json
@@ -101,5 +101,6 @@
         "translate": "Oversæt",
         "custom": "Brugerdefineret"
     },
-    "citations": "Citater"
+    "citations": "Citater",
+    "downloadCode": "Download Kode"
 }
\ No newline at end of file
diff --git a/src/assets/locale/de/common.json b/src/assets/locale/de/common.json
index 0444973..c70fa49 100644
--- a/src/assets/locale/de/common.json
+++ b/src/assets/locale/de/common.json
@@ -101,5 +101,6 @@
         "translate": "Übersetzen",
         "custom": "Benutzerdefiniert"
     },
-    "citations": "Zitate"
+    "citations": "Zitate",
+    "downloadCode": "Code herunterladen"
 }
\ No newline at end of file
diff --git a/src/assets/locale/en/common.json b/src/assets/locale/en/common.json
index 7198457..24adfdf 100644
--- a/src/assets/locale/en/common.json
+++ b/src/assets/locale/en/common.json
@@ -105,5 +105,6 @@
     "segmented": {
         "ollama": "Ollama Models",
         "custom": "Custom Models"
-    }
+    },
+    "downloadCode": "Download Code"
 }
\ No newline at end of file
diff --git a/src/assets/locale/es/common.json b/src/assets/locale/es/common.json
index 33dd76a..b713319 100644
--- a/src/assets/locale/es/common.json
+++ b/src/assets/locale/es/common.json
@@ -100,5 +100,6 @@
         "rephrase": "Reformular",
         "translate": "Traducir"
     },
-    "citations": "Citas"
+    "citations": "Citas",
+    "downloadCode": "Descargar Código"
 }
\ No newline at end of file
diff --git a/src/assets/locale/fa/common.json b/src/assets/locale/fa/common.json
index 1dd3ddd..432934e 100644
--- a/src/assets/locale/fa/common.json
+++ b/src/assets/locale/fa/common.json
@@ -94,5 +94,6 @@
         },
         "advanced": "تنظیمات بیشتر مدل"
     },
-    "citations": "منابع"
+    "citations": "منابع",
+    "downloadCode": "دانلود کد"
 }
\ No newline at end of file
diff --git a/src/assets/locale/fr/common.json b/src/assets/locale/fr/common.json
index 03cd970..8c214b1 100644
--- a/src/assets/locale/fr/common.json
+++ b/src/assets/locale/fr/common.json
@@ -100,5 +100,6 @@
         "rephrase": "Reformuler",
         "translate": "Traduire"
     },
-    "citations": "Citations"
+    "citations": "Citations",
+    "downloadCode": "Télécharger le code"
 }
\ No newline at end of file
diff --git a/src/assets/locale/it/common.json b/src/assets/locale/it/common.json
index 6e7cd38..6aba664 100644
--- a/src/assets/locale/it/common.json
+++ b/src/assets/locale/it/common.json
@@ -100,5 +100,6 @@
         "rephrase": "Riformulare",
         "translate": "Tradurre"
     },
-    "citations": "Citazioni"
+    "citations": "Citazioni",
+    "downloadCode": "Scarica Codice"
 }
\ No newline at end of file
diff --git a/src/assets/locale/ja-JP/common.json b/src/assets/locale/ja-JP/common.json
index 4bb7061..814ca9d 100644
--- a/src/assets/locale/ja-JP/common.json
+++ b/src/assets/locale/ja-JP/common.json
@@ -100,5 +100,6 @@
     "rephrase": "言い換え",
     "translate": "翻訳"
   },
-  "citations": "引用"
+  "citations": "引用",
+  "downloadCode": "コードをダウンロード"
 }
\ No newline at end of file
diff --git a/src/assets/locale/ml/common.json b/src/assets/locale/ml/common.json
index 9f00717..693d9fb 100644
--- a/src/assets/locale/ml/common.json
+++ b/src/assets/locale/ml/common.json
@@ -99,5 +99,6 @@
         "rephrase": "പുനഃരൂപീകരിക്കുക",
         "translate": "വിവർത്തനം ചെയ്യുക"
     },
-    "citations": "ഉദ്ധരണികൾ"
+    "citations": "ഉദ്ധരണികൾ",
+    "downloadCode": "കോഡ് ഡൗൺലോഡ് ചെയ്യുക"
 }
\ No newline at end of file
diff --git a/src/assets/locale/no/common.json b/src/assets/locale/no/common.json
index 99c91ce..665cae5 100644
--- a/src/assets/locale/no/common.json
+++ b/src/assets/locale/no/common.json
@@ -101,5 +101,6 @@
         "translate": "Oversett",
         "custom": "Egendefinert"
     },
-    "citations": "Sitater"
+    "citations": "Sitater",
+    "downloadCode": "Last ned kode"
 }
\ No newline at end of file
diff --git a/src/assets/locale/pt-BR/common.json b/src/assets/locale/pt-BR/common.json
index c09c1b4..dbf6af6 100644
--- a/src/assets/locale/pt-BR/common.json
+++ b/src/assets/locale/pt-BR/common.json
@@ -100,5 +100,6 @@
     "rephrase": "Reformular",
     "translate": "Traduzir"
   },
-  "citations": "Citações"
+  "citations": "Citações",
+  "downloadCode": "Baixar Código"
 }
\ No newline at end of file
diff --git a/src/assets/locale/ru/common.json b/src/assets/locale/ru/common.json
index 582896c..5b4fedd 100644
--- a/src/assets/locale/ru/common.json
+++ b/src/assets/locale/ru/common.json
@@ -100,5 +100,6 @@
         "rephrase": "Перефразировать",
         "translate": "Перевести"
     },
-    "citations": "Цитаты"
+    "citations": "Цитаты",
+    "downloadCode": "Скачать код"
 }
\ No newline at end of file
diff --git a/src/assets/locale/zh/common.json b/src/assets/locale/zh/common.json
index ddb08b4..9019aa5 100644
--- a/src/assets/locale/zh/common.json
+++ b/src/assets/locale/zh/common.json
@@ -100,5 +100,6 @@
         "rephrase": "重述",
         "translate": "翻译"
     },
-    "citations": "引用"
+    "citations": "引用",
+    "downloadCode": "下载代码"
 }
\ No newline at end of file
diff --git a/src/components/Common/CodeBlock.tsx b/src/components/Common/CodeBlock.tsx
index 9fd759d..af1e363 100644
--- a/src/components/Common/CodeBlock.tsx
+++ b/src/components/Common/CodeBlock.tsx
@@ -1,5 +1,6 @@
+import { programmingLanguages } from "@/utils/langauge-extension"
 import { Tooltip, Modal } from "antd"
-import { CheckIcon, ClipboardIcon, EyeIcon, Maximize2Icon } from "lucide-react"
+import { CheckIcon, ClipboardIcon, DownloadIcon } from "lucide-react"
 import { FC, useState } from "react"
 import { useTranslation } from "react-i18next"
 import { Prism as SyntaxHighlighter } from "react-syntax-highlighter"
@@ -23,30 +24,36 @@ export const CodeBlock: FC<Props> = ({ language, value }) => {
     }, 4000)
   }
 
-  const handlePreview = () => {
-    setPreviewVisible(true)
-  }
-
   const handlePreviewClose = () => {
     setPreviewVisible(false)
   }
 
+  const handleDownload = () => {
+    const blob = new Blob([value], { type: "text/plain" })
+    const url = window.URL.createObjectURL(blob)
+    const a = document.createElement("a")
+    a.href = url
+    a.download = `code_${new Date().toISOString().replace(/[:.]/g, "-")}.${programmingLanguages[language] || language}`
+    document.body.appendChild(a)
+    a.click()
+    document.body.removeChild(a)
+    window.URL.revokeObjectURL(url)
+  }
+
   return (
     <>
       <div className="code relative text-base font-sans codeblock bg-zinc-950 rounded-md overflow-hidden">
         <div className="flex bg-gray-800 items-center justify-between py-1.5 px-4">
           <span className="text-xs lowercase text-gray-200">{language}</span>
 
-          <div className="flex items-center">
-            {language.toLowerCase() === "html" && (
-              <Tooltip title={t("preview")}>
-                <button
-                  onClick={handlePreview}
-                  className="flex gap-1.5 items-center rounded bg-none p-1 text-xs text-gray-200 hover:bg-gray-700 hover:text-gray-100 focus:outline-none">
-                  <EyeIcon className="h-4 w-4" />
-                </button>
-              </Tooltip>
-            )}
+          <div className="flex items-center gap-2">
+            <Tooltip title={t("downloadCode")}>
+              <button
+                onClick={handleDownload}
+                className="flex gap-1.5 items-center rounded bg-none p-1 text-xs text-gray-200 hover:bg-gray-700 hover:text-gray-100 focus:outline-none">
+                <DownloadIcon className="h-4 w-4" />
+              </button>
+            </Tooltip>
             <Tooltip title={t("copyToClipboard")}>
               <button
                 onClick={handleCopy}
diff --git a/src/components/Layouts/Layout.tsx b/src/components/Layouts/Layout.tsx
index c279a4b..e8e9c1d 100644
--- a/src/components/Layouts/Layout.tsx
+++ b/src/components/Layouts/Layout.tsx
@@ -54,14 +54,14 @@ export default function OptionLayout({
                   if (confirm) {
                     const db = new PageAssitDatabase()
                     await db.deleteAllChatHistory()
-                    queryClient.invalidateQueries({
+                    await queryClient.invalidateQueries({
                       queryKey: ["fetchChatHistory"]
                     })
                     clearChat()
                   }
                 }}
                 className="text-gray-600 hover:text-gray-800 dark:text-gray-300 dark:hover:text-gray-100">
-                <EraserIcon className="size-5"   />
+                <EraserIcon className="size-5" />
               </button>
             </Tooltip>
           </div>
diff --git a/src/components/Option/Playground/PlaygroundChat.tsx b/src/components/Option/Playground/PlaygroundChat.tsx
index 0049fba..4a2795b 100644
--- a/src/components/Option/Playground/PlaygroundChat.tsx
+++ b/src/components/Option/Playground/PlaygroundChat.tsx
@@ -61,10 +61,10 @@ export const PlaygroundChat = () => {
         )}
       </div>
       {!isAtBottom && (
-        <div className="fixed md:bottom-40 bottom-36 z-20 left-0 right-0 flex justify-center">
+        <div className="fixed bottom-36 z-20 left-0 right-0 flex justify-center">
           <button
             onClick={scrollToBottom}
-            className="bg-gray-100 border dark:border-gray-700 dark:bg-gray-800 p-1 rounded-full shadow-md hover:bg-gray-200 dark:hover:bg-gray-700 transition-colors duration-200">
+            className="bg-white border border-gray-100 dark:border-none dark:bg-white/20 p-1.5 rounded-full pointer-events-auto">
             <ChevronDown className="size-4 text-gray-600 dark:text-gray-300" />
           </button>
         </div>
diff --git a/src/hooks/useMessageOption.tsx b/src/hooks/useMessageOption.tsx
index 3b38353..c7a2edb 100644
--- a/src/hooks/useMessageOption.tsx
+++ b/src/hooks/useMessageOption.tsx
@@ -8,7 +8,7 @@ import {
   systemPromptForNonRagOption
 } from "~/services/ollama"
 import { type ChatHistory, type Message } from "~/store/option"
-import { HumanMessage, SystemMessage } from "@langchain/core/messages"
+import { SystemMessage } from "@langchain/core/messages"
 import { useStoreMessageOption } from "~/store/option"
 import {
   deleteChatForEdit,
diff --git a/src/utils/langauge-extension.ts b/src/utils/langauge-extension.ts
new file mode 100644
index 0000000..e8f8ea2
--- /dev/null
+++ b/src/utils/langauge-extension.ts
@@ -0,0 +1,29 @@
+export const programmingLanguages = {
+    html: "html",
+    javascript: "js",
+    typescript: "ts",
+    python: "py",
+    java: "java",
+    cpp: "cpp",
+    c: "c",
+    csharp: "cs",
+    ruby: "rb",
+    php: "php",
+    swift: "swift",
+    go: "go",
+    rust: "rs",
+    kotlin: "kt",
+    sql: "sql",
+    shell: "sh",
+    markdown: "md",
+    json: "json",
+    yaml: "yml",
+    xml: "xml",
+    css: "css",
+    scss: "scss",
+    jsx: "jsx",
+    tsx: "tsx",
+    vue: "vue",
+    dart: "dart",
+    lua: "lua"
+}
\ No newline at end of file

From f01f9d0482e1693347002c67da636ea86a93064a Mon Sep 17 00:00:00 2001
From: n4ze3m <n4ze3m@gmail.com>
Date: Sat, 26 Oct 2024 15:47:00 +0530
Subject: [PATCH 5/8] feat: Remove language detection

The language detection mechanism has been removed to streamline the translation process and ensure a consistent user experience across all locales. This change aims to simplify the i18n setup and minimize potential complexities associated with dynamic language switching.
---
 src/i18n/index.ts | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/src/i18n/index.ts b/src/i18n/index.ts
index 6ee62a9..0b49571 100644
--- a/src/i18n/index.ts
+++ b/src/i18n/index.ts
@@ -13,12 +13,9 @@ import { fa } from "./lang/fa";
 import { de } from "./lang/de";
 import { da } from "./lang/da";
 import { no } from "./lang/no";
-import LanguageDetector from 'i18next-browser-languagedetector';
 
-const supportedLanguages = ['en', 'zh', 'ja', 'fa', 'de', 'da', 'no', 'es', 'fr', 'it', 'ml', 'pt-BR', 'ru', 'zh-CN', 'ru-RU', 'ja-JP'];
 
 i18n
-    .use(LanguageDetector)
     .use(initReactI18next)
     .init({
         resources: {

From d5df8b5c5f60a0225f152d1d923fa767f64e04c8 Mon Sep 17 00:00:00 2001
From: n4ze3m <n4ze3m@gmail.com>
Date: Sat, 26 Oct 2024 21:10:28 +0530
Subject: [PATCH 6/8] feat: add pin/unpin functionality to chat history

Adds pin/unpin functionality to the chat history sidebar, allowing users to keep important conversations readily accessible. This improves user experience and helps organize past interactions.

This feature includes:
- Pin/unpin buttons in the chat history sidebar.
- Updated database schema to include `is_pinned` field for chat history items.
- Localized translations for pin/unpin actions.
- Updated UI to display pinned items at the top of the list.
---
 src/assets/locale/da/common.json          |  12 +-
 src/assets/locale/da/knowledge.json       |   3 -
 src/assets/locale/de/common.json          |  12 +-
 src/assets/locale/de/knowledge.json       |   3 -
 src/assets/locale/en/common.json          |  12 +-
 src/assets/locale/en/knowledge.json       |   3 -
 src/assets/locale/es/common.json          |  12 +-
 src/assets/locale/es/knowledge.json       |   3 -
 src/assets/locale/fa/common.json          |  12 +-
 src/assets/locale/fa/knowledge.json       |   3 -
 src/assets/locale/fr/common.json          |  12 +-
 src/assets/locale/fr/knowledge.json       |   3 -
 src/assets/locale/it/common.json          |  12 +-
 src/assets/locale/it/knowledge.json       |   3 -
 src/assets/locale/ja-JP/common.json       |  18 +-
 src/assets/locale/ja-JP/knowledge.json    |   3 -
 src/assets/locale/ml/common.json          |  12 +-
 src/assets/locale/ml/knowledge.json       |   3 -
 src/assets/locale/no/common.json          |  12 +-
 src/assets/locale/no/knowledge.json       |   3 -
 src/assets/locale/pt-BR/common.json       |  22 ++-
 src/assets/locale/pt-BR/knowledge.json    |   3 -
 src/assets/locale/ru/common.json          |  12 +-
 src/assets/locale/ru/knowledge.json       |   3 -
 src/assets/locale/zh/common.json          |  12 +-
 src/assets/locale/zh/knowledge.json       |   3 -
 src/components/Option/Knowledge/index.tsx |   2 +-
 src/components/Option/Sidebar.tsx         | 204 ++++++++++++++++------
 src/db/index.ts                           |  22 ++-
 29 files changed, 326 insertions(+), 113 deletions(-)

diff --git a/src/assets/locale/da/common.json b/src/assets/locale/da/common.json
index 0c48185..4d0de2d 100644
--- a/src/assets/locale/da/common.json
+++ b/src/assets/locale/da/common.json
@@ -41,6 +41,7 @@
     "webSearch": "Søger på internettet",
     "regenerate": "Regenerer",
     "edit": "Ændre",
+    "delete": "Slet",
     "saveAndSubmit": "Gem & Indsend",
     "editMessage": {
         "placeholder": "Skriv en besked..."
@@ -102,5 +103,14 @@
         "custom": "Brugerdefineret"
     },
     "citations": "Citater",
-    "downloadCode": "Download Kode"
+    "downloadCode": "Download Kode",
+    "date": {
+        "pinned": "Fastgjort",
+        "today": "I dag",
+        "yesterday": "I går",
+        "last7Days": "Sidste 7 dage",
+        "older": "Ældre"
+    },
+    "pin": "Fastgør",
+    "unpin": "Frigør"
 }
\ No newline at end of file
diff --git a/src/assets/locale/da/knowledge.json b/src/assets/locale/da/knowledge.json
index b1ae090..308c8cb 100644
--- a/src/assets/locale/da/knowledge.json
+++ b/src/assets/locale/da/knowledge.json
@@ -10,9 +10,6 @@
     "expandedColumns": {
         "name": "Navn"
     },
-    "tooltip": {
-        "delete": "Slet"
-    },
     "confirm": {
         "delete": "Er du sikker på du vil slette denne viden?"
     },
diff --git a/src/assets/locale/de/common.json b/src/assets/locale/de/common.json
index c70fa49..739e0dd 100644
--- a/src/assets/locale/de/common.json
+++ b/src/assets/locale/de/common.json
@@ -41,6 +41,7 @@
     "webSearch": "Web durchsuchen",
     "regenerate": "Neu generieren",
     "edit": "Bearbeiten",
+    "delete": "Löschen",
     "saveAndSubmit": "Speichern & Absenden",
     "editMessage": {
         "placeholder": "Nachricht eingeben..."
@@ -102,5 +103,14 @@
         "custom": "Benutzerdefiniert"
     },
     "citations": "Zitate",
-    "downloadCode": "Code herunterladen"
+    "downloadCode": "Code herunterladen",
+    "date": {
+        "pinned": "Angepinnt",
+        "today": "Heute",
+        "yesterday": "Gestern",
+        "last7Days": "Letzte 7 Tage",
+        "older": "Älter"
+    },
+    "pin": "Anheften",
+    "unpin": "Losheften"
 }
\ No newline at end of file
diff --git a/src/assets/locale/de/knowledge.json b/src/assets/locale/de/knowledge.json
index f572702..074f31b 100644
--- a/src/assets/locale/de/knowledge.json
+++ b/src/assets/locale/de/knowledge.json
@@ -10,9 +10,6 @@
     "expandedColumns": {
         "name": "Name"
     },
-    "tooltip": {
-        "delete": "Löschen"
-    },
     "confirm": {
         "delete": "Sind Sie sicher, dass Sie dieses Wissen löschen möchten?"
     },
diff --git a/src/assets/locale/en/common.json b/src/assets/locale/en/common.json
index 24adfdf..0cd96d7 100644
--- a/src/assets/locale/en/common.json
+++ b/src/assets/locale/en/common.json
@@ -41,6 +41,7 @@
     "webSearch": "Searching the web",
     "regenerate": "Regenerate",
     "edit": "Edit",
+    "delete": "Delete",
     "saveAndSubmit": "Save & Submit",
     "editMessage": {
         "placeholder": "Type a message..."
@@ -106,5 +107,14 @@
         "ollama": "Ollama Models",
         "custom": "Custom Models"
     },
-    "downloadCode": "Download Code"
+    "downloadCode": "Download Code",
+    "date": {
+        "pinned": "Pinned",
+        "today": "Today",
+        "yesterday": "Yesterday",
+        "last7Days": "Last 7 Days",
+        "older": "Older"
+    },
+    "pin": "Pin",
+    "unpin": "Unpin"
 }
\ No newline at end of file
diff --git a/src/assets/locale/en/knowledge.json b/src/assets/locale/en/knowledge.json
index a29cf89..925c614 100644
--- a/src/assets/locale/en/knowledge.json
+++ b/src/assets/locale/en/knowledge.json
@@ -10,9 +10,6 @@
     "expandedColumns": {
         "name": "Name"
     },
-    "tooltip": {
-        "delete": "Delete"
-    },
     "confirm": {
         "delete": "Are you sure you want to delete this knowledge?"
     },
diff --git a/src/assets/locale/es/common.json b/src/assets/locale/es/common.json
index b713319..65590aa 100644
--- a/src/assets/locale/es/common.json
+++ b/src/assets/locale/es/common.json
@@ -41,6 +41,7 @@
     "webSearch": "Buscando en la web",
     "regenerate": "Regenerar",
     "edit": "Editar",
+    "delete": "Borrar",
     "saveAndSubmit": "Guardar y Enviar",
     "editMessage": {
         "placeholder": "Ingresar un mensaje..."
@@ -101,5 +102,14 @@
         "translate": "Traducir"
     },
     "citations": "Citas",
-    "downloadCode": "Descargar Código"
+    "downloadCode": "Descargar Código",
+    "date": {
+        "pinned": "Fijado",
+        "today": "Hoy",
+        "yesterday": "Ayer",
+        "last7Days": "Últimos 7 días",
+        "older": "Más antiguo"
+    },
+    "pin": "Fijar",
+    "unpin": "Desfijar"
 }
\ No newline at end of file
diff --git a/src/assets/locale/es/knowledge.json b/src/assets/locale/es/knowledge.json
index 13eb6e5..891da12 100644
--- a/src/assets/locale/es/knowledge.json
+++ b/src/assets/locale/es/knowledge.json
@@ -10,9 +10,6 @@
     "expandedColumns": {
         "name": "Nombre"
     },
-    "tooltip": {
-        "delete": "Borrar"
-    },
     "confirm": {
         "delete": "¿Esta seguro que desea borrar este conocimiento?"
     },
diff --git a/src/assets/locale/fa/common.json b/src/assets/locale/fa/common.json
index 432934e..4adb307 100644
--- a/src/assets/locale/fa/common.json
+++ b/src/assets/locale/fa/common.json
@@ -41,6 +41,7 @@
     "webSearch": "جستجوی وب",
     "regenerate": "ایجاد مجدد",
     "edit": "ویرایش",
+    "delete": "حذف",
     "saveAndSubmit": "ذخیره و ارسال",
     "editMessage": {
         "placeholder": "یک پیام وارد کنید..."
@@ -95,5 +96,14 @@
         "advanced": "تنظیمات بیشتر مدل"
     },
     "citations": "منابع",
-    "downloadCode": "دانلود کد"
+    "downloadCode": "دانلود کد",
+    "date": {
+        "pinned": "پین شده",
+        "today": "امروز",
+        "yesterday": "دیروز",
+        "last7Days": "۷ روز گذشته",
+        "older": "قدیمی‌تر"
+    },
+    "pin": "پین کردن",
+    "unpin": "حذف پین"
 }
\ No newline at end of file
diff --git a/src/assets/locale/fa/knowledge.json b/src/assets/locale/fa/knowledge.json
index c955226..756bd07 100644
--- a/src/assets/locale/fa/knowledge.json
+++ b/src/assets/locale/fa/knowledge.json
@@ -10,9 +10,6 @@
     "expandedColumns": {
         "name": "نام"
     },
-    "tooltip": {
-        "delete": "حذف"
-    },
     "confirm": {
         "delete": "آیا مطمئن هستید که می خواهید این دانش را حذف کنید؟"
     },
diff --git a/src/assets/locale/fr/common.json b/src/assets/locale/fr/common.json
index 8c214b1..8dbe609 100644
--- a/src/assets/locale/fr/common.json
+++ b/src/assets/locale/fr/common.json
@@ -41,6 +41,7 @@
     "webSearch": "Recherche sur le Web",
     "regenerate": "Régénérer",
     "edit": "Modifier",
+    "delete": "Supprimer",
     "saveAndSubmit": "Enregistrer et soumettre",
     "editMessage": {
         "placeholder": "Tapez un message..."
@@ -101,5 +102,14 @@
         "translate": "Traduire"
     },
     "citations": "Citations",
-    "downloadCode": "Télécharger le code"
+    "downloadCode": "Télécharger le code",
+    "date": {
+        "pinned": "Épinglé",
+        "today": "Aujourd'hui",
+        "yesterday": "Hier",
+        "last7Days": "7 derniers jours",
+        "older": "Plus ancien"
+    },
+    "pin": "Épingler",
+    "unpin": "Désépingler"
 }
\ No newline at end of file
diff --git a/src/assets/locale/fr/knowledge.json b/src/assets/locale/fr/knowledge.json
index aa22b3f..c74ed07 100644
--- a/src/assets/locale/fr/knowledge.json
+++ b/src/assets/locale/fr/knowledge.json
@@ -10,9 +10,6 @@
     "expandedColumns": {
         "name": "Nom"
     },
-    "tooltip": {
-        "delete": "Supprimer"
-    },
     "confirm": {
         "delete": "Êtes-vous sûr de vouloir supprimer ces connaissances ?"
     },
diff --git a/src/assets/locale/it/common.json b/src/assets/locale/it/common.json
index 6aba664..80ede68 100644
--- a/src/assets/locale/it/common.json
+++ b/src/assets/locale/it/common.json
@@ -41,6 +41,7 @@
     "webSearch": "Ricerca nel Web",
     "regenerate": "Rigenera",
     "edit": "Modifica",
+    "delete": "Elimina",
     "saveAndSubmit": "Salva e Invia",
     "editMessage": {
         "placeholder": "Scrivi un messaggio..."
@@ -101,5 +102,14 @@
         "translate": "Tradurre"
     },
     "citations": "Citazioni",
-    "downloadCode": "Scarica Codice"
+    "downloadCode": "Scarica Codice",
+    "date": {
+        "pinned": "Fissato",
+        "today": "Oggi",
+        "yesterday": "Ieri",
+        "last7Days": "Ultimi 7 Giorni",
+        "older": "Più Vecchi"
+    },
+    "pin": "Fissa",
+    "unpin": "Rimuovi"
 }
\ No newline at end of file
diff --git a/src/assets/locale/it/knowledge.json b/src/assets/locale/it/knowledge.json
index 0f01462..d9caef3 100644
--- a/src/assets/locale/it/knowledge.json
+++ b/src/assets/locale/it/knowledge.json
@@ -10,9 +10,6 @@
     "expandedColumns": {
         "name": "Nome"
     },
-    "tooltip": {
-        "delete": "Elimina"
-    },
     "confirm": {
         "delete": "Sei sicuro di voler eliminare questa Knowledge Base?"
     },
diff --git a/src/assets/locale/ja-JP/common.json b/src/assets/locale/ja-JP/common.json
index 814ca9d..df20028 100644
--- a/src/assets/locale/ja-JP/common.json
+++ b/src/assets/locale/ja-JP/common.json
@@ -41,6 +41,7 @@
   "webSearch": "ウェブを検索中",
   "regenerate": "再生成",
   "edit": "編集",
+  "delete": "削除",
   "saveAndSubmit": "保存して送信",
   "editMessage": {
     "placeholder": "メッセージを入力..."
@@ -87,9 +88,9 @@
         "placeholder": "GPU(s)に送信するレイヤー数を入力してください"
       },
       "systemPrompt": {
-          "label": "一時的なシステムプロンプト",
-          "placeholder": "システムプロンプトを入力",
-          "help": "これは現在のチャットでシステムプロンプトを素早く設定する方法で、選択されたシステムプロンプトが存在する場合はそれを上書きします。"
+        "label": "一時的なシステムプロンプト",
+        "placeholder": "システムプロンプトを入力",
+        "help": "これは現在のチャットでシステムプロンプトを素早く設定する方法で、選択されたシステムプロンプトが存在する場合はそれを上書きします。"
       }
     },
     "advanced": "その他のモデル設定"
@@ -101,5 +102,14 @@
     "translate": "翻訳"
   },
   "citations": "引用",
-  "downloadCode": "コードをダウンロード"
+  "downloadCode": "コードをダウンロード",
+  "date": {
+    "pinned": "固定",
+    "today": "今日",
+    "yesterday": "昨日",
+    "last7Days": "過去7日間",
+    "older": "それ以前"
+  },
+  "pin": "固定",
+  "unpin": "固定解除"
 }
\ No newline at end of file
diff --git a/src/assets/locale/ja-JP/knowledge.json b/src/assets/locale/ja-JP/knowledge.json
index 866631c..bfba28c 100644
--- a/src/assets/locale/ja-JP/knowledge.json
+++ b/src/assets/locale/ja-JP/knowledge.json
@@ -10,9 +10,6 @@
     "expandedColumns": {
         "name": "名前"
     },
-    "tooltip": {
-        "delete": "削除"
-    },
     "confirm": {
         "delete": "この知識を削除してもよろしいですか?"
     },
diff --git a/src/assets/locale/ml/common.json b/src/assets/locale/ml/common.json
index 693d9fb..bb1149a 100644
--- a/src/assets/locale/ml/common.json
+++ b/src/assets/locale/ml/common.json
@@ -41,6 +41,7 @@
     "webSearch": "വെബ് തിരയുന്നു",
     "regenerate": "വീണ്ടും ജനറേറ്റ് ചെയ്യുക",
     "edit": "എഡിറ്റ് ചെയ്യുക",
+    "delete": "ഇല്ലാതാക്കുക",
     "saveAndSubmit": "സേവ് ചെയ്ത് സമര്‍പ്പിക്കുക",
     "editMessage": {
         "placeholder": "ഒരു സന്ദേശം ടൈപ്പ് ചെയ്യുക..."
@@ -100,5 +101,14 @@
         "translate": "വിവർത്തനം ചെയ്യുക"
     },
     "citations": "ഉദ്ധരണികൾ",
-    "downloadCode": "കോഡ് ഡൗൺലോഡ് ചെയ്യുക"
+    "downloadCode": "കോഡ് ഡൗൺലോഡ് ചെയ്യുക",
+    "date": {
+        "pinned": "പിൻ ചെയ്തത്",
+        "today": "ഇന്ന്",
+        "yesterday": "ഇന്നലെ",
+        "last7Days": "കഴിഞ്ഞ 7 ദിവസം",
+        "older": "പഴയത്"
+    },
+    "pin": "പിൻ ചെയ്യുക",
+    "unpin": "അൺപിൻ ചെയ്യുക"
 }
\ No newline at end of file
diff --git a/src/assets/locale/ml/knowledge.json b/src/assets/locale/ml/knowledge.json
index 41d8267..6823f48 100644
--- a/src/assets/locale/ml/knowledge.json
+++ b/src/assets/locale/ml/knowledge.json
@@ -10,9 +10,6 @@
     "expandedColumns": {
         "name": "നാമം"
     },
-    "tooltip": {
-        "delete": "ഇല്ലാതാക്കുക"
-    },
     "confirm": {
         "delete": "നിങ്ങൾക്ക് ഈ വിജ്ഞാനം ഇല്ലാതാക്കണമെന്ന് ഉറപ്പാണോ?"
     },
diff --git a/src/assets/locale/no/common.json b/src/assets/locale/no/common.json
index 665cae5..6665280 100644
--- a/src/assets/locale/no/common.json
+++ b/src/assets/locale/no/common.json
@@ -41,6 +41,7 @@
     "webSearch": "Søker på internett",
     "regenerate": "Regenerer",
     "edit": "Endre",
+    "delete": "Slett",
     "saveAndSubmit": "Lagre & Send inn",
     "editMessage": {
         "placeholder": "Skriv en melding..."
@@ -102,5 +103,14 @@
         "custom": "Egendefinert"
     },
     "citations": "Sitater",
-    "downloadCode": "Last ned kode"
+    "downloadCode": "Last ned kode",
+    "date": {
+        "pinned": "Festet",
+        "today": "I dag",
+        "yesterday": "I går",
+        "last7Days": "Siste 7 dager",
+        "older": "Eldre"
+    },
+    "pin": "Fest",
+    "unpin": "Løsne"
 }
\ No newline at end of file
diff --git a/src/assets/locale/no/knowledge.json b/src/assets/locale/no/knowledge.json
index c5f7311..3e963df 100644
--- a/src/assets/locale/no/knowledge.json
+++ b/src/assets/locale/no/knowledge.json
@@ -10,9 +10,6 @@
     "expandedColumns": {
         "name": "Navn"
     },
-    "tooltip": {
-        "delete": "Slett"
-    },
     "confirm": {
         "delete": "Er du sikker på at du vil slette denne kunnskapen?"
     },
diff --git a/src/assets/locale/pt-BR/common.json b/src/assets/locale/pt-BR/common.json
index dbf6af6..ba4f252 100644
--- a/src/assets/locale/pt-BR/common.json
+++ b/src/assets/locale/pt-BR/common.json
@@ -41,6 +41,7 @@
   "webSearch": "Pesquisando na web",
   "regenerate": "Gerar Novamente",
   "edit": "Editar",
+  "delete": "Excluir",
   "saveAndSubmit": "Salvar & Enviar",
   "editMessage": {
     "placeholder": "Digite uma mensagem..."
@@ -83,13 +84,13 @@
         "placeholder": "Digite o valor do Top P (ex: 0.9, 0.95)"
       },
       "numGpu": {
-          "label": "Num GPUs",
-          "placeholder": "Digite o número de camadas para enviar para a(s) GPU(s)"
+        "label": "Num GPUs",
+        "placeholder": "Digite o número de camadas para enviar para a(s) GPU(s)"
       },
       "systemPrompt": {
-          "label": "Prompt do Sistema Temporário",
-          "placeholder": "Digite o Prompt do Sistema",
-          "help": "Esta é uma maneira rápida de definir o prompt do sistema no chat atual, que substituirá o prompt do sistema selecionado, se existir."
+        "label": "Prompt do Sistema Temporário",
+        "placeholder": "Digite o Prompt do Sistema",
+        "help": "Esta é uma maneira rápida de definir o prompt do sistema no chat atual, que substituirá o prompt do sistema selecionado, se existir."
       }
     },
     "advanced": "Mais Configurações do Modelo"
@@ -101,5 +102,14 @@
     "translate": "Traduzir"
   },
   "citations": "Citações",
-  "downloadCode": "Baixar Código"
+  "downloadCode": "Baixar Código",
+  "date": {
+    "pinned": "Fixado",
+    "today": "Hoje",
+    "yesterday": "Ontem",
+    "last7Days": "Últimos 7 Dias",
+    "older": "Mais Antigos"
+  },
+  "pin": "Fixar",
+  "unpin": "Desafixar"
 }
\ No newline at end of file
diff --git a/src/assets/locale/pt-BR/knowledge.json b/src/assets/locale/pt-BR/knowledge.json
index 7d2ebcd..c06a85c 100644
--- a/src/assets/locale/pt-BR/knowledge.json
+++ b/src/assets/locale/pt-BR/knowledge.json
@@ -10,9 +10,6 @@
     "expandedColumns": {
         "name": "Nome"
     },
-    "tooltip": {
-        "delete": "Excluir"
-    },
     "confirm": {
         "delete": "Tem certeza de que deseja excluir este conhecimento?"
     },
diff --git a/src/assets/locale/ru/common.json b/src/assets/locale/ru/common.json
index 5b4fedd..b619def 100644
--- a/src/assets/locale/ru/common.json
+++ b/src/assets/locale/ru/common.json
@@ -41,6 +41,7 @@
     "webSearch": "Поиск в интернете",
     "regenerate": "Пересоздать",
     "edit": "Редактировать",
+    "delete": "Удалить",
     "saveAndSubmit": "Сохранить и отправить",
     "editMessage": {
         "placeholder": "Введите сообщение..."
@@ -101,5 +102,14 @@
         "translate": "Перевести"
     },
     "citations": "Цитаты",
-    "downloadCode": "Скачать код"
+    "downloadCode": "Скачать код",
+    "date": {
+        "pinned": "Закреплено",
+        "today": "Сегодня",
+        "yesterday": "Вчера",
+        "last7Days": "Последние 7 дней",
+        "older": "Ранее"
+    },
+    "pin": "Закрепить",
+    "unpin": "Открепить"
 }
\ No newline at end of file
diff --git a/src/assets/locale/ru/knowledge.json b/src/assets/locale/ru/knowledge.json
index e0689c0..4cefca0 100644
--- a/src/assets/locale/ru/knowledge.json
+++ b/src/assets/locale/ru/knowledge.json
@@ -10,9 +10,6 @@
     "expandedColumns": {
         "name": "Имя"
     },
-    "tooltip": {
-        "delete": "Удалить"
-    },
     "confirm": {
         "delete": "Вы уверены, что хотите удалить это знание?"
     },
diff --git a/src/assets/locale/zh/common.json b/src/assets/locale/zh/common.json
index 9019aa5..cd58e05 100644
--- a/src/assets/locale/zh/common.json
+++ b/src/assets/locale/zh/common.json
@@ -41,6 +41,7 @@
     "webSearch": "搜索网络",
     "regenerate": "重新生成",
     "edit": "编辑",
+    "delete": "删除",
     "saveAndSubmit": "保存 & 提交",
     "editMessage": {
         "placeholder": "输入一条消息..."
@@ -101,5 +102,14 @@
         "translate": "翻译"
     },
     "citations": "引用",
-    "downloadCode": "下载代码"
+    "downloadCode": "下载代码",
+    "date": {
+        "pinned": "已置顶",
+        "today": "今天",
+        "yesterday": "昨天",
+        "last7Days": "最近7天",
+        "older": "更早"
+    },
+    "pin": "置顶",
+    "unpin": "取消置顶"
 }
\ No newline at end of file
diff --git a/src/assets/locale/zh/knowledge.json b/src/assets/locale/zh/knowledge.json
index fcbfdee..d981192 100644
--- a/src/assets/locale/zh/knowledge.json
+++ b/src/assets/locale/zh/knowledge.json
@@ -10,9 +10,6 @@
     "expandedColumns": {
         "name": "名称"
     },
-    "tooltip": {
-        "delete": "删除"
-    },
     "confirm": {
         "delete": "您确定要删除此知识吗?"
     },
diff --git a/src/components/Option/Knowledge/index.tsx b/src/components/Option/Knowledge/index.tsx
index 7380832..7cca2a5 100644
--- a/src/components/Option/Knowledge/index.tsx
+++ b/src/components/Option/Knowledge/index.tsx
@@ -93,7 +93,7 @@ export const KnowledgeSettings = () => {
                 key: "action",
                 render: (text: string, record: any) => (
                   <div className="flex gap-4">
-                    <Tooltip title={t("tooltip.delete")}>
+                    <Tooltip title={t("common:delete")}>
                       <button
                         disabled={isDeleting}
                         onClick={() => {
diff --git a/src/components/Option/Sidebar.tsx b/src/components/Option/Sidebar.tsx
index 9535360..24c35f9 100644
--- a/src/components/Option/Sidebar.tsx
+++ b/src/components/Option/Sidebar.tsx
@@ -4,11 +4,18 @@ import {
   formatToChatHistory,
   formatToMessage,
   deleteByHistoryId,
-  updateHistory
+  updateHistory,
+  pinHistory
 } from "@/db"
-import { Empty, Skeleton } from "antd"
+import { Empty, Skeleton, Dropdown, Menu } from "antd"
 import { useMessageOption } from "~/hooks/useMessageOption"
-import { PencilIcon, Trash2 } from "lucide-react"
+import {
+  PencilIcon,
+  Trash2,
+  MoreVertical,
+  PinIcon,
+  PinOffIcon
+} from "lucide-react"
 import { useNavigate } from "react-router-dom"
 import { useTranslation } from "react-i18next"
 import {
@@ -38,7 +45,46 @@ export const Sidebar = ({ onClose }: Props) => {
     queryFn: async () => {
       const db = new PageAssitDatabase()
       const history = await db.getChatHistories()
-      return history
+
+      const now = new Date()
+      const today = new Date(now.setHours(0, 0, 0, 0))
+      const yesterday = new Date(today)
+      yesterday.setDate(yesterday.getDate() - 1)
+      const lastWeek = new Date(today)
+      lastWeek.setDate(lastWeek.getDate() - 7)
+
+      const pinnedItems = history.filter((item) => item.is_pinned)
+      const todayItems = history.filter(
+        (item) => !item.is_pinned && new Date(item?.createdAt) >= today
+      )
+      const yesterdayItems = history.filter(
+        (item) =>
+          !item.is_pinned &&
+          new Date(item?.createdAt) >= yesterday &&
+          new Date(item?.createdAt) < today
+      )
+      const lastWeekItems = history.filter(
+        (item) =>
+          !item.is_pinned &&
+          new Date(item?.createdAt) >= lastWeek &&
+          new Date(item?.createdAt) < yesterday
+      )
+      const olderItems = history.filter(
+        (item) => !item.is_pinned && new Date(item?.createdAt) < lastWeek
+      )
+
+      const groups = []
+
+      if (pinnedItems.length)
+        groups.push({ label: "pinned", items: pinnedItems })
+      if (todayItems.length) groups.push({ label: "today", items: todayItems })
+      if (yesterdayItems.length)
+        groups.push({ label: "yesterday", items: yesterdayItems })
+      if (lastWeekItems.length)
+        groups.push({ label: "last7days", items: lastWeekItems })
+      if (olderItems.length) groups.push({ label: "older", items: olderItems })
+
+      return groups
     }
   })
 
@@ -67,6 +113,18 @@ export const Sidebar = ({ onClose }: Props) => {
     }
   })
 
+  const { mutate: pinChatHistory, isPending: pinLoading } = useMutation({
+    mutationKey: ["pinHistory"],
+    mutationFn: async (data: { id: string; is_pinned: boolean }) => {
+      return await pinHistory(data.id, data.is_pinned)
+    },
+    onSuccess: () => {
+      client.invalidateQueries({
+        queryKey: ["fetchChatHistory"]
+      })
+    }
+  })
+
   return (
     <div className="overflow-y-auto z-99">
       {status === "success" && chatHistories.length === 0 && (
@@ -86,51 +144,99 @@ export const Sidebar = ({ onClose }: Props) => {
       )}
       {status === "success" && chatHistories.length > 0 && (
         <div className="flex flex-col gap-2">
-          {chatHistories.map((chat, index) => (
-            <div
-              key={index}
-              className="flex py-2 px-2 items-start gap-3 relative rounded-md truncate hover:pr-4 group transition-opacity duration-300 ease-in-out   bg-gray-100 dark:bg-[#232222] dark:text-gray-100 text-gray-800 border hover:bg-gray-200 dark:hover:bg-[#2d2d2d] dark:border-gray-800">
-              <button
-                className="flex-1 overflow-hidden break-all text-start truncate w-full"
-                onClick={async () => {
-                  const db = new PageAssitDatabase()
-                  const history = await db.getChatHistory(chat.id)
-                  setHistoryId(chat.id)
-                  setHistory(formatToChatHistory(history))
-                  setMessages(formatToMessage(history))
-                  const isLastUsedChatModel = await lastUsedChatModelEnabled()
-                  if (isLastUsedChatModel) {
-                    const currentChatModel = await getLastUsedChatModel(chat.id)
-                    if (currentChatModel) {
-                      setSelectedModel(currentChatModel)
-                    }
-                  }
-                  navigate("/")
-                  onClose()
-                }}>
-                <span className="flex-grow truncate">{chat.title}</span>
-              </button>
-              <div className="flex flex-row gap-3">
-                <button
-                  onClick={() => {
-                    const newTitle = prompt(t("editHistoryTitle"), chat.title)
-
-                    if (newTitle) {
-                      editHistory({ id: chat.id, title: newTitle })
-                    }
-                  }}
-                  className="text-gray-500 dark:text-gray-400 opacity-80">
-                  <PencilIcon className="w-4 h-4" />
-                </button>
-
-                <button
-                  onClick={() => {
-                    if (!confirm(t("deleteHistoryConfirmation"))) return
-                    deleteHistory(chat.id)
-                  }}
-                  className="text-red-500 dark:text-red-400 opacity-80">
-                  <Trash2 className=" w-4 h-4 " />
-                </button>
+          {chatHistories.map((group, groupIndex) => (
+            <div key={groupIndex}>
+              <h3 className="px-2 text-sm font-medium text-gray-500">
+                {t(`common:date:${group.label}`)}
+              </h3>
+              <div className="flex flex-col gap-2 mt-2">
+                {group.items.map((chat, index) => (
+                  <div
+                    key={index}
+                    className="flex py-2 px-2 items-start gap-3 relative rounded-md truncate hover:pr-4 group transition-opacity duration-300 ease-in-out bg-gray-100 dark:bg-[#232222] dark:text-gray-100 text-gray-800 border hover:bg-gray-200 dark:hover:bg-[#2d2d2d] dark:border-gray-800">
+                    <button
+                      className="flex-1 overflow-hidden break-all text-start truncate w-full"
+                      onClick={async () => {
+                        const db = new PageAssitDatabase()
+                        const history = await db.getChatHistory(chat.id)
+                        setHistoryId(chat.id)
+                        setHistory(formatToChatHistory(history))
+                        setMessages(formatToMessage(history))
+                        const isLastUsedChatModel =
+                          await lastUsedChatModelEnabled()
+                        if (isLastUsedChatModel) {
+                          const currentChatModel = await getLastUsedChatModel(
+                            chat.id
+                          )
+                          if (currentChatModel) {
+                            setSelectedModel(currentChatModel)
+                          }
+                        }
+                        navigate("/")
+                        onClose()
+                      }}>
+                      <span className="flex-grow truncate">{chat.title}</span>
+                    </button>
+                    <div className="flex items-center gap-2">
+                      <Dropdown
+                        overlay={
+                          <Menu>
+                            <Menu.Item
+                              key="pin"
+                              icon={
+                                chat.is_pinned ? (
+                                  <PinOffIcon className="w-4 h-4" />
+                                ) : (
+                                  <PinIcon className="w-4 h-4" />
+                                )
+                              }
+                              onClick={() =>
+                                pinChatHistory({
+                                  id: chat.id,
+                                  is_pinned: !chat.is_pinned
+                                })
+                              }
+                              disabled={pinLoading}>
+                              {chat.is_pinned
+                                ? t("common:unpin")
+                                : t("common:pin")}
+                            </Menu.Item>
+                            <Menu.Item
+                              key="edit"
+                              icon={<PencilIcon className="w-4 h-4" />}
+                              onClick={() => {
+                                const newTitle = prompt(
+                                  t("editHistoryTitle"),
+                                  chat.title
+                                )
+                                if (newTitle) {
+                                  editHistory({ id: chat.id, title: newTitle })
+                                }
+                              }}>
+                              {t("common:edit")}
+                            </Menu.Item>
+                            <Menu.Item
+                              key="delete"
+                              icon={<Trash2 className="w-4 h-4" />}
+                              danger
+                              onClick={() => {
+                                if (!confirm(t("deleteHistoryConfirmation")))
+                                  return
+                                deleteHistory(chat.id)
+                              }}>
+                              {t("common:delete")}
+                            </Menu.Item>
+                          </Menu>
+                        }
+                        trigger={["click"]}
+                        placement="bottomRight">
+                        <button className="text-gray-500 dark:text-gray-400 opacity-80 hover:opacity-100">
+                          <MoreVertical className="w-4 h-4" />
+                        </button>
+                      </Dropdown>
+                    </div>
+                  </div>
+                ))}
               </div>
             </div>
           ))}
diff --git a/src/db/index.ts b/src/db/index.ts
index 2a8a2e2..4a77553 100644
--- a/src/db/index.ts
+++ b/src/db/index.ts
@@ -8,6 +8,7 @@ type HistoryInfo = {
   title: string
   is_rag: boolean
   message_source?: "copilot" | "web-ui"
+  is_pinned?: boolean
   createdAt: number
 }
 
@@ -232,7 +233,11 @@ export const generateID = () => {
   })
 }
 
-export const saveHistory = async (title: string, is_rag?: boolean, message_source?: "copilot" | "web-ui") => {
+export const saveHistory = async (
+  title: string,
+  is_rag?: boolean,
+  message_source?: "copilot" | "web-ui"
+) => {
   const id = generateID()
   const createdAt = Date.now()
   const history = { id, title, createdAt, is_rag, message_source }
@@ -317,6 +322,18 @@ export const updateHistory = async (id: string, title: string) => {
   db.db.set({ chatHistories: newChatHistories })
 }
 
+export const pinHistory = async (id: string, is_pinned: boolean) => {
+  const db = new PageAssitDatabase()
+  const chatHistories = await db.getChatHistories()
+  const newChatHistories = chatHistories.map((history) => {
+    if (history.id === id) {
+      history.is_pinned = is_pinned
+    }
+    return history
+  })
+  db.db.set({ chatHistories: newChatHistories })
+}
+
 export const removeMessageUsingHistoryId = async (history_id: string) => {
   const db = new PageAssitDatabase()
   const chatHistory = await db.getChatHistory(history_id)
@@ -490,9 +507,8 @@ export const getRecentChatFromCopilot = async () => {
   return { history, messages }
 }
 
-
 export const getTitleById = async (id: string) => {
   const db = new PageAssitDatabase()
   const title = await db.getChatHistoryTitleById(id)
   return title
-}
\ No newline at end of file
+}

From eb643b7c8cb8728d40f6d24ce7fdda50d5ddcf67 Mon Sep 17 00:00:00 2001
From: n4ze3m <n4ze3m@gmail.com>
Date: Sat, 26 Oct 2024 23:41:00 +0530
Subject: [PATCH 7/8] Fix: Update placeholder text for model input

The placeholder text for the model input was previously incorrect. This commit updates the placeholder to reflect the expected format for model names.
---
 src/components/Option/Models/AddOllamaModelModal.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/components/Option/Models/AddOllamaModelModal.tsx b/src/components/Option/Models/AddOllamaModelModal.tsx
index 7ca2972..255bc9c 100644
--- a/src/components/Option/Models/AddOllamaModelModal.tsx
+++ b/src/components/Option/Models/AddOllamaModelModal.tsx
@@ -20,6 +20,7 @@ export const AddOllamaModelModal: React.FC<Props> = ({ open, setOpen }) => {
   })
 
   const pullModel = async (modelName: string) => {
+    modelName.replaceAll("ollama pull", "").replaceAll("ollama run", "").trim()
     notification.info({
       message: t("manageModels.notification.pullModel"),
       description: t("manageModels.notification.pullModelDescription", {
@@ -52,7 +53,7 @@ export const AddOllamaModelModal: React.FC<Props> = ({ open, setOpen }) => {
         <Input
           {...form.getInputProps("model")}
           required
-          placeholder={t("manageModels.modal.placeholder")}
+          placeholder={"qwen2.5:3b"}
           size="large"
         />
 

From be3f627a0f871c167dbcf829880d06ea0dc6faf5 Mon Sep 17 00:00:00 2001
From: n4ze3m <n4ze3m@gmail.com>
Date: Sat, 26 Oct 2024 23:41:29 +0530
Subject: [PATCH 8/8] feat: Add model download button to Hugging Face website

Adds a button to the Hugging Face website allowing users to download models directly from the Page Assist extension. The button appears next to the copy snippet button on model pages. This allows users to easily pull models directly to their local machine for use with Ollama.

The button triggers a confirmation dialog, ensuring users understand the action before proceeding. The process leverages a background script to handle the actual download and displays a message during the download process.
---
 src/entries/hf-pull.content.ts | 93 ++++++++++++++++++++++++++++++++++
 1 file changed, 93 insertions(+)
 create mode 100644 src/entries/hf-pull.content.ts

diff --git a/src/entries/hf-pull.content.ts b/src/entries/hf-pull.content.ts
new file mode 100644
index 0000000..9406683
--- /dev/null
+++ b/src/entries/hf-pull.content.ts
@@ -0,0 +1,93 @@
+export default defineContentScript({
+  main(ctx) {
+    const downloadModel = async (modelName: string) => {
+      const ok = confirm(
+        `[Page Assist Extension] Do you want to pull the ${modelName} model? This has nothing to do with the huggingface.co website. The model will be pulled locally once you confirm. Make sure Ollama is running.`
+      )
+      if (ok) {
+        alert(
+          `[Page Assist Extension] Pulling ${modelName} model. For more details, check the extension icon.`
+        )
+
+        await browser.runtime.sendMessage({
+          type: "pull_model",
+          modelName
+        })
+        return true
+      }
+      return false
+    }
+
+    const downloadSVG = `
+        <svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 24 24" width="16" height="16">
+          <path d="M12 16l-6-6h4V4h4v6h4l-6 6z"/>
+          <path d="M4 20h16v-2H4v2z"/>
+        </svg>
+      `
+
+    const injectDownloadButton = (modal: HTMLElement) => {
+      const copyButton = modal.querySelector(
+        'button[title="Copy snippet to clipboard"]'
+      )
+      if (copyButton && !modal.querySelector(".pageassist-download-button")) {
+        const downloadButton = copyButton.cloneNode(true) as HTMLElement
+        downloadButton.classList.add("pageassist-download-button")
+        downloadButton.querySelector("svg")!.outerHTML = downloadSVG
+        downloadButton.querySelector("span")!.textContent =
+          "Pull from Page Assist"
+        downloadButton.addEventListener("click", async () => {
+          const preElement = modal.querySelector("pre")
+          if (preElement) {
+            let modelCommand = ""
+            preElement.childNodes.forEach((node) => {
+              if (node.nodeType === Node.TEXT_NODE) {
+                modelCommand += node.textContent
+              } else if (node instanceof HTMLSelectElement) {
+                modelCommand += node.value
+              } else if (node instanceof HTMLElement) {
+                const selectElement = node.querySelector(
+                  "select"
+                ) as HTMLSelectElement
+                if (selectElement) {
+                  modelCommand += selectElement.value
+                } else {
+                  modelCommand += node.textContent
+                }
+              }
+            })
+
+            modelCommand = modelCommand.trim()
+
+            await downloadModel(
+              modelCommand
+                ?.replaceAll("ollama run", "")
+                ?.replaceAll("ollama pull", "")
+                ?.trim()
+            )
+          }
+        })
+        copyButton.parentElement!.insertBefore(
+          downloadButton,
+          copyButton.nextSibling
+        )
+      }
+    }
+
+    const observer = new MutationObserver((mutations) => {
+      for (const mutation of mutations) {
+        mutation.addedNodes.forEach((node) => {
+          if (node instanceof HTMLElement) {
+            const modal = node.querySelector(".shadow-alternate") as HTMLElement
+            if (modal) {
+              injectDownloadButton(modal)
+            }
+          }
+        })
+      }
+    })
+
+    observer.observe(document.body, { childList: true, subtree: true })
+  },
+  allFrames: true,
+  matches: ["*://huggingface.co/*"]
+})