diff --git a/ui/src/components/cliproxy/provider-editor/account-item.tsx b/ui/src/components/cliproxy/provider-editor/account-item.tsx index aa19af3c..33ee1c46 100644 --- a/ui/src/components/cliproxy/provider-editor/account-item.tsx +++ b/ui/src/components/cliproxy/provider-editor/account-item.tsx @@ -6,8 +6,6 @@ import { Button } from '@/components/ui/button'; import { Badge } from '@/components/ui/badge'; import { Progress } from '@/components/ui/progress'; -import { Switch } from '@/components/ui/switch'; -import { Checkbox } from '@/components/ui/checkbox'; import { DropdownMenu, DropdownMenuContent, @@ -25,10 +23,10 @@ import { CheckCircle2, HelpCircle, Pause, + Play, AlertCircle, AlertTriangle, FolderCode, - Radio, } from 'lucide-react'; import { cn, @@ -95,15 +93,10 @@ export function AccountItem({ onSetDefault, onRemove, onPauseToggle, - onSoloMode, isRemoving, isPausingAccount, - isSoloingAccount, privacyMode, showQuota, - selectable, - selected, - onSelectChange, }: AccountItemProps) { // Fetch runtime stats to get actual lastUsedAt (more accurate than file state) const { data: stats } = useCliproxyStats(showQuota); @@ -131,18 +124,37 @@ export function AccountItem({ className={cn( 'flex flex-col gap-2 p-3 rounded-lg border transition-colors', account.isDefault ? 'border-primary/30 bg-primary/5' : 'border-border hover:bg-muted/30', - account.paused && 'opacity-50 border-muted' + account.paused && 'opacity-75' )} >
- {/* Multi-select checkbox */} - {selectable && ( - onSelectChange?.(!!checked)} - aria-label={`Select ${account.email || account.id}`} - /> + {/* Pause/Resume toggle button - visible left of avatar */} + {onPauseToggle && ( + + + + + + + {account.paused ? 'Resume account' : 'Pause account'} + + + )}
- {/* Inline controls: Solo button + Toggle switch */} -
- {/* Solo mode button */} - {onSoloMode && ( - - - - - - Activate only this account - - - )} - - {/* Pause/Resume toggle switch */} - {onPauseToggle && ( - - - -
- onPauseToggle(!checked)} - disabled={isPausingAccount} - aria-label={account.paused ? 'Resume account' : 'Pause account'} - className="scale-90" - /> -
-
- - {account.paused ? 'Resume account' : 'Pause account'} - -
-
- )} - - {/* Dropdown menu for other actions */} - - - - - - {!account.isDefault && ( - - - Set as default - - )} - - - {isRemoving ? 'Removing...' : 'Remove account'} + + + + + + {!account.isDefault && ( + + + Set as default - - -
+ )} + {onPauseToggle && ( + onPauseToggle(!account.paused)} + disabled={isPausingAccount} + > + {account.paused ? ( + <> + + {isPausingAccount ? 'Resuming...' : 'Resume account'} + + ) : ( + <> + + {isPausingAccount ? 'Pausing...' : 'Pause account'} + + )} + + )} + + + {isRemoving ? 'Removing...' : 'Remove account'} + + +
{/* Quota bar - supports all providers with quota API */}