feat: add connection title field

This commit is contained in:
steven
2023-04-18 11:27:27 +08:00
parent 911c801f04
commit 66320c892d
3 changed files with 23 additions and 17 deletions

View File

@ -175,24 +175,25 @@ const ConnectionSidebar = () => {
<img src="/chat-logo-bot.webp" className="w-7 h-auto mx-auto" alt="" />
</button>
{connectionList.map((connection) => (
<button
key={connection.id}
className={`relative w-full h-14 rounded-l-lg p-2 mt-2 group ${
currentConnectionCtx?.connection.id === connection.id && "bg-gray-100 dark:bg-zinc-700 shadow"
}`}
onClick={() => handleConnectionSelect(connection)}
>
<span
className="absolute right-0.5 -mt-1.5 opacity-60 hidden group-hover:block hover:opacity-80"
onClick={(e) => {
e.stopPropagation();
handleEditConnection(connection);
}}
<Tooltip key={connection.id} title={connection.title} side="right">
<button
className={`relative w-full h-14 rounded-l-lg p-2 mt-2 group ${
currentConnectionCtx?.connection.id === connection.id && "bg-gray-100 dark:bg-zinc-700 shadow"
}`}
onClick={() => handleConnectionSelect(connection)}
>
<Icon.FiEdit3 className="w-3.5 h-auto dark:text-gray-300" />
</span>
<EngineIcon engine={connection.engineType} className="w-auto h-full mx-auto dark:text-gray-300" />
</button>
<span
className="absolute right-0.5 -mt-1.5 opacity-60 hidden group-hover:block hover:opacity-80"
onClick={(e) => {
e.stopPropagation();
handleEditConnection(connection);
}}
>
<Icon.FiEdit3 className="w-3.5 h-auto dark:text-gray-300" />
</span>
<EngineIcon engine={connection.engineType} className="w-auto h-full mx-auto dark:text-gray-300" />
</button>
</Tooltip>
))}
<Tooltip title={t("connection.new")} side="right">
<button

View File

@ -217,6 +217,10 @@ const CreateConnectionModal = (props: Props) => {
onValueChange={(value) => setPartialConnection({ engineType: value as Engine })}
/>
</div>
<div className="w-full flex flex-col">
<label className="block text-sm font-medium text-gray-700 mb-1">Title</label>
<TextField placeholder="Title" value={connection.title} onChange={(value) => setPartialConnection({ title: value })} />
</div>
<div className="w-full flex flex-col">
<label className="block text-sm font-medium text-gray-700 mb-1">Host</label>
<TextField placeholder="Connect host" value={connection.host} onChange={(value) => setPartialConnection({ host: value })} />

View File

@ -20,6 +20,7 @@ const Tooltip = (props: Props) => {
className="bg-zinc-800 text-gray-200 dark:bg-black text-sm p-1 px-2 rounded-md z-[99999]"
side={side}
sideOffset={6}
hidden={title === ""}
>
{title}
<TooltipUI.Arrow />