fix: content setting right panel default to collapse (#2026)
This commit is contained in:
Faisal Amir
GitHub
parent
3ab23d571f
commit
ab77622e73
@ -31,7 +31,7 @@ export default function CardSidebar({
|
|||||||
rightAction,
|
rightAction,
|
||||||
hideMoreVerticalAction,
|
hideMoreVerticalAction,
|
||||||
}: Props) {
|
}: Props) {
|
||||||
const [show, setShow] = useState(true)
|
const [show, setShow] = useState(false)
|
||||||
const [more, setMore] = useState(false)
|
const [more, setMore] = useState(false)
|
||||||
const [menu, setMenu] = useState<HTMLDivElement | null>(null)
|
const [menu, setMenu] = useState<HTMLDivElement | null>(null)
|
||||||
const [toggle, setToggle] = useState<HTMLDivElement | null>(null)
|
const [toggle, setToggle] = useState<HTMLDivElement | null>(null)
|
||||||
|
|||||||
@ -156,21 +156,87 @@ const Sidebar: React.FC = () => {
|
|||||||
<div>
|
<div>
|
||||||
{activeThread?.assistants[0]?.tools &&
|
{activeThread?.assistants[0]?.tools &&
|
||||||
componentDataAssistantSetting.length > 0 && (
|
componentDataAssistantSetting.length > 0 && (
|
||||||
<div className="mt-2">
|
<CardSidebar title="Tools">
|
||||||
<CardSidebar title="Tools">
|
<div className="px-2 pt-4">
|
||||||
<div className="px-2 pt-4">
|
<div className="mb-2">
|
||||||
<div className="mb-2">
|
<div className="flex items-center justify-between">
|
||||||
|
<label
|
||||||
|
id="retrieval"
|
||||||
|
className="inline-flex items-center font-bold text-zinc-500 dark:text-gray-300"
|
||||||
|
>
|
||||||
|
Retrieval
|
||||||
|
<Tooltip>
|
||||||
|
<TooltipTrigger asChild>
|
||||||
|
<InfoIcon
|
||||||
|
size={16}
|
||||||
|
className="ml-2 flex-shrink-0 text-black dark:text-gray-500"
|
||||||
|
/>
|
||||||
|
</TooltipTrigger>
|
||||||
|
<TooltipPortal>
|
||||||
|
<TooltipContent
|
||||||
|
side="top"
|
||||||
|
className="max-w-[240px]"
|
||||||
|
>
|
||||||
|
<span>
|
||||||
|
Retrieval helps the assistant use information
|
||||||
|
from files you send to it. Once you share a
|
||||||
|
file, the assistant automatically fetches the
|
||||||
|
relevant content based on your request.
|
||||||
|
</span>
|
||||||
|
<TooltipArrow />
|
||||||
|
</TooltipContent>
|
||||||
|
</TooltipPortal>
|
||||||
|
</Tooltip>
|
||||||
|
</label>
|
||||||
|
|
||||||
<div className="flex items-center justify-between">
|
<div className="flex items-center justify-between">
|
||||||
<label
|
<Switch
|
||||||
id="retrieval"
|
name="retrieval"
|
||||||
className="inline-flex items-center font-bold text-zinc-500 dark:text-gray-300"
|
className="mr-2"
|
||||||
>
|
checked={
|
||||||
Retrieval
|
activeThread?.assistants[0].tools[0].enabled
|
||||||
|
}
|
||||||
|
onCheckedChange={(e) => {
|
||||||
|
if (activeThread)
|
||||||
|
updateThreadMetadata({
|
||||||
|
...activeThread,
|
||||||
|
assistants: [
|
||||||
|
{
|
||||||
|
...activeThread.assistants[0],
|
||||||
|
tools: [
|
||||||
|
{
|
||||||
|
type: 'retrieval',
|
||||||
|
enabled: e,
|
||||||
|
settings:
|
||||||
|
(activeThread.assistants[0].tools &&
|
||||||
|
activeThread.assistants[0]
|
||||||
|
.tools[0]?.settings) ??
|
||||||
|
{},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
})
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{activeThread?.assistants[0]?.tools[0].enabled && (
|
||||||
|
<div className="pb-4 pt-2">
|
||||||
|
<div className="mb-4">
|
||||||
|
<div className="item-center mb-2 flex">
|
||||||
|
<label
|
||||||
|
id="embedding-model"
|
||||||
|
className="inline-flex font-bold text-zinc-500 dark:text-gray-300"
|
||||||
|
>
|
||||||
|
Embedding Model
|
||||||
|
</label>
|
||||||
<Tooltip>
|
<Tooltip>
|
||||||
<TooltipTrigger asChild>
|
<TooltipTrigger asChild>
|
||||||
<InfoIcon
|
<InfoIcon
|
||||||
size={16}
|
size={16}
|
||||||
className="ml-2 flex-shrink-0 text-black dark:text-gray-500"
|
className="ml-2 flex-shrink-0 dark:text-gray-500"
|
||||||
/>
|
/>
|
||||||
</TooltipTrigger>
|
</TooltipTrigger>
|
||||||
<TooltipPortal>
|
<TooltipPortal>
|
||||||
@ -179,140 +245,70 @@ const Sidebar: React.FC = () => {
|
|||||||
className="max-w-[240px]"
|
className="max-w-[240px]"
|
||||||
>
|
>
|
||||||
<span>
|
<span>
|
||||||
Retrieval helps the assistant use
|
Embedding model is crucial for understanding
|
||||||
information from files you send to it. Once
|
and processing the input text effectively by
|
||||||
you share a file, the assistant
|
converting text to numerical
|
||||||
automatically fetches the relevant content
|
representations. Align the model choice with
|
||||||
based on your request.
|
your task, evaluate its performance, and
|
||||||
|
consider factors like resource availability.
|
||||||
|
Experiment to find the best fit for your
|
||||||
|
specific use case.
|
||||||
</span>
|
</span>
|
||||||
<TooltipArrow />
|
<TooltipArrow />
|
||||||
</TooltipContent>
|
</TooltipContent>
|
||||||
</TooltipPortal>
|
</TooltipPortal>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
</label>
|
</div>
|
||||||
|
|
||||||
<div className="flex items-center justify-between">
|
<div className="flex items-center justify-between">
|
||||||
<Switch
|
<Input value={selectedModel?.name} disabled />
|
||||||
name="retrieval"
|
|
||||||
className="mr-2"
|
|
||||||
checked={
|
|
||||||
activeThread?.assistants[0].tools[0].enabled
|
|
||||||
}
|
|
||||||
onCheckedChange={(e) => {
|
|
||||||
if (activeThread)
|
|
||||||
updateThreadMetadata({
|
|
||||||
...activeThread,
|
|
||||||
assistants: [
|
|
||||||
{
|
|
||||||
...activeThread.assistants[0],
|
|
||||||
tools: [
|
|
||||||
{
|
|
||||||
type: 'retrieval',
|
|
||||||
enabled: e,
|
|
||||||
settings:
|
|
||||||
(activeThread.assistants[0]
|
|
||||||
.tools &&
|
|
||||||
activeThread.assistants[0]
|
|
||||||
.tools[0]?.settings) ??
|
|
||||||
{},
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
],
|
|
||||||
})
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div className="mb-4">
|
||||||
|
<div className="mb-2 flex items-center">
|
||||||
|
<label
|
||||||
|
id="vector-database"
|
||||||
|
className="inline-block font-bold text-zinc-500 dark:text-gray-300"
|
||||||
|
>
|
||||||
|
Vector Database
|
||||||
|
</label>
|
||||||
|
<Tooltip>
|
||||||
|
<TooltipTrigger asChild>
|
||||||
|
<InfoIcon
|
||||||
|
size={16}
|
||||||
|
className="ml-2 flex-shrink-0 dark:text-gray-500"
|
||||||
|
/>
|
||||||
|
</TooltipTrigger>
|
||||||
|
<TooltipPortal>
|
||||||
|
<TooltipContent
|
||||||
|
side="top"
|
||||||
|
className="max-w-[240px]"
|
||||||
|
>
|
||||||
|
<span>
|
||||||
|
Vector Database is crucial for efficient
|
||||||
|
storage and retrieval of embeddings.
|
||||||
|
Consider your specific task, available
|
||||||
|
resources, and language requirements.
|
||||||
|
Experiment to find the best fit for your
|
||||||
|
specific use case.
|
||||||
|
</span>
|
||||||
|
<TooltipArrow />
|
||||||
|
</TooltipContent>
|
||||||
|
</TooltipPortal>
|
||||||
|
</Tooltip>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="flex items-center justify-between">
|
||||||
|
<Input value="HNSWLib" disabled />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<AssistantSetting
|
||||||
|
componentData={componentDataAssistantSetting}
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
{activeThread?.assistants[0]?.tools[0].enabled && (
|
)}
|
||||||
<div className="pb-4 pt-2">
|
</div>
|
||||||
<div className="mb-4">
|
</CardSidebar>
|
||||||
<div className="item-center mb-2 flex">
|
|
||||||
<label
|
|
||||||
id="embedding-model"
|
|
||||||
className="inline-flex font-bold text-zinc-500 dark:text-gray-300"
|
|
||||||
>
|
|
||||||
Embedding Model
|
|
||||||
</label>
|
|
||||||
<Tooltip>
|
|
||||||
<TooltipTrigger asChild>
|
|
||||||
<InfoIcon
|
|
||||||
size={16}
|
|
||||||
className="ml-2 flex-shrink-0 dark:text-gray-500"
|
|
||||||
/>
|
|
||||||
</TooltipTrigger>
|
|
||||||
<TooltipPortal>
|
|
||||||
<TooltipContent
|
|
||||||
side="top"
|
|
||||||
className="max-w-[240px]"
|
|
||||||
>
|
|
||||||
<span>
|
|
||||||
Embedding model is crucial for
|
|
||||||
understanding and processing the input
|
|
||||||
text effectively by converting text to
|
|
||||||
numerical representations. Align the model
|
|
||||||
choice with your task, evaluate its
|
|
||||||
performance, and consider factors like
|
|
||||||
resource availability. Experiment to find
|
|
||||||
the best fit for your specific use case.
|
|
||||||
</span>
|
|
||||||
<TooltipArrow />
|
|
||||||
</TooltipContent>
|
|
||||||
</TooltipPortal>
|
|
||||||
</Tooltip>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="flex items-center justify-between">
|
|
||||||
<Input value={selectedModel?.name} disabled />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="mb-4">
|
|
||||||
<div className="mb-2 flex items-center">
|
|
||||||
<label
|
|
||||||
id="vector-database"
|
|
||||||
className="inline-block font-bold text-zinc-500 dark:text-gray-300"
|
|
||||||
>
|
|
||||||
Vector Database
|
|
||||||
</label>
|
|
||||||
<Tooltip>
|
|
||||||
<TooltipTrigger asChild>
|
|
||||||
<InfoIcon
|
|
||||||
size={16}
|
|
||||||
className="ml-2 flex-shrink-0 dark:text-gray-500"
|
|
||||||
/>
|
|
||||||
</TooltipTrigger>
|
|
||||||
<TooltipPortal>
|
|
||||||
<TooltipContent
|
|
||||||
side="top"
|
|
||||||
className="max-w-[240px]"
|
|
||||||
>
|
|
||||||
<span>
|
|
||||||
Vector Database is crucial for efficient
|
|
||||||
storage and retrieval of embeddings.
|
|
||||||
Consider your specific task, available
|
|
||||||
resources, and language requirements.
|
|
||||||
Experiment to find the best fit for your
|
|
||||||
specific use case.
|
|
||||||
</span>
|
|
||||||
<TooltipArrow />
|
|
||||||
</TooltipContent>
|
|
||||||
</TooltipPortal>
|
|
||||||
</Tooltip>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="flex items-center justify-between">
|
|
||||||
<Input value="HNSWLib" disabled />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<AssistantSetting
|
|
||||||
componentData={componentDataAssistantSetting}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</CardSidebar>
|
|
||||||
</div>
|
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user