archive/yaklang-chrome-extension
1
0
Fork 0
mirror of https://github.com/yaklang/yaklang-chrome-extension.git synced 2026-09-26 21:21:53 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Improve ProxySwitch menu item visual feedback with selected state indicators

Browse Source
This commit is contained in:
go0p
2026-08-06 15:11:35 +08:00
committed by go0p
parent d0819fccc2
commit d570a3a3ee
1 changed files with 8 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/ProxySwitch/index.tsx
+8 -4
View File
@@ -237,21 +237,25 @@ export const ProxySwitch: React.FC<ProxySwitchProps> = () => {
const menuItems: MenuProps['items'] = [ const menuItems: MenuProps['items'] = [
...FIXED_MODES.map(mode => ({ ...FIXED_MODES.map(mode => ({
key: mode.key, key: mode.key,
icon: <span className="menu-icon" style={{ color: mode.color }}>{mode.icon}</span>, icon: <span className="menu-icon" style={{
label: mode.name, color: currentMode === mode.key ? 'var(--yakit-primary)' : mode.color
}}>{mode.icon}</span>,
label: `${mode.name}${currentMode === mode.key ? ' ✅' : ''}`,
className: `${currentMode === mode.key ? 'menu-item-selected' : ''} ${isLoading ? 'menu-item-loading' : ''}`, className: `${currentMode === mode.key ? 'menu-item-selected' : ''} ${isLoading ? 'menu-item-loading' : ''}`,
title: mode.name.replace(/[\[\]]/g, '') title: mode.name.replace(/[\[\]]/g, '')
})), })),
{ type: 'divider' }, { type: 'divider' },
...customProxies.map(proxy => ({ ...customProxies.map(proxy => ({
key: proxy.key, key: proxy.key,
icon: <span className="menu-icon" style={{ color: proxy.color }}> icon: <span className="menu-icon" style={{
color: currentMode === proxy.key ? 'var(--yakit-primary)' : proxy.color
}}>
{proxy.config.proxyType === 'pac_script' ? '📜' : <GlobalOutlined />} {proxy.config.proxyType === 'pac_script' ? '📜' : <GlobalOutlined />}
</span>, </span>,
label: <span style={{ label: <span style={{
color: currentMode === proxy.key ? 'var(--yakit-primary)' : 'inherit', color: currentMode === proxy.key ? 'var(--yakit-primary)' : 'inherit',
opacity: isLoading ? 0.7 : 1 opacity: isLoading ? 0.7 : 1
}}>{proxy.name}</span>, }}>{proxy.name}{currentMode === proxy.key ? ' ✅' : ''}</span>,
className: `${currentMode === proxy.key ? 'menu-item-selected' : ''} ${isLoading ? 'menu-item-loading' : ''}`, className: `${currentMode === proxy.key ? 'menu-item-selected' : ''} ${isLoading ? 'menu-item-loading' : ''}`,
title: proxy.config.scheme title: proxy.config.scheme
? `${proxy.config.scheme.toUpperCase()} ${proxy.config.host}:${proxy.config.port}` ? `${proxy.config.scheme.toUpperCase()} ${proxy.config.host}:${proxy.config.port}`