Update SidepanelChat imports and add SidepanelSettingsHeader route
This commit is contained in:
parent
ca84cc3b64
commit
23e488770d
@ -1,7 +1,7 @@
|
|||||||
import React from "react"
|
import React from "react"
|
||||||
import { PlaygroundMessage } from "~components/Common/Playground/Message"
|
import { PlaygroundMessage } from "~components/Common/Playground/Message"
|
||||||
import { useMessage } from "~hooks/useMessage"
|
import { useMessage } from "~hooks/useMessage"
|
||||||
import { EmptySidePanel } from "./empty"
|
import { EmptySidePanel } from "../Chat/empty"
|
||||||
|
|
||||||
export const SidePanelBody = () => {
|
export const SidePanelBody = () => {
|
||||||
const { messages } = useMessage()
|
const { messages } = useMessage()
|
@ -2,6 +2,7 @@ import logoImage from "data-base64:~assets/icon.png"
|
|||||||
import CogIcon from "@heroicons/react/24/outline/CogIcon"
|
import CogIcon from "@heroicons/react/24/outline/CogIcon"
|
||||||
import { ArrowPathIcon } from "@heroicons/react/24/outline"
|
import { ArrowPathIcon } from "@heroicons/react/24/outline"
|
||||||
import { useMessage } from "~hooks/useMessage"
|
import { useMessage } from "~hooks/useMessage"
|
||||||
|
import { Link } from "react-router-dom"
|
||||||
export const SidepanelHeader = () => {
|
export const SidepanelHeader = () => {
|
||||||
const { clearChat } = useMessage()
|
const { clearChat } = useMessage()
|
||||||
return (
|
return (
|
||||||
@ -19,7 +20,9 @@ export const SidepanelHeader = () => {
|
|||||||
className="flex items-center space-x-1 focus:outline-none focus-visible:ring-2 focus-visible:ring-pink-700">
|
className="flex items-center space-x-1 focus:outline-none focus-visible:ring-2 focus-visible:ring-pink-700">
|
||||||
<ArrowPathIcon className="h-5 w-5 text-gray-500 dark:text-gray-400" />
|
<ArrowPathIcon className="h-5 w-5 text-gray-500 dark:text-gray-400" />
|
||||||
</button>
|
</button>
|
||||||
<CogIcon className="h-5 w-5 text-gray-500 dark:text-gray-400" />
|
<Link to="/settings">
|
||||||
|
<CogIcon className="h-5 w-5 text-gray-500 dark:text-gray-400" />
|
||||||
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
16
src/components/Sidepanel/Settings/header.tsx
Normal file
16
src/components/Sidepanel/Settings/header.tsx
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
import logoImage from "data-base64:~assets/icon.png"
|
||||||
|
import { ChevronLeftIcon } from "@heroicons/react/24/outline"
|
||||||
|
import { Link } from "react-router-dom"
|
||||||
|
export const SidepanelSettingsHeader = () => {
|
||||||
|
return (
|
||||||
|
<div className="flex px-3 justify-start gap-3 bg-white dark:bg-black border-b border-gray-200 dark:border-gray-800 py-4 items-center">
|
||||||
|
<Link to="/">
|
||||||
|
<ChevronLeftIcon className="h-5 w-5 text-gray-500 dark:text-gray-400" />
|
||||||
|
</Link>
|
||||||
|
<div className="focus:outline-none focus-visible:ring-2 focus-visible:ring-pink-700 flex items-center dark:text-white">
|
||||||
|
<img className="h-6 w-auto" src={logoImage} alt="Page Assist" />
|
||||||
|
<span className="ml-1 text-sm ">Page Assist</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
@ -1,25 +0,0 @@
|
|||||||
import { HumanMessage, AIMessage } from "@langchain/core/messages"
|
|
||||||
import { ChatMessageHistory } from "langchain/stores/message/in_memory"
|
|
||||||
import { ChatOllama } from "@langchain/community/chat_models/ollama"
|
|
||||||
import { getOllamaURL } from "~services/ollama"
|
|
||||||
import { cleanUrl } from "~libs/clean-url"
|
|
||||||
|
|
||||||
export class NormalChatOllama {
|
|
||||||
ollama: ChatOllama
|
|
||||||
|
|
||||||
async _init() {
|
|
||||||
const ollamaURL = await getOllamaURL()
|
|
||||||
this.ollama = new ChatOllama({
|
|
||||||
baseUrl: cleanUrl(ollamaURL),
|
|
||||||
model: "qwen:1.8b-chat"
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
constructor() {
|
|
||||||
this._init()
|
|
||||||
}
|
|
||||||
|
|
||||||
async send(message: HumanMessage) {
|
|
||||||
if (!this.ollama) return null
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,5 +1,6 @@
|
|||||||
import { Route, Routes } from "react-router-dom"
|
import { Route, Routes } from "react-router-dom"
|
||||||
import { SidepanelChat } from "./sidepanel-chat"
|
import { SidepanelChat } from "./sidepanel-chat"
|
||||||
|
import { SidepanelSettingsHeader } from "~components/Sidepanel/Settings/header"
|
||||||
|
|
||||||
export const Routing = () => <Routes></Routes>
|
export const Routing = () => <Routes></Routes>
|
||||||
|
|
||||||
@ -7,6 +8,7 @@ export const SidepanelRouting = () => (
|
|||||||
<div className="dark">
|
<div className="dark">
|
||||||
<Routes>
|
<Routes>
|
||||||
<Route path="/" element={<SidepanelChat />} />
|
<Route path="/" element={<SidepanelChat />} />
|
||||||
|
<Route path="/settings" element={<SidepanelSettingsHeader />} />
|
||||||
</Routes>
|
</Routes>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
import { SidePanelBody } from "~components/Sidepanel/body"
|
import { SidePanelBody } from "~components/Sidepanel/Chat/body"
|
||||||
import { SidepanelForm } from "~components/Sidepanel/form"
|
import { SidepanelForm } from "~components/Sidepanel/Chat/form"
|
||||||
import { SidepanelHeader } from "~components/Sidepanel/header"
|
import { SidepanelHeader } from "~components/Sidepanel/Chat/header"
|
||||||
|
|
||||||
export const SidepanelChat = () => {
|
export const SidepanelChat = () => {
|
||||||
return (
|
return (
|
||||||
|
11
src/routes/sidepanel-settings.tsx
Normal file
11
src/routes/sidepanel-settings.tsx
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
import { SidepanelSettingsHeader } from "~components/Sidepanel/Settings/header"
|
||||||
|
|
||||||
|
export const SidepanelSettings = () => {
|
||||||
|
return (
|
||||||
|
<div className="flex bg-white dark:bg-black flex-col min-h-screen mx-auto max-w-7xl">
|
||||||
|
<div className="sticky top-0 z-10">
|
||||||
|
<SidepanelSettingsHeader />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
Loading…
x
Reference in New Issue
Block a user