fix: 侧栏插件图标对齐宿主灰阶(text-ink-2);插件行右列重排——入口/启动/重载三行,文案改「启动/关闭」,重载为 lucide 刷新按钮

This commit is contained in:
Rick Ye
2026-09-11 11:20:08 +08:00
parent f1cbe764bb
commit ef07c2db2c
2 changed files with 43 additions and 19 deletions
@@ -10,6 +10,7 @@ import {
LuLogOut,
LuPlus,
LuPuzzle,
LuRefreshCw,
LuSearch,
LuSettings2,
LuSparkles,
@@ -652,6 +653,8 @@ function PluginsPanel({
}): ReactNode {
const plugins = usePluginList()
const [scope, setScope] = useState<'user' | 'project' | 'builtin'>('user')
/** 全局插件重载进行中(重扫目录 + 重建运行时;期间刷新按钮禁用旋转) */
const [reloading, setReloading] = useState(false)
const [dirs, setDirs] = useState<{ user: string[]; project: string[]; global: string[] }>({
user: [],
project: [],
@@ -768,24 +771,6 @@ function PluginsPanel({
onClick={(e) => e.stopPropagation()}
onKeyDown={(e) => e.stopPropagation()}
>
<div className="flex items-center gap-2">
<span className="text-[11px] text-ink-3">{p.enabled ? '已启动' : '已关闭'}</span>
<button
type="button"
role="switch"
aria-checked={p.enabled}
aria-label={`启用${p.manifest.name}`}
disabled={togglingId !== null}
onClick={() => onToggle(p, !p.enabled)}
className={`relative h-6 w-10 shrink-0 rounded-full transition-colors disabled:cursor-not-allowed disabled:opacity-50 ${
p.enabled ? 'bg-accent' : 'bg-line-strong'
}`}
>
<span
className={`absolute top-0.5 size-5 rounded-full bg-white shadow transition-[left] ${p.enabled ? 'left-[18px]' : 'left-0.5'}`}
/>
</button>
</div>
{p.hasSettings && p.enabled && (
<div className="flex items-center gap-2">
<span className="text-[11px] text-ink-3">入口</span>
@@ -806,6 +791,45 @@ function PluginsPanel({
</button>
</div>
)}
<div className="flex items-center gap-2">
<span className="text-[11px] text-ink-3">{p.enabled ? '启动' : '关闭'}</span>
<button
type="button"
role="switch"
aria-checked={p.enabled}
aria-label={`启用${p.manifest.name}`}
disabled={togglingId !== null}
onClick={() => onToggle(p, !p.enabled)}
className={`relative h-6 w-10 shrink-0 rounded-full transition-colors disabled:cursor-not-allowed disabled:opacity-50 ${
p.enabled ? 'bg-accent' : 'bg-line-strong'
}`}
>
<span
className={`absolute top-0.5 size-5 rounded-full bg-white shadow transition-[left] ${p.enabled ? 'left-[18px]' : 'left-0.5'}`}
/>
</button>
</div>
{p.source === 'external' && (
<div className="flex items-center gap-2">
<span className="text-[11px] text-ink-3">重载</span>
<button
type="button"
aria-label={`重载${p.manifest.name}`}
title="重扫插件目录并重建运行时(重载期间所有开关短暂禁用)"
disabled={reloading}
onClick={() => {
setReloading(true)
window.api
.pluginsReload()
.catch(() => undefined)
.finally(() => setReloading(false))
}}
className="flex size-6 shrink-0 items-center justify-center rounded-control text-ink-3 transition-colors hover:bg-hover hover:text-ink-2 disabled:opacity-50"
>
<LuRefreshCw size={12} className={reloading ? 'animate-spin' : undefined} />
</button>
</div>
)}
</div>
</div>
)
@@ -444,7 +444,7 @@ export function SidebarNav({
onClick={() => onOpenPlugin(plugin.manifest.id)}
className={`${navRowClass} ${active ? 'bg-hover-2 text-ink' : ''}`}
>
<span className="flex size-5 shrink-0 items-center justify-center">
<span className="flex size-5 shrink-0 items-center justify-center text-ink-2">
<PluginIconValue icon={plugin.manifest.icon} size={18} />
</span>
<span className="sidebar-copy ml-1.5 min-w-0 flex-1 truncate text-[13px] font-medium text-ink-3">