Compare commits

...

1 Commits

Author SHA1 Message Date
4889dd974f Change auth mode and Bedrock method selectors from button lists to dropdowns
Some checks failed
Build App / build-macos (push) Failing after 1s
Build App / build-windows (push) Successful in 4m4s
Build App / sync-to-github (push) Has been cancelled
Build App / build-linux (push) Has been cancelled
The horizontal button lists overflowed the viewable area of the card. Replace
with <select> dropdowns for both the main auth mode and the Bedrock sub-method.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-12 07:18:47 -07:00

View File

@@ -449,50 +449,18 @@ export default function ProjectCard({ project }: Props) {
{/* Auth mode selector */} {/* Auth mode selector */}
<div className="flex items-center gap-1 text-xs"> <div className="flex items-center gap-1 text-xs">
<span className="text-[var(--text-secondary)] mr-1">Auth:</span> <span className="text-[var(--text-secondary)] mr-1">Auth:</span>
<button <select
onClick={(e) => { e.stopPropagation(); handleAuthModeChange("anthropic"); }} value={project.auth_mode}
onChange={(e) => { e.stopPropagation(); handleAuthModeChange(e.target.value as AuthMode); }}
onClick={(e) => e.stopPropagation()}
disabled={!isStopped} disabled={!isStopped}
className={`px-2 py-0.5 rounded transition-colors ${ className="px-2 py-0.5 rounded bg-[var(--bg-primary)] border border-[var(--border-color)] text-xs text-[var(--text-primary)] focus:outline-none focus:border-[var(--accent)] disabled:opacity-50"
project.auth_mode === "anthropic"
? "bg-[var(--accent)] text-white"
: "text-[var(--text-secondary)] hover:text-[var(--text-primary)] hover:bg-[var(--bg-primary)]"
} disabled:opacity-50`}
> >
Anthropic <option value="anthropic">Anthropic</option>
</button> <option value="bedrock">Bedrock</option>
<button <option value="ollama">Ollama</option>
onClick={(e) => { e.stopPropagation(); handleAuthModeChange("bedrock"); }} <option value="lit_llm">LiteLLM</option>
disabled={!isStopped} </select>
className={`px-2 py-0.5 rounded transition-colors ${
project.auth_mode === "bedrock"
? "bg-[var(--accent)] text-white"
: "text-[var(--text-secondary)] hover:text-[var(--text-primary)] hover:bg-[var(--bg-primary)]"
} disabled:opacity-50`}
>
Bedrock
</button>
<button
onClick={(e) => { e.stopPropagation(); handleAuthModeChange("ollama"); }}
disabled={!isStopped}
className={`px-2 py-0.5 rounded transition-colors ${
project.auth_mode === "ollama"
? "bg-[var(--accent)] text-white"
: "text-[var(--text-secondary)] hover:text-[var(--text-primary)] hover:bg-[var(--bg-primary)]"
} disabled:opacity-50`}
>
Ollama
</button>
<button
onClick={(e) => { e.stopPropagation(); handleAuthModeChange("lit_llm"); }}
disabled={!isStopped}
className={`px-2 py-0.5 rounded transition-colors ${
project.auth_mode === "lit_llm"
? "bg-[var(--accent)] text-white"
: "text-[var(--text-secondary)] hover:text-[var(--text-primary)] hover:bg-[var(--bg-primary)]"
} disabled:opacity-50`}
>
LiteLLM
</button>
</div> </div>
{/* Action buttons */} {/* Action buttons */}
@@ -836,20 +804,17 @@ export default function ProjectCard({ project }: Props) {
{/* Sub-method selector */} {/* Sub-method selector */}
<div className="flex items-center gap-1 text-xs"> <div className="flex items-center gap-1 text-xs">
<span className="text-[var(--text-secondary)] mr-1">Method:</span> <span className="text-[var(--text-secondary)] mr-1">Method:</span>
{(["static_credentials", "profile", "bearer_token"] as BedrockAuthMethod[]).map((m) => ( <select
<button value={bc.auth_method}
key={m} onChange={(e) => updateBedrockConfig({ auth_method: e.target.value as BedrockAuthMethod })}
onClick={() => updateBedrockConfig({ auth_method: m })} onClick={(e) => e.stopPropagation()}
disabled={!isStopped} disabled={!isStopped}
className={`px-2 py-0.5 rounded transition-colors ${ className="px-2 py-0.5 rounded bg-[var(--bg-primary)] border border-[var(--border-color)] text-xs text-[var(--text-primary)] focus:outline-none focus:border-[var(--accent)] disabled:opacity-50"
bc.auth_method === m >
? "bg-[var(--accent)] text-white" <option value="static_credentials">Keys</option>
: "text-[var(--text-secondary)] hover:text-[var(--text-primary)] hover:bg-[var(--bg-primary)]" <option value="profile">Profile</option>
} disabled:opacity-50`} <option value="bearer_token">Token</option>
> </select>
{m === "static_credentials" ? "Keys" : m === "profile" ? "Profile" : "Token"}
</button>
))}
</div> </div>
{/* AWS Region (always shown) */} {/* AWS Region (always shown) */}