fix(accounts-ui): remove extra left-column wrapper layers

This commit is contained in:
Tam Nhu Tran committed 2026-02-26 21:20:35 +07:00
1 parent 7fccb1843d
commit 5996f9df7a
1 file changed
+115 -127
+115 -127
View File
@@ -60,9 +60,6 @@ export function AccountsPage() {
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<Users className="h-5 w-5 text-primary" /> <Users className="h-5 w-5 text-primary" />
<h1 className="font-semibold">Accounts</h1> <h1 className="font-semibold">Accounts</h1>
<Badge variant="outline" className="ml-auto">
Action Center
</Badge>
</div> </div>
<p className="text-xs text-muted-foreground"> <p className="text-xs text-muted-foreground">
Manage Manage
@@ -73,149 +70,140 @@ export function AccountsPage() {
<ScrollArea className="flex-1"> <ScrollArea className="flex-1">
<div className="p-4 space-y-3"> <div className="p-4 space-y-3">
<Card> <div className="space-y-2">
<CardHeader className="pb-2"> <p className="text-[11px] font-medium uppercase tracking-wide text-muted-foreground">
<CardTitle className="text-sm">Action Center</CardTitle> Primary Actions
<CardDescription> </p>
Primary actions plus migration status in one place. <Button
</CardDescription> size="sm"
</CardHeader> className="w-full justify-start"
<CardContent className="space-y-3"> onClick={() => setCreateDialogOpen(true)}
<div className="space-y-2"> >
<p className="text-[11px] font-medium uppercase tracking-wide text-muted-foreground"> <Plus className="w-4 h-4 mr-2" />
Primary Actions Create Account
</p> </Button>
<Button
size="sm"
className="w-full justify-start"
onClick={handleOpenClaudePoolAuth}
>
<Zap className="w-4 h-4 mr-2" />
Authenticate Claude in Pool
</Button>
<Button
variant="outline"
size="sm"
className="w-full justify-start"
onClick={handleOpenClaudePool}
>
Open Claude Pool Settings
<ArrowRight className="w-4 h-4 ml-auto" />
</Button>
</div>
{hasLegacyFollowUp ? (
<section className="space-y-2">
<p className="text-[11px] font-medium uppercase tracking-wide text-muted-foreground">
Migration Follow-up
</p>
<div className="rounded-md border border-amber-500/50 bg-amber-500/10 p-3 space-y-3">
<div className="flex items-start gap-2">
<AlertTriangle className="h-4 w-4 mt-0.5 text-amber-700 dark:text-amber-400 shrink-0" />
<div className="space-y-1 text-xs">
{legacyContextCount > 0 && (
<p className="text-amber-800 dark:text-amber-300">
{legacyContextCount} account
{legacyContextCount > 1 ? 's still need' : ' still needs'} first-time
mode confirmation.
</p>
)}
{legacyContinuityCount > 0 && (
<p className="text-amber-800 dark:text-amber-300">
{legacyContinuityCount} shared account
{legacyContinuityCount > 1 ? 's remain' : ' remains'} on standard legacy
continuity depth.
</p>
)}
</div>
</div>
<Button <Button
variant="secondary"
size="sm" size="sm"
className="w-full justify-start" className="w-full justify-start"
onClick={() => setCreateDialogOpen(true)} onClick={handleConfirmLegacy}
disabled={confirmLegacyMutation.isPending || legacyTargetCount === 0}
> >
<Plus className="w-4 h-4 mr-2" /> {confirmLegacyMutation.isPending
Create Account ? 'Confirming Legacy Policies...'
</Button> : `Confirm Legacy Policies (${legacyTargetCount})`}
<Button
size="sm"
className="w-full justify-start"
onClick={handleOpenClaudePoolAuth}
>
<Zap className="w-4 h-4 mr-2" />
Authenticate Claude in Pool
</Button>
<Button
variant="outline"
size="sm"
className="w-full justify-start"
onClick={handleOpenClaudePool}
>
Open Claude Pool Settings
<ArrowRight className="w-4 h-4 ml-auto" />
</Button> </Button>
</div> </div>
</section>
) : (
<div className="rounded-md border bg-background px-3 py-2 text-xs text-muted-foreground">
No legacy follow-up pending.
</div>
)}
<div className="border-t pt-3 space-y-2"> <Collapsible open={guideOpen} onOpenChange={setGuideOpen}>
<p className="text-[11px] font-medium uppercase tracking-wide text-muted-foreground"> <Card>
Legacy Migration <CardHeader className="pb-2">
</p>
{hasLegacyFollowUp ? (
<div className="rounded-md border border-amber-500/50 bg-amber-500/10 p-3 space-y-3">
<div className="flex items-start gap-2">
<AlertTriangle className="h-4 w-4 mt-0.5 text-amber-700 dark:text-amber-400 shrink-0" />
<div className="space-y-1 text-xs">
{legacyContextCount > 0 && (
<p className="text-amber-800 dark:text-amber-300">
{legacyContextCount} account
{legacyContextCount > 1 ? 's still need' : ' still needs'}{' '}
first-time mode confirmation.
</p>
)}
{legacyContinuityCount > 0 && (
<p className="text-amber-800 dark:text-amber-300">
{legacyContinuityCount} shared account
{legacyContinuityCount > 1 ? 's remain' : ' remains'} on standard
legacy continuity depth.
</p>
)}
</div>
</div>
<Button
variant="secondary"
size="sm"
className="w-full justify-start"
onClick={handleConfirmLegacy}
disabled={confirmLegacyMutation.isPending || legacyTargetCount === 0}
>
{confirmLegacyMutation.isPending
? 'Confirming Legacy Policies...'
: `Confirm Legacy Policies (${legacyTargetCount})`}
</Button>
</div>
) : (
<div className="rounded-md border bg-muted/30 px-3 py-2 text-xs text-muted-foreground">
No legacy follow-up pending.
</div>
)}
</div>
</CardContent>
</Card>
<Card>
<CardHeader className="pb-2">
<CardTitle className="text-sm">Guide & Commands</CardTitle>
<CardDescription>Continuity modes and CLI shortcuts.</CardDescription>
</CardHeader>
<CardContent className="space-y-3">
<Collapsible open={guideOpen} onOpenChange={setGuideOpen}>
<CollapsibleTrigger asChild> <CollapsibleTrigger asChild>
<Button variant="ghost" className="h-auto w-full justify-between px-0 py-0"> <Button variant="ghost" className="h-auto w-full justify-between px-0 py-0">
<div className="text-left"> <div className="text-left">
<p className="text-sm font-semibold">Continuity Guide</p> <CardTitle className="text-sm">Continuity Guide</CardTitle>
<p className="mt-1 text-xs text-muted-foreground"> <CardDescription className="mt-1">
Expand only when needed. Expand only when needed.
</p> </CardDescription>
</div> </div>
<ChevronDown <ChevronDown
className={cn('h-4 w-4 transition-transform', guideOpen && 'rotate-180')} className={cn('h-4 w-4 transition-transform', guideOpen && 'rotate-180')}
/> />
</Button> </Button>
</CollapsibleTrigger> </CollapsibleTrigger>
<CollapsibleContent className="pt-2"> </CardHeader>
<div className="space-y-2 text-xs text-muted-foreground"> <CollapsibleContent>
<div className="rounded-md border p-2.5"> <CardContent className="space-y-3 text-xs text-muted-foreground">
<p className="font-semibold text-foreground">Shared Standard</p> <div className="rounded-md border p-2.5">
<p className="mt-1"> <p className="font-semibold text-foreground">Shared Standard</p>
Project workspace sync only. Best default for most teams. <p className="mt-1">
</p> Project workspace sync only. Best default for most teams.
</div> </p>
<div className="rounded-md border p-2.5">
<p className="font-semibold text-foreground">Shared Deeper</p>
<p className="mt-1">
Adds <code>session-env</code>, <code>file-history</code>,{' '}
<code>shell-snapshots</code>, <code>todos</code>.
</p>
</div>
<div className="rounded-md border p-2.5">
<p className="font-semibold text-foreground">Isolated</p>
<p className="mt-1">No link. Best for strict separation.</p>
</div>
</div> </div>
</CollapsibleContent> <div className="rounded-md border p-2.5">
</Collapsible> <p className="font-semibold text-foreground">Shared Deeper</p>
<p className="mt-1">
Adds <code>session-env</code>, <code>file-history</code>,{' '}
<code>shell-snapshots</code>, <code>todos</code>.
</p>
</div>
<div className="rounded-md border p-2.5">
<p className="font-semibold text-foreground">Isolated</p>
<p className="mt-1">No link. Best for strict separation.</p>
</div>
</CardContent>
</CollapsibleContent>
</Card>
</Collapsible>
<div className="space-y-2"> <Card>
<p className="text-xs font-semibold">Quick Commands</p> <CardHeader className="pb-2">
<div className="rounded-md border bg-background px-2 py-2 font-mono text-[11px] flex items-start gap-2"> <CardTitle className="text-sm">Quick Commands</CardTitle>
<span className="flex-1 break-all"> <CardDescription>Copy and run in terminal.</CardDescription>
ccs auth create work --context-group sprint-a --deeper-continuity </CardHeader>
</span> <CardContent className="space-y-2">
<CopyButton <div className="rounded-md border bg-background px-2 py-2 font-mono text-[11px] flex items-start gap-2">
value="ccs auth create work --context-group sprint-a --deeper-continuity" <span className="flex-1 break-all">
size="icon" ccs auth create work --context-group sprint-a --deeper-continuity
/> </span>
</div> <CopyButton
<div className="rounded-md border bg-background px-2 py-2 font-mono text-[11px] flex items-start gap-2"> value="ccs auth create work --context-group sprint-a --deeper-continuity"
<span className="flex-1 break-all">ccs cliproxy auth claude</span> size="icon"
<CopyButton value="ccs cliproxy auth claude" size="icon" /> />
</div> </div>
<div className="rounded-md border bg-background px-2 py-2 font-mono text-[11px] flex items-start gap-2">
<span className="flex-1 break-all">ccs cliproxy auth claude</span>
<CopyButton value="ccs cliproxy auth claude" size="icon" />
</div> </div>
</CardContent> </CardContent>
</Card> </Card>