d8dfun/claudecodeui
1
0
Fork 0
mirror of https://github.com/siteboon/claudecodeui.git synced 2026-07-01 18:13:03 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(settings): refine Hermes account actions

Browse Source
This commit is contained in:
Simos Mikelatos
2026-06-30 23:19:24 +00:00
parent 7c6d00ee93
commit 655501faba
1 changed files with 31 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
src/components/settings/view/tabs/agents-settings/sections/content/AccountContent.tsx
View File

@@ -2,6 +2,7 @@ import {
KeyRound, KeyRound,
Layers3, Layers3,
LogIn, LogIn,
type LucideIcon,
} from 'lucide-react'; } from 'lucide-react';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
@@ -81,22 +82,25 @@ const agentConfig: Record<AgentProvider, AgentVisualConfig> = {
type HermesAction = { type HermesAction = {
label: string; label: string;
buttonLabel: string;
description: string; description: string;
command: string; command: string;
title: string; title: string;
icon: typeof Layers3; icon: LucideIcon;
}; };
const hermesActions: HermesAction[] = [ const hermesActions: HermesAction[] = [
{ {
label: 'Configure model', label: 'Model',
buttonLabel: 'Configure',
description: 'Choose the provider and model Hermes should use.', description: 'Choose the provider and model Hermes should use.',
command: 'hermes model', command: 'hermes model',
title: 'Configure Hermes Model', title: 'Configure Hermes Model',
icon: Layers3, icon: Layers3,
}, },
{ {
label: 'Manage credentials', label: 'Credentials',
buttonLabel: 'Manage',
description: 'Update credential pools and API keys.', description: 'Update credential pools and API keys.',
command: 'hermes auth', command: 'hermes auth',
title: 'Hermes Credentials', title: 'Hermes Credentials',
@@ -136,32 +140,35 @@ export default function AccountContent({ agent, authStatus, onLogin }: AccountCo
})} })}
</div> </div>
</div> </div>
<div className="grid gap-2 md:grid-cols-2"> <div className="overflow-hidden rounded-lg border border-border/60 bg-background/70">
{hermesActions.map((action, index) => { {hermesActions.map((action, index) => {
const Icon = action.icon; const Icon = action.icon;
const isPrimary = index === 0;
return ( return (
<Button <div
key={action.command} key={action.command}
type="button" className={`flex flex-col gap-3 px-3 py-3 sm:flex-row sm:items-center sm:justify-between ${
variant={isPrimary ? 'default' : 'outline'} index > 0 ? 'border-t border-border/60' : ''
className={ }`}
isPrimary
? `${config.buttonClass} h-auto justify-start gap-3 px-3 py-2 text-left text-white`
: 'h-auto justify-start gap-3 border-border/70 bg-background/70 px-3 py-2 text-left'
}
onClick={() => onLogin(action.command, action.title)}
> >
<Icon className="h-4 w-4 flex-shrink-0" /> <div className="flex min-w-0 items-start gap-3">
<span className="min-w-0"> <div className="mt-0.5 flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-md bg-muted/60 text-muted-foreground">
<span className={isPrimary ? 'block text-sm font-medium text-white' : 'block text-sm font-medium text-foreground'}> <Icon className="h-4 w-4" />
{action.label} </div>
</span> <div className="min-w-0">
<span className={isPrimary ? 'block text-xs text-white/80' : 'block text-xs text-muted-foreground'}> <div className="text-sm font-medium text-foreground">{action.label}</div>
{action.description} <div className="mt-0.5 text-sm text-muted-foreground">{action.description}</div>
</span> </div>
</span> </div>
</Button> <Button
type="button"
variant={index === 0 ? 'default' : 'outline'}
size="sm"
className={index === 0 ? `${config.buttonClass} w-full text-white sm:w-auto` : 'w-full sm:w-auto'}
onClick={() => onLogin(action.command, action.title)}
>
{action.buttonLabel}
</Button>
</div>
); );
})} })}
</div> </div>