Added ability to resume previous chat on copilot

This commit is contained in:
n4ze3m 2024-05-24 21:01:10 +05:30
parent 9e2ef72486
commit 961f5180c6
7 changed files with 88 additions and 26 deletions

View File

@ -1,8 +1,8 @@
import { Tag } from "antd" import { Tag } from "antd"
import { useTranslation } from "react-i18next" import { useTranslation } from "react-i18next"
export const BetaTag = () => { export const BetaTag = ({className} : {className?: string}) => {
const { t } = useTranslation("common") const { t } = useTranslation("common")
return <Tag color="yellow">{t("beta")}</Tag> return <Tag className={className} color="yellow">{t("beta")}</Tag>
} }

View File

@ -24,7 +24,6 @@ import { SelectedKnowledge } from "../Option/Knowledge/SelectedKnwledge"
import { useStorage } from "@plasmohq/storage/hook" import { useStorage } from "@plasmohq/storage/hook"
import { ModelSelect } from "../Common/ModelSelect" import { ModelSelect } from "../Common/ModelSelect"
import { PromptSelect } from "../Common/PromptSelect" import { PromptSelect } from "../Common/PromptSelect"
import { ChatSettings } from "../Icons/ChatSettings"
import { CurrentChatModelSettings } from "../Common/Settings/CurrentChatModelSettings" import { CurrentChatModelSettings } from "../Common/Settings/CurrentChatModelSettings"
export default function OptionLayout({ export default function OptionLayout({
@ -36,6 +35,10 @@ export default function OptionLayout({
const { t } = useTranslation(["option", "common"]) const { t } = useTranslation(["option", "common"])
const [shareModeEnabled] = useStorage("shareMode", false) const [shareModeEnabled] = useStorage("shareMode", false)
const [openModelSettings, setOpenModelSettings] = useState(false) const [openModelSettings, setOpenModelSettings] = useState(false)
const [hideCurrentChatModelSettings] = useStorage(
"hideCurrentChatModelSettings",
false
)
const { const {
selectedModel, selectedModel,
@ -194,13 +197,15 @@ export default function OptionLayout({
<div className="flex flex-1 justify-end px-4"> <div className="flex flex-1 justify-end px-4">
<div className="ml-4 flex items-center md:ml-6"> <div className="ml-4 flex items-center md:ml-6">
<div className="flex gap-4 items-center"> <div className="flex gap-4 items-center">
<Tooltip title={t("common:currentChatModelSettings")}> {!hideCurrentChatModelSettings && (
<button <Tooltip title={t("common:currentChatModelSettings")}>
onClick={() => setOpenModelSettings(true)} <button
className="!text-gray-500 dark:text-gray-300 hover:text-gray-600 dark:hover:text-gray-300 transition-colors"> onClick={() => setOpenModelSettings(true)}
<BrainCog className="w-6 h-6" /> className="!text-gray-500 dark:text-gray-300 hover:text-gray-600 dark:hover:text-gray-300 transition-colors">
</button> <BrainCog className="w-6 h-6" />
</Tooltip> </button>
</Tooltip>
)}
{pathname === "/" && {pathname === "/" &&
messages.length > 0 && messages.length > 0 &&
!streaming && !streaming &&

View File

@ -1,13 +1,11 @@
import { BetaTag } from "@/components/Common/Beta"
import { SaveButton } from "@/components/Common/SaveButton" import { SaveButton } from "@/components/Common/SaveButton"
import { getAllModelSettings, setModelSetting } from "@/services/model-settings" import { getAllModelSettings, setModelSetting } from "@/services/model-settings"
import { useQuery, useQueryClient } from "@tanstack/react-query" import { useQuery, useQueryClient } from "@tanstack/react-query"
import { Form, Skeleton, Input, InputNumber, Collapse } from "antd" import { Form, Skeleton, Input, InputNumber, Collapse } from "antd"
import React from "react" import React from "react"
import { useTranslation } from "react-i18next" import { useTranslation } from "react-i18next"
// keepAlive?: string
// temperature?: number
// topK?: number
// topP?: number
export const ModelSettings = () => { export const ModelSettings = () => {
const { t } = useTranslation("common") const { t } = useTranslation("common")
@ -25,9 +23,12 @@ export const ModelSettings = () => {
return ( return (
<div> <div>
<div> <div>
<div className="inline-flex items-center gap-3">
<BetaTag />
<h2 className="text-base font-semibold leading-7 text-gray-900 dark:text-white"> <h2 className="text-base font-semibold leading-7 text-gray-900 dark:text-white">
{t("modelSettings.label")} {t("modelSettings.label")}
</h2> </h2>
</div>
<p className="text-sm text-gray-500 dark:text-neutral-400 mt-1"> <p className="text-sm text-gray-500 dark:text-neutral-400 mt-1">
{t("modelSettings.description")} {t("modelSettings.description")}
</p> </p>

View File

@ -2,7 +2,7 @@ import { useQueryClient } from "@tanstack/react-query"
import { useDarkMode } from "~/hooks/useDarkmode" import { useDarkMode } from "~/hooks/useDarkmode"
import { useMessageOption } from "~/hooks/useMessageOption" import { useMessageOption } from "~/hooks/useMessageOption"
import { PageAssitDatabase } from "@/db" import { PageAssitDatabase } from "@/db"
import { Select } from "antd" import { Select, Switch } from "antd"
import { SUPPORTED_LANGUAGES } from "~/utils/supporetd-languages" import { SUPPORTED_LANGUAGES } from "~/utils/supporetd-languages"
import { MoonIcon, SunIcon } from "lucide-react" import { MoonIcon, SunIcon } from "lucide-react"
import { SearchModeSettings } from "./search-mode" import { SearchModeSettings } from "./search-mode"
@ -14,11 +14,20 @@ import {
importPageAssistData importPageAssistData
} from "@/libs/export-import" } from "@/libs/export-import"
import { BetaTag } from "@/components/Common/Beta" import { BetaTag } from "@/components/Common/Beta"
import { useStorage } from "@plasmohq/storage/hook"
export const SettingOther = () => { export const SettingOther = () => {
const { clearChat, speechToTextLanguage, setSpeechToTextLanguage } = const { clearChat, speechToTextLanguage, setSpeechToTextLanguage } =
useMessageOption() useMessageOption()
const [copilotResumeLastChat, setCopilotResumeLastChat] = useStorage(
"copilotResumeLastChat",
false
)
const [hideCurrentChatModelSettings, setHideCurrentChatModelSettings] =
useStorage("hideCurrentChatModelSettings", false)
const queryClient = useQueryClient() const queryClient = useQueryClient()
const { mode, toggleDarkMode } = useDarkMode() const { mode, toggleDarkMode } = useDarkMode()
@ -34,7 +43,7 @@ export const SettingOther = () => {
<div className="border border-b border-gray-200 dark:border-gray-600 mt-3"></div> <div className="border border-b border-gray-200 dark:border-gray-600 mt-3"></div>
</div> </div>
<div className="flex flex-row justify-between"> <div className="flex flex-row justify-between">
<span className="text-gray-500 dark:text-neutral-50"> <span className="text-gray-500 dark:text-neutral-50">
{t("generalSettings.settings.speechRecognitionLang.label")} {t("generalSettings.settings.speechRecognitionLang.label")}
</span> </span>
@ -76,6 +85,29 @@ export const SettingOther = () => {
}} }}
/> />
</div> </div>
<div className="flex flex-row justify-between">
<span className="text-gray-500 dark:text-neutral-50">
{t("generalSettings.settings.copilotResumeLastChat.label")}
</span>
<Switch
checked={copilotResumeLastChat}
onChange={(checked) => setCopilotResumeLastChat(checked)}
/>
</div>
<div className="flex flex-row justify-between">
<div className="inline-flex items-center gap-2">
<BetaTag />
<span className="text-gray-500 dark:text-neutral-50">
{t("generalSettings.settings.hideCurrentChatModelSettings.label")}
</span>
</div>
<Switch
checked={hideCurrentChatModelSettings}
onChange={(checked) => setHideCurrentChatModelSettings(checked)}
/>
</div>
<div className="flex flex-row justify-between"> <div className="flex flex-row justify-between">
<span className="text-gray-500 dark:text-neutral-50 "> <span className="text-gray-500 dark:text-neutral-50 ">
{t("generalSettings.settings.darkMode.label")} {t("generalSettings.settings.darkMode.label")}
@ -129,7 +161,7 @@ export const SettingOther = () => {
</div> </div>
<div className="flex flex-row mb-3 justify-between"> <div className="flex flex-row mb-3 justify-between">
<span className="text-gray-500 dark:text-neutral-50 "> <span className="text-gray-500 dark:text-neutral-50 ">
<BetaTag /> {t("generalSettings.system.export.label")} {t("generalSettings.system.export.label")}
</span> </span>
<button <button
onClick={exportPageAssistData} onClick={exportPageAssistData}
@ -139,7 +171,7 @@ export const SettingOther = () => {
</div> </div>
<div className="flex flex-row mb-3 justify-between"> <div className="flex flex-row mb-3 justify-between">
<span className="text-gray-500 dark:text-neutral-50 "> <span className="text-gray-500 dark:text-neutral-50 ">
<BetaTag /> {t("generalSettings.system.import.label")} {t("generalSettings.system.import.label")}
</span> </span>
<label <label
htmlFor="import" htmlFor="import"

View File

@ -6,7 +6,13 @@ import { BoxesIcon, BrainCog, CogIcon, EraserIcon } from "lucide-react"
import { useTranslation } from "react-i18next" import { useTranslation } from "react-i18next"
import { CurrentChatModelSettings } from "@/components/Common/Settings/CurrentChatModelSettings" import { CurrentChatModelSettings } from "@/components/Common/Settings/CurrentChatModelSettings"
import React from "react" import React from "react"
import { useStorage } from "@plasmohq/storage/hook"
export const SidepanelHeader = () => { export const SidepanelHeader = () => {
const [hideCurrentChatModelSettings] = useStorage(
"hideCurrentChatModelSettings",
false
)
const { clearChat, isEmbedding, messages, streaming } = useMessage() const { clearChat, isEmbedding, messages, streaming } = useMessage()
const { t } = useTranslation(["sidepanel", "common"]) const { t } = useTranslation(["sidepanel", "common"])
const [openModelSettings, setOpenModelSettings] = React.useState(false) const [openModelSettings, setOpenModelSettings] = React.useState(false)
@ -43,13 +49,15 @@ export const SidepanelHeader = () => {
<HistoryIcon className="h-5 w-5 text-gray-500 dark:text-gray-400" /> <HistoryIcon className="h-5 w-5 text-gray-500 dark:text-gray-400" />
</Link> </Link>
</Tooltip> */} </Tooltip> */}
<Tooltip title={t("common:currentChatModelSettings")}> {!hideCurrentChatModelSettings && (
<button <Tooltip title={t("common:currentChatModelSettings")}>
onClick={() => setOpenModelSettings(true)} <button
className="text-gray-500 dark:text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 transition-colors"> onClick={() => setOpenModelSettings(true)}
<BrainCog className="w-5 h-5" /> className="text-gray-500 dark:text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 transition-colors">
</button> <BrainCog className="w-5 h-5" />
</Tooltip> </button>
</Tooltip>
)}
<Link to="/settings"> <Link to="/settings">
<CogIcon className="h-5 w-5 text-gray-500 dark:text-gray-400" /> <CogIcon className="h-5 w-5 text-gray-500 dark:text-gray-400" />
</Link> </Link>

View File

@ -3,6 +3,7 @@ import {
formatToMessage, formatToMessage,
getRecentChatFromCopilot getRecentChatFromCopilot
} from "@/db" } from "@/db"
import { copilotResumeLastChat } from "@/services/app"
import React from "react" import React from "react"
import { SidePanelBody } from "~/components/Sidepanel/Chat/body" import { SidePanelBody } from "~/components/Sidepanel/Chat/body"
import { SidepanelForm } from "~/components/Sidepanel/Chat/form" import { SidepanelForm } from "~/components/Sidepanel/Chat/form"
@ -19,6 +20,11 @@ const SidepanelChat = () => {
useMessage() useMessage()
const setRecentMessagesOnLoad = async () => { const setRecentMessagesOnLoad = async () => {
const isEnabled = await copilotResumeLastChat();
if (!isEnabled) {
return;
}
if (messages.length === 0) { if (messages.length === 0) {
const recentChat = await getRecentChatFromCopilot() const recentChat = await getRecentChatFromCopilot()
if (recentChat) { if (recentChat) {
@ -86,6 +92,11 @@ const SidepanelChat = () => {
} }
}, []) }, [])
React.useEffect(() => {
setRecentMessagesOnLoad()
}, [])
return ( return (
<div <div
ref={drop} ref={drop}

View File

@ -34,3 +34,8 @@ export const getAdvancedOllamaSettings = async () => {
rewriteUrl rewriteUrl
} }
} }
export const copilotResumeLastChat = async () => {
return await storage.get<boolean>("copilotResumeLastChat")
}