refactor(bot-toggle): inline Bot panel config and remove DefaultDockviewOptions dependency

This commit is contained in:
cfngc4594 2025-04-13 11:41:58 +08:00
parent 56782b83fc
commit 0de139f29c

View File

@ -9,19 +9,13 @@ import {
import { BotIcon } from "lucide-react"; import { BotIcon } from "lucide-react";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { Toggle } from "@/components/ui/toggle"; import { Toggle } from "@/components/ui/toggle";
import { Skeleton } from "@/components/ui/skeleton";
import { useDockviewStore } from "@/stores/dockview"; import { useDockviewStore } from "@/stores/dockview";
import { DefaultDockviewOptions } from "@/config/dockview";
export default function BotVisibilityToggle() { export default function BotVisibilityToggle() {
const { api } = useDockviewStore(); const { api } = useDockviewStore();
const [isLoading, setIsLoading] = useState<boolean>(true); const [isLoading, setIsLoading] = useState<boolean>(true);
const [isBotVisible, setBotVisible] = useState<boolean>(false); const [isBotVisible, setBotVisible] = useState<boolean>(false);
const botOption = DefaultDockviewOptions.find(
(option) => option.id === "Bot"
);
useEffect(() => { useEffect(() => {
if (api) { if (api) {
const panel = api.getPanel("Bot"); const panel = api.getPanel("Bot");
@ -31,7 +25,6 @@ export default function BotVisibilityToggle() {
}, [api]); }, [api]);
const handleBotToggle = (newState: boolean) => { const handleBotToggle = (newState: boolean) => {
setBotVisible(newState);
if (!api) return; if (!api) return;
const panel = api.getPanel("Bot"); const panel = api.getPanel("Bot");
@ -39,14 +32,24 @@ export default function BotVisibilityToggle() {
if (newState) { if (newState) {
if (panel) { if (panel) {
panel.api.setActive(); panel.api.setActive();
} else if (botOption) { } else {
api.addPanel(botOption).api.setActive(); api.addPanel({
id: "Bot",
component: "Bot",
tabComponent: "Bot",
title: "Bot",
position: {
direction: "right",
},
});
} }
} else { } else {
if (panel) { if (panel) {
api.removePanel(panel); api.removePanel(panel);
} }
} }
setBotVisible(newState);
}; };
return ( return (
@ -54,19 +57,16 @@ export default function BotVisibilityToggle() {
<Tooltip> <Tooltip>
<TooltipTrigger asChild> <TooltipTrigger asChild>
<div> <div>
{isLoading ? ( <Toggle
<Skeleton className="h-8 w-8 rounded-lg" /> aria-label="Toggle bot"
) : ( pressed={isBotVisible}
<Toggle onPressedChange={handleBotToggle}
aria-label="Toggle bot" size="sm"
pressed={isBotVisible} className="rounded-lg"
onPressedChange={handleBotToggle} disabled={isLoading}
size="sm" >
className="rounded-lg" <BotIcon size={16} aria-hidden="true" />
> </Toggle>
<BotIcon size={16} aria-hidden="true" />
</Toggle>
)}
</div> </div>
</TooltipTrigger> </TooltipTrigger>
<TooltipContent className="px-2 py-1 text-xs"> <TooltipContent className="px-2 py-1 text-xs">