fix: 侧栏插件图标对齐宿主灰阶(text-ink-2);插件行右列重排——入口/启动/重载三行,文案改「启动/关闭」,重载为 lucide 刷新按钮
This commit is contained in:
@@ -10,6 +10,7 @@ import {
|
|||||||
LuLogOut,
|
LuLogOut,
|
||||||
LuPlus,
|
LuPlus,
|
||||||
LuPuzzle,
|
LuPuzzle,
|
||||||
|
LuRefreshCw,
|
||||||
LuSearch,
|
LuSearch,
|
||||||
LuSettings2,
|
LuSettings2,
|
||||||
LuSparkles,
|
LuSparkles,
|
||||||
@@ -652,6 +653,8 @@ function PluginsPanel({
|
|||||||
}): ReactNode {
|
}): ReactNode {
|
||||||
const plugins = usePluginList()
|
const plugins = usePluginList()
|
||||||
const [scope, setScope] = useState<'user' | 'project' | 'builtin'>('user')
|
const [scope, setScope] = useState<'user' | 'project' | 'builtin'>('user')
|
||||||
|
/** 全局插件重载进行中(重扫目录 + 重建运行时;期间刷新按钮禁用旋转) */
|
||||||
|
const [reloading, setReloading] = useState(false)
|
||||||
const [dirs, setDirs] = useState<{ user: string[]; project: string[]; global: string[] }>({
|
const [dirs, setDirs] = useState<{ user: string[]; project: string[]; global: string[] }>({
|
||||||
user: [],
|
user: [],
|
||||||
project: [],
|
project: [],
|
||||||
@@ -768,24 +771,6 @@ function PluginsPanel({
|
|||||||
onClick={(e) => e.stopPropagation()}
|
onClick={(e) => e.stopPropagation()}
|
||||||
onKeyDown={(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 && (
|
{p.hasSettings && p.enabled && (
|
||||||
<div className="flex items-center gap-2">
|
<div className="flex items-center gap-2">
|
||||||
<span className="text-[11px] text-ink-3">入口</span>
|
<span className="text-[11px] text-ink-3">入口</span>
|
||||||
@@ -806,6 +791,45 @@ function PluginsPanel({
|
|||||||
</button>
|
</button>
|
||||||
</div>
|
</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>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
|
|||||||
@@ -444,7 +444,7 @@ export function SidebarNav({
|
|||||||
onClick={() => onOpenPlugin(plugin.manifest.id)}
|
onClick={() => onOpenPlugin(plugin.manifest.id)}
|
||||||
className={`${navRowClass} ${active ? 'bg-hover-2 text-ink' : ''}`}
|
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} />
|
<PluginIconValue icon={plugin.manifest.icon} size={18} />
|
||||||
</span>
|
</span>
|
||||||
<span className="sidebar-copy ml-1.5 min-w-0 flex-1 truncate text-[13px] font-medium text-ink-3">
|
<span className="sidebar-copy ml-1.5 min-w-0 flex-1 truncate text-[13px] font-medium text-ink-3">
|
||||||
|
|||||||
Reference in New Issue
Block a user