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,
|
||||
hideMoreVerticalAction,
|
||||
}: Props) {
|
||||
const [show, setShow] = useState(true)
|
||||
const [show, setShow] = useState(false)
|
||||
const [more, setMore] = useState(false)
|
||||
const [menu, setMenu] = useState<HTMLDivElement | null>(null)
|
||||
const [toggle, setToggle] = useState<HTMLDivElement | null>(null)
|
||||
|
||||
@ -156,21 +156,87 @@ const Sidebar: React.FC = () => {
|
||||
<div>
|
||||
{activeThread?.assistants[0]?.tools &&
|
||||
componentDataAssistantSetting.length > 0 && (
|
||||
<div className="mt-2">
|
||||
<CardSidebar title="Tools">
|
||||
<div className="px-2 pt-4">
|
||||
<div className="mb-2">
|
||||
<CardSidebar title="Tools">
|
||||
<div className="px-2 pt-4">
|
||||
<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">
|
||||
<label
|
||||
id="retrieval"
|
||||
className="inline-flex items-center font-bold text-zinc-500 dark:text-gray-300"
|
||||
>
|
||||
Retrieval
|
||||
<Switch
|
||||
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>
|
||||
{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>
|
||||
<TooltipTrigger asChild>
|
||||
<InfoIcon
|
||||
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>
|
||||
<TooltipPortal>
|
||||
@ -179,140 +245,70 @@ const Sidebar: React.FC = () => {
|
||||
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.
|
||||
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>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center justify-between">
|
||||
<Switch
|
||||
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) ??
|
||||
{},
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
})
|
||||
}}
|
||||
/>
|
||||
<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>
|
||||
{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>
|
||||
<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>
|
||||
</CardSidebar>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user