(null)
- React.useEffect(() => {
- if (divRef.current) {
- divRef.current.scrollIntoView({ behavior: "smooth" })
- }
- })
+
+ const { containerRef, isAtBottom, scrollToBottom } = useSmartScroll(
+ messages,
+ streaming
+ )
+
return (
<>
- {" "}
-
+
{messages.length === 0 && (
)}
- {/* {messages.length > 0 &&
} */}
{messages.map((message, index) => (
{
/>
))}
{messages.length > 0 && (
-
+
)}
-
+ {!isAtBottom && (
+
+
+
+ )}
{
false
)
+ const [restoreLastChatModel, setRestoreLastChatModel] = useStorage(
+ "restoreLastChatModel",
+ false
+ )
+
const [hideCurrentChatModelSettings, setHideCurrentChatModelSettings] =
useStorage("hideCurrentChatModelSettings", false)
+ const [sendNotificationAfterIndexing, setSendNotificationAfterIndexing] =
+ useStorage("sendNotificationAfterIndexing", false)
+
const queryClient = useQueryClient()
const { mode, toggleDarkMode } = useDarkMode()
@@ -107,6 +115,32 @@ export const GeneralSettings = () => {
onChange={(checked) => setHideCurrentChatModelSettings(checked)}
/>
+
+
+ {t("generalSettings.settings.restoreLastChatModel.label")}
+
+
+
+
setRestoreLastChatModel(checked)}
+ />
+
+
+
+ {t("generalSettings.settings.sendNotificationAfterIndexing.label")}
+
+
+
+
+
{t("generalSettings.settings.darkMode.label")}
diff --git a/src/components/Option/Sidebar.tsx b/src/components/Option/Sidebar.tsx
index e18f567..9535360 100644
--- a/src/components/Option/Sidebar.tsx
+++ b/src/components/Option/Sidebar.tsx
@@ -11,14 +11,24 @@ import { useMessageOption } from "~/hooks/useMessageOption"
import { PencilIcon, Trash2 } from "lucide-react"
import { useNavigate } from "react-router-dom"
import { useTranslation } from "react-i18next"
+import {
+ getLastUsedChatModel,
+ lastUsedChatModelEnabled
+} from "@/services/model-settings"
type Props = {
onClose: () => void
}
export const Sidebar = ({ onClose }: Props) => {
- const { setMessages, setHistory, setHistoryId, historyId, clearChat } =
- useMessageOption()
+ const {
+ setMessages,
+ setHistory,
+ setHistoryId,
+ historyId,
+ clearChat,
+ setSelectedModel
+ } = useMessageOption()
const { t } = useTranslation(["option", "common"])
const client = useQueryClient()
const navigate = useNavigate()
@@ -88,6 +98,13 @@ export const Sidebar = ({ onClose }: Props) => {
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()
}}>
diff --git a/src/entries/background.ts b/src/entries/background.ts
index 91c71a7..b238b9a 100644
--- a/src/entries/background.ts
+++ b/src/entries/background.ts
@@ -1,6 +1,7 @@
import { getOllamaURL, isOllamaRunning } from "../services/ollama"
import { browser } from "wxt/browser"
import { setBadgeBackgroundColor, setBadgeText, setTitle } from "@/utils/action"
+
const progressHuman = (completed: number, total: number) => {
return ((completed / total) * 100).toFixed(0) + "%"
}
@@ -75,11 +76,12 @@ const streamDownload = async (url: string, model: string) => {
clearBadge()
}, 5000)
}
+
export default defineBackground({
main() {
browser.runtime.onMessage.addListener(async (message) => {
if (message.type === "sidepanel") {
- browser.sidebarAction.open()
+ await browser.sidebarAction.open()
} else if (message.type === "pull_model") {
const ollamaURL = await getOllamaURL()
@@ -100,7 +102,7 @@ export default defineBackground({
if (import.meta.env.BROWSER === "chrome") {
chrome.action.onClicked.addListener((tab) => {
- browser.tabs.create({ url: browser.runtime.getURL("/options.html") })
+ chrome.tabs.create({ url: chrome.runtime.getURL("/options.html") })
})
} else {
browser.browserAction.onClicked.addListener((tab) => {
@@ -109,23 +111,31 @@ export default defineBackground({
})
}
+ const contextMenuTitle = {
+ webUi: browser.i18n.getMessage("openOptionToChat"),
+ sidePanel: browser.i18n.getMessage("openSidePanelToChat")
+ }
+
+ const contextMenuId = {
+ webUi: "open-web-ui-pa",
+ sidePanel: "open-side-panel-pa"
+ }
+
browser.contextMenus.create({
- id: "open-side-panel-pa",
- title: browser.i18n.getMessage("openSidePanelToChat"),
+ id: contextMenuId["sidePanel"],
+ title: contextMenuTitle["sidePanel"],
contexts: ["all"]
})
if (import.meta.env.BROWSER === "chrome") {
browser.contextMenus.onClicked.addListener((info, tab) => {
if (info.menuItemId === "open-side-panel-pa") {
- chrome.tabs.query(
- { active: true, currentWindow: true },
- async (tabs) => {
- const tab = tabs[0]
- chrome.sidePanel.open({
- tabId: tab.id!
- })
- }
- )
+ chrome.sidePanel.open({
+ tabId: tab.id!
+ })
+ } else if (info.menuItemId === "open-web-ui-pa") {
+ browser.tabs.create({
+ url: browser.runtime.getURL("/options.html")
+ })
}
})
@@ -152,6 +162,10 @@ export default defineBackground({
browser.contextMenus.onClicked.addListener((info, tab) => {
if (info.menuItemId === "open-side-panel-pa") {
browser.sidebarAction.toggle()
+ } else if (info.menuItemId === "open-web-ui-pa") {
+ browser.tabs.create({
+ url: browser.runtime.getURL("/options.html")
+ })
}
})
diff --git a/src/hooks/chat-helper/index.ts b/src/hooks/chat-helper/index.ts
index 73f8494..f7b690f 100644
--- a/src/hooks/chat-helper/index.ts
+++ b/src/hooks/chat-helper/index.ts
@@ -1,4 +1,5 @@
import { saveHistory, saveMessage } from "@/db"
+import { setLastUsedChatModel } from "@/services/model-settings"
import { ChatHistory } from "@/store/option"
export const saveMessageOnError = async ({
@@ -23,7 +24,7 @@ export const saveMessageOnError = async ({
historyId: string | null
selectedModel: string
setHistoryId: (historyId: string) => void
- isRegenerating: boolean,
+ isRegenerating: boolean
message_source?: "copilot" | "web-ui"
}) => {
if (
@@ -66,6 +67,7 @@ export const saveMessageOnError = async ({
[],
2
)
+ await setLastUsedChatModel(historyId, selectedModel)
} else {
const newHistoryId = await saveHistory(userMessage, false, message_source)
if (!isRegenerating) {
@@ -89,6 +91,7 @@ export const saveMessageOnError = async ({
2
)
setHistoryId(newHistoryId.id)
+ await setLastUsedChatModel(newHistoryId.id, selectedModel)
}
return true
@@ -115,7 +118,7 @@ export const saveMessageOnSuccess = async ({
message: string
image: string
fullText: string
- source: any[],
+ source: any[]
message_source?: "copilot" | "web-ui"
}) => {
if (historyId) {
@@ -139,6 +142,7 @@ export const saveMessageOnSuccess = async ({
source,
2
)
+ await setLastUsedChatModel(historyId, selectedModel!)
} else {
const newHistoryId = await saveHistory(message, false, message_source)
await saveMessage(
@@ -160,5 +164,6 @@ export const saveMessageOnSuccess = async ({
2
)
setHistoryId(newHistoryId.id)
+ await setLastUsedChatModel(newHistoryId.id, selectedModel!)
}
}
diff --git a/src/hooks/useScrollAnchor.tsx b/src/hooks/useScrollAnchor.tsx
deleted file mode 100644
index c2d72a2..0000000
--- a/src/hooks/useScrollAnchor.tsx
+++ /dev/null
@@ -1,106 +0,0 @@
-import { useCallback, useEffect, useRef, useState } from "react"
-import { useMessageOption } from "./useMessageOption"
-
-export const useScrollAnchor = () => {
- const { isProcessing, messages } = useMessageOption()
-
- const [isAtTop, setIsAtTop] = useState(false)
- const [isAtBottom, setIsAtBottom] = useState(true)
- const [userScrolled, setUserScrolled] = useState(false)
- const [isOverflowing, setIsOverflowing] = useState(false)
-
- const messagesStartRef = useRef(null)
- const messagesEndRef = useRef(null)
- const containerRef = useRef(null)
- const isAutoScrolling = useRef(false)
-
- console.log(`isAtTop: ${isAtTop}, isAtBottom: ${isAtBottom}, userScrolled: ${userScrolled}, isOverflowing: ${isOverflowing}`)
-
- useEffect(() => {
- if (!isProcessing && userScrolled) {
- console.log("userScrolled")
- setUserScrolled(false)
- }
- }, [isProcessing])
-
- useEffect(() => {
- if (isProcessing && !userScrolled) {
- scrollToBottom()
- }
- }, [messages])
-
- useEffect(() => {
- const container = containerRef.current
- if (!container) return
-
- const topObserver = new IntersectionObserver(
- ([entry]) => {
- setIsAtTop(entry.isIntersecting)
- },
- { threshold: 1 }
- )
-
- const bottomObserver = new IntersectionObserver(
- ([entry]) => {
- setIsAtBottom(entry.isIntersecting)
- if (entry.isIntersecting) {
- setUserScrolled(false)
- } else if (!isAutoScrolling.current) {
- setUserScrolled(true)
- }
- },
- { threshold: 1 }
- )
-
- if (messagesStartRef.current) {
- topObserver.observe(messagesStartRef.current)
- }
-
- if (messagesEndRef.current) {
- bottomObserver.observe(messagesEndRef.current)
- }
-
- const resizeObserver = new ResizeObserver(() => {
- setIsOverflowing(container.scrollHeight > container.clientHeight)
- })
-
- resizeObserver.observe(container)
-
- return () => {
- topObserver.disconnect()
- bottomObserver.disconnect()
- resizeObserver.disconnect()
- }
- }, [])
-
- const scrollToTop = useCallback(() => {
- if (messagesStartRef.current) {
- messagesStartRef.current.scrollIntoView({ behavior: "smooth" })
- }
- }, [])
-
- const scrollToBottom = useCallback(() => {
- isAutoScrolling.current = true
-
- setTimeout(() => {
- if (messagesEndRef.current) {
- messagesEndRef.current.scrollIntoView({ behavior: "smooth" })
- }
-
- isAutoScrolling.current = false
- }, 100)
- }, [])
-
- return {
- messagesStartRef,
- messagesEndRef,
- containerRef,
- isAtTop,
- isAtBottom,
- userScrolled,
- isOverflowing,
- scrollToTop,
- scrollToBottom,
- setIsAtBottom
- }
-}
\ No newline at end of file
diff --git a/src/hooks/useSmartScroll.tsx b/src/hooks/useSmartScroll.tsx
new file mode 100644
index 0000000..cad0ce4
--- /dev/null
+++ b/src/hooks/useSmartScroll.tsx
@@ -0,0 +1,35 @@
+import { useRef, useEffect, useState } from 'react';
+
+export const useSmartScroll = (messages: any[], streaming: boolean) => {
+ const containerRef = useRef(null);
+ const [isAtBottom, setIsAtBottom] = useState(true);
+
+ useEffect(() => {
+ const container = containerRef.current;
+ if (!container) return;
+
+ const handleScroll = () => {
+ const { scrollTop, scrollHeight, clientHeight } = container;
+ setIsAtBottom(scrollHeight - scrollTop - clientHeight < 50);
+ };
+
+ container.addEventListener('scroll', handleScroll);
+ return () => container.removeEventListener('scroll', handleScroll);
+ }, []);
+
+ useEffect(() => {
+ if (isAtBottom && containerRef.current) {
+ const scrollOptions: ScrollIntoViewOptions = streaming
+ ? { behavior: 'smooth', block: 'end' }
+ : { behavior: 'auto', block: 'end' };
+ containerRef.current.lastElementChild?.scrollIntoView(scrollOptions);
+ }
+ }, [messages, streaming, isAtBottom]);
+
+ const scrollToBottom = () => {
+ containerRef.current?.lastElementChild?.scrollIntoView({ behavior: 'smooth', block: 'end' });
+ };
+
+
+ return { containerRef, isAtBottom, scrollToBottom };
+};
diff --git a/src/libs/process-knowledge.ts b/src/libs/process-knowledge.ts
index f933d85..0288e3a 100644
--- a/src/libs/process-knowledge.ts
+++ b/src/libs/process-knowledge.ts
@@ -12,6 +12,7 @@ import { PageAssisCSVUrlLoader } from "@/loader/csv"
import { PageAssisTXTUrlLoader } from "@/loader/txt"
import { PageAssistDocxLoader } from "@/loader/docx"
import { cleanUrl } from "./clean-url"
+import { sendEmbeddingCompleteNotification } from "./send-notification"
export const processKnowledge = async (msg: any, id: string): Promise => {
@@ -102,6 +103,8 @@ export const processKnowledge = async (msg: any, id: string): Promise => {
}
await updateKnowledgeStatus(id, "finished")
+
+ await sendEmbeddingCompleteNotification()
} catch (error) {
console.error(`Error processing knowledge with id: ${id}`, error)
await updateKnowledgeStatus(id, "failed")
diff --git a/src/libs/send-notification.ts b/src/libs/send-notification.ts
new file mode 100644
index 0000000..86a3f9c
--- /dev/null
+++ b/src/libs/send-notification.ts
@@ -0,0 +1,29 @@
+import { Storage } from "@plasmohq/storage"
+const storage = new Storage()
+
+export const sendNotification = async (title: string, message: string) => {
+ try {
+ const sendNotificationAfterIndexing = await storage.get(
+ "sendNotificationAfterIndexing"
+ )
+ if (sendNotificationAfterIndexing) {
+ console.log("Sending notification")
+ browser.notifications.create({
+ type: "basic",
+ iconUrl: browser.runtime.getURL("/icon/128.png"),
+ title,
+ message
+ })
+ console.log("Notification sent")
+ }
+ } catch (error) {
+ console.error(error)
+ }
+}
+
+export const sendEmbeddingCompleteNotification = async () => {
+ await sendNotification(
+ "Page Assist - Embedding Completed",
+ "The knowledge base embedding process is complete. You can now use the knowledge base for chatting."
+ )
+}
diff --git a/src/public/_locales/en/messages.json b/src/public/_locales/en/messages.json
index 6e3f66b..a574d20 100644
--- a/src/public/_locales/en/messages.json
+++ b/src/public/_locales/en/messages.json
@@ -7,5 +7,8 @@
},
"openSidePanelToChat": {
"message": "Open Copilot to Chat"
+ },
+ "openOptionToChat": {
+ "message": "Open Web UI to Chat"
}
}
\ No newline at end of file
diff --git a/src/queue/index.ts b/src/queue/index.ts
index f35a382..6ea810f 100644
--- a/src/queue/index.ts
+++ b/src/queue/index.ts
@@ -3,4 +3,22 @@ import PubSub from "pubsub-js"
export const KNOWLEDGE_QUEUE = Symbol("queue")
-PubSub.subscribe(KNOWLEDGE_QUEUE, processKnowledge)
+let isProcessing = false
+
+PubSub.subscribe(KNOWLEDGE_QUEUE, async (msg, id) => {
+ try {
+ isProcessing = true
+ await processKnowledge(msg, id)
+ isProcessing = false
+ } catch (error) {
+ console.error(error)
+ isProcessing = false
+ }
+})
+
+window.addEventListener("beforeunload", (event) => {
+ if (isProcessing) {
+ event.preventDefault()
+ event.returnValue = ""
+ }
+})
diff --git a/src/services/app.ts b/src/services/app.ts
index ca16437..c442bd9 100644
--- a/src/services/app.ts
+++ b/src/services/app.ts
@@ -80,3 +80,21 @@ export const getCustomOllamaHeaders = async (): Promise<
return headerMap
}
+
+export const getOpenOnIconClick = async (): Promise => {
+ const openOnIconClick = await storage.get("openOnIconClick");
+ return openOnIconClick || "webUI";
+};
+
+export const setOpenOnIconClick = async (option: "webUI" | "sidePanel"): Promise => {
+ await storage.set("openOnIconClick", option);
+};
+
+export const getOpenOnRightClick = async (): Promise => {
+ const openOnRightClick = await storage.get("openOnRightClick");
+ return openOnRightClick || "sidePanel";
+};
+
+export const setOpenOnRightClick = async (option: "webUI" | "sidePanel"): Promise => {
+ await storage.set("openOnRightClick", option);
+};
diff --git a/src/services/model-settings.ts b/src/services/model-settings.ts
index 278576d..501bf59 100644
--- a/src/services/model-settings.ts
+++ b/src/services/model-settings.ts
@@ -2,100 +2,127 @@ import { Storage } from "@plasmohq/storage"
const storage = new Storage()
type ModelSettings = {
- f16KV?: boolean
- frequencyPenalty?: number
- keepAlive?: string
- logitsAll?: boolean
- mirostat?: number
- mirostatEta?: number
- mirostatTau?: number
- numBatch?: number
- numCtx?: number
- numGpu?: number
- numGqa?: number
- numKeep?: number
- numPredict?: number
- numThread?: number
- penalizeNewline?: boolean
- presencePenalty?: number
- repeatLastN?: number
- repeatPenalty?: number
- ropeFrequencyBase?: number
- ropeFrequencyScale?: number
- temperature?: number
- tfsZ?: number
- topK?: number
- topP?: number
- typicalP?: number
- useMLock?: boolean
- useMMap?: boolean
- vocabOnly?: boolean
+ f16KV?: boolean
+ frequencyPenalty?: number
+ keepAlive?: string
+ logitsAll?: boolean
+ mirostat?: number
+ mirostatEta?: number
+ mirostatTau?: number
+ numBatch?: number
+ numCtx?: number
+ numGpu?: number
+ numGqa?: number
+ numKeep?: number
+ numPredict?: number
+ numThread?: number
+ penalizeNewline?: boolean
+ presencePenalty?: number
+ repeatLastN?: number
+ repeatPenalty?: number
+ ropeFrequencyBase?: number
+ ropeFrequencyScale?: number
+ temperature?: number
+ tfsZ?: number
+ topK?: number
+ topP?: number
+ typicalP?: number
+ useMLock?: boolean
+ useMMap?: boolean
+ vocabOnly?: boolean
}
const keys = [
- "f16KV",
- "frequencyPenalty",
- "keepAlive",
- "logitsAll",
- "mirostat",
- "mirostatEta",
- "mirostatTau",
- "numBatch",
- "numCtx",
- "numGpu",
- "numGqa",
- "numKeep",
- "numPredict",
- "numThread",
- "penalizeNewline",
- "presencePenalty",
- "repeatLastN",
- "repeatPenalty",
- "ropeFrequencyBase",
- "ropeFrequencyScale",
- "temperature",
- "tfsZ",
- "topK",
- "topP",
- "typicalP",
- "useMLock",
- "useMMap",
- "vocabOnly"
+ "f16KV",
+ "frequencyPenalty",
+ "keepAlive",
+ "logitsAll",
+ "mirostat",
+ "mirostatEta",
+ "mirostatTau",
+ "numBatch",
+ "numCtx",
+ "numGpu",
+ "numGqa",
+ "numKeep",
+ "numPredict",
+ "numThread",
+ "penalizeNewline",
+ "presencePenalty",
+ "repeatLastN",
+ "repeatPenalty",
+ "ropeFrequencyBase",
+ "ropeFrequencyScale",
+ "temperature",
+ "tfsZ",
+ "topK",
+ "topP",
+ "typicalP",
+ "useMLock",
+ "useMMap",
+ "vocabOnly"
]
const getAllModelSettings = async () => {
- try {
- const settings: ModelSettings = {}
- for (const key of keys) {
- const value = await storage.get(key)
- settings[key] = value
- if (!value && key === "keepAlive") {
- settings[key] = "5m"
- }
-
- }
- return settings
- } catch (error) {
- console.error(error)
- return {}
+ try {
+ const settings: ModelSettings = {}
+ for (const key of keys) {
+ const value = await storage.get(key)
+ settings[key] = value
+ if (!value && key === "keepAlive") {
+ settings[key] = "5m"
+ }
}
+ return settings
+ } catch (error) {
+ console.error(error)
+ return {}
+ }
}
-const setModelSetting = async (key: string,
- value: string | number | boolean) => {
- await storage.set(key, value)
+const setModelSetting = async (
+ key: string,
+ value: string | number | boolean
+) => {
+ await storage.set(key, value)
}
export const getAllDefaultModelSettings = async (): Promise => {
- const settings: ModelSettings = {}
- for (const key of keys) {
- const value = await storage.get(key)
- settings[key] = value
- if (!value && key === "keepAlive") {
- settings[key] = "5m"
- }
+ const settings: ModelSettings = {}
+ for (const key of keys) {
+ const value = await storage.get(key)
+ settings[key] = value
+ if (!value && key === "keepAlive") {
+ settings[key] = "5m"
}
- return settings
+ }
+ return settings
}
-export { getAllModelSettings, setModelSetting }
\ No newline at end of file
+export const lastUsedChatModelEnabled = async (): Promise => {
+ const isLastUsedChatModelEnabled = await storage.get(
+ "restoreLastChatModel"
+ )
+ return isLastUsedChatModelEnabled ?? false
+}
+
+export const setLastUsedChatModelEnabled = async (
+ enabled: boolean
+): Promise => {
+ await storage.set("restoreLastChatModel", enabled)
+}
+
+export const getLastUsedChatModel = async (
+ historyId: string
+): Promise => {
+ return await storage.get(`lastUsedChatModel-${historyId}`)
+}
+
+export const setLastUsedChatModel = async (
+ historyId: string,
+ model: string
+): Promise => {
+ await storage.set(`lastUsedChatModel-${historyId}`, model)
+}
+
+export { getAllModelSettings, setModelSetting }
diff --git a/wxt.config.ts b/wxt.config.ts
index 910475e..5c31a73 100644
--- a/wxt.config.ts
+++ b/wxt.config.ts
@@ -11,7 +11,8 @@ const chromeMV3Permissions = [
"action",
"unlimitedStorage",
"contextMenus",
- "tts"
+ "tts",
+ "notifications"
]
const firefoxMV2Permissions = [
@@ -22,6 +23,7 @@ const firefoxMV2Permissions = [
"contextMenus",
"webRequest",
"webRequestBlocking",
+ "notifications",
"http://*/*",
"https://*/*",
"file://*/*"
@@ -48,7 +50,7 @@ export default defineConfig({
outDir: "build",
manifest: {
- version: "1.1.14",
+ version: "1.1.15",
name:
process.env.TARGET === "firefox"
? "Page Assist - A Web UI for Local AI Models"