mirror of
https://github.com/nearai/ironclaw.git
synced 2026-09-02 23:56:24 +08:00
444bf6f4d1
* fix(web): match subdomains of private-chat-stg.near.ai as NEAR AI private endpoint
* fix(web): remove LLM provider restart notices now that hot-reload is supported
LLM provider changes (switch/add/configure/update) now apply without a
restart, so the inline "Changes take effect after restart" banner in the
LLM Providers section, the mirrored banner in the Inference settings
panel, and the "(restart to apply)" suffix on the provider toasts are
all stale. Drops the HTML banner, the dynamic mirror in settings.js,
the three show-calls in config.js, the now-unused .config-notice CSS,
the config.restartNotice i18n key, and the suffix from providerConfigured
/ providerActivated / providerAdded / providerUpdated across en / zh-CN
/ ko. RESTART_REQUIRED_KEYS (embeddings, tunnel, gateway) is untouched —
those still require a restart.
* fix(web): avoid /v1/v1/models for NEAR AI private hosts with /v1 suffix
fetch_provider_models unconditionally appended /v1 for any NEAR AI
private host, so operators configuring a base URL that already ends in
/v1 (e.g. https://us.private-chat-stg.near.ai/v1) got /v1/v1/models and
404s from "Fetch available models". The Anthropic branch already had
the guard; the NEAR AI branch did not.
Extract models_endpoint_base(adapter, base) as a pure helper covering
both adapters, and swap the inline logic in fetch_provider_models for a
single call. Adds caller-level regression tests around the URL
construction path per .claude/rules/testing.md — the previous helper-
only tests on is_nearai_private_endpoint would have stayed green
through this bug.
* chore: minor
* fix(web): atomically switch llm_backend + selected_model on provider activation
setActiveProvider() was issuing two sequential PUTs — /api/settings/llm_backend
then /api/settings/selected_model. The settings handler hot-reloads the LLM
provider chain after each write, and config/llm.rs gives selected_model
precedence over provider defaults/overrides, so the first reload rebuilds the
chain with the new backend but the previous provider's model. If the second
request then fails, the instance stays stuck in that mixed state while the
success toast has already fired.
Route both writes through /api/settings/import instead: set_all_settings
commits the pair in one transaction and triggers a single reload, with
snapshot-based rollback of every key if the resulting chain fails to build.
Raised on the restart-notice removal PR (27c70552) — before that commit the
inline banner at least hinted the switch wasn't fully live; now that the
banner is gone, the atomicity gap is the only thing standing between the
toast and reality.
* fix(web): fall back to env var for builtin provider API keys
`resolve_api_key_from_secrets` previously only consulted the encrypted
secrets store, so the "Fetch available models" and "Test" buttons in
the Configure dialog sent no Authorization header when the UI showed
"Key configured (leave blank to keep)" — the provider then responded
401 even though chat worked.
Default IronClaw onboarding (`api_key_login()` in `llm/session.rs`)
writes the key to `NEARAI_API_KEY` + `~/.ironclaw/.env`, not to the
vault. The secrets-store-only lookup missed that path entirely. Add
an env-var fallback that resolves the right env name per provider —
`NEARAI_API_KEY` for NEAR AI, `ProviderDefinition::api_key_env` for
registry providers — so the configure dialog matches what the chat
pipeline already sees. Only applies to builtin providers; custom
providers have no declared env var and are unchanged.
Adds a caller-level regression test driving `llm_list_models_handler`
against a local mock server and asserting the forwarded
`Authorization: Bearer <key>` matches the env var. Also takes
`config::helpers::lock_env()` in both NEARAI env-mutating tests so
the module no longer flakes under parallel test execution.
394 lines
7.2 KiB
CSS
394 lines
7.2 KiB
CSS
/* --- Config Tab --- */
|
|
|
|
.config-section-header {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
margin-bottom: 12px;
|
|
}
|
|
|
|
.config-section-header h3 {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.btn-add-provider {
|
|
padding: 5px 14px;
|
|
background: var(--accent);
|
|
color: #09090b;
|
|
border: none;
|
|
border-radius: var(--radius);
|
|
cursor: pointer;
|
|
font-size: 13px;
|
|
font-weight: 600;
|
|
transition: background 0.2s, transform 0.2s;
|
|
}
|
|
|
|
.btn-add-provider:hover {
|
|
background: var(--accent-hover);
|
|
transform: translateY(-1px);
|
|
}
|
|
|
|
.providers-list {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 8px;
|
|
min-height: 420px;
|
|
overflow-y: auto;
|
|
}
|
|
|
|
.provider-card {
|
|
background: var(--bg-secondary);
|
|
border: 1px solid var(--border);
|
|
border-radius: var(--radius-lg);
|
|
padding: 12px 14px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 6px;
|
|
transition: border-color 0.2s;
|
|
}
|
|
|
|
.provider-card:hover {
|
|
border-color: rgba(255, 255, 255, 0.15);
|
|
}
|
|
|
|
.provider-card-active {
|
|
border-color: var(--accent);
|
|
}
|
|
|
|
.provider-card-header {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.provider-name {
|
|
font-weight: 600;
|
|
font-size: 14px;
|
|
color: var(--text);
|
|
}
|
|
|
|
.provider-id-label {
|
|
font-size: 11px;
|
|
color: var(--text-secondary);
|
|
font-family: var(--font-mono);
|
|
}
|
|
|
|
.provider-badge {
|
|
font-size: 10px;
|
|
padding: 2px 7px;
|
|
border-radius: 20px;
|
|
font-weight: 600;
|
|
letter-spacing: 0.02em;
|
|
}
|
|
|
|
.provider-badge-active {
|
|
background: rgba(52, 211, 153, 0.15);
|
|
color: var(--accent);
|
|
}
|
|
|
|
.provider-badge-builtin {
|
|
background: rgba(161, 161, 170, 0.12);
|
|
color: var(--text-secondary);
|
|
}
|
|
|
|
.provider-badge-unconfigured {
|
|
background: rgba(251, 191, 36, 0.15);
|
|
color: #b45309;
|
|
}
|
|
|
|
.provider-card-meta {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.provider-adapter {
|
|
font-size: 12px;
|
|
color: var(--text-secondary);
|
|
}
|
|
|
|
.provider-url {
|
|
font-size: 11px;
|
|
color: var(--text-secondary);
|
|
font-family: var(--font-mono);
|
|
opacity: 0.7;
|
|
}
|
|
|
|
.provider-current-model {
|
|
font-size: 11px;
|
|
color: var(--accent);
|
|
font-family: var(--font-mono);
|
|
font-weight: 500;
|
|
}
|
|
|
|
.provider-card-actions {
|
|
display: flex;
|
|
gap: 6px;
|
|
margin-top: 2px;
|
|
}
|
|
|
|
.provider-action-btn {
|
|
padding: 4px 12px;
|
|
background: var(--bg-tertiary);
|
|
border: 1px solid var(--border);
|
|
border-radius: var(--radius);
|
|
color: var(--text-secondary);
|
|
cursor: pointer;
|
|
font-size: 12px;
|
|
transition: color 0.2s, border-color 0.2s, background 0.2s;
|
|
}
|
|
|
|
.provider-action-btn:hover {
|
|
color: var(--text);
|
|
border-color: rgba(255, 255, 255, 0.2);
|
|
background: var(--bg);
|
|
}
|
|
|
|
.provider-delete-btn:hover {
|
|
color: var(--danger);
|
|
border-color: var(--danger);
|
|
}
|
|
|
|
/* Config form */
|
|
|
|
.provider-dialog {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
z-index: 9999;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.provider-dialog-overlay {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
background: rgba(0, 0, 0, 0.5);
|
|
backdrop-filter: blur(4px);
|
|
}
|
|
|
|
.provider-dialog-content {
|
|
position: relative;
|
|
z-index: 10000;
|
|
background: var(--bg-secondary);
|
|
border: 1px solid var(--border);
|
|
border-radius: var(--radius-lg);
|
|
box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.4);
|
|
width: 100%;
|
|
max-width: 480px;
|
|
margin: 0 1rem;
|
|
display: flex;
|
|
flex-direction: column;
|
|
max-height: 90vh;
|
|
}
|
|
|
|
.provider-dialog-header {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
padding: 14px 18px;
|
|
border-bottom: 1px solid var(--border);
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.provider-dialog-header h2 {
|
|
font-size: 14px;
|
|
font-weight: 600;
|
|
color: var(--text);
|
|
margin: 0;
|
|
}
|
|
|
|
.provider-dialog-close {
|
|
color: var(--text-secondary);
|
|
font-size: 18px;
|
|
line-height: 1;
|
|
padding: 2px 6px;
|
|
background: transparent;
|
|
border: none;
|
|
border-radius: var(--radius);
|
|
cursor: pointer;
|
|
transition: color 0.15s, background 0.15s;
|
|
}
|
|
|
|
.provider-dialog-close:hover {
|
|
color: var(--text);
|
|
background: var(--bg-hover);
|
|
}
|
|
|
|
.provider-dialog-body {
|
|
padding: 18px;
|
|
overflow-y: auto;
|
|
flex: 1;
|
|
}
|
|
|
|
.provider-dialog-footer {
|
|
display: flex;
|
|
gap: 8px;
|
|
padding: 14px 18px;
|
|
border-top: 1px solid var(--border);
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.provider-dialog-footer button {
|
|
padding: 6px 18px;
|
|
border-radius: var(--radius);
|
|
font-size: 13px;
|
|
font-weight: 600;
|
|
cursor: pointer;
|
|
transition: background 0.2s, transform 0.2s;
|
|
}
|
|
|
|
.provider-dialog-footer button:first-child {
|
|
background: var(--accent);
|
|
color: #09090b;
|
|
border: none;
|
|
}
|
|
|
|
.provider-dialog-footer button:first-child:hover {
|
|
background: var(--accent-hover);
|
|
transform: translateY(-1px);
|
|
}
|
|
|
|
.provider-dialog-footer .btn-secondary {
|
|
background: transparent;
|
|
color: var(--text-secondary);
|
|
border: 1px solid var(--border);
|
|
}
|
|
|
|
.provider-dialog-footer .btn-secondary:hover {
|
|
color: var(--text);
|
|
border-color: rgba(255, 255, 255, 0.2);
|
|
}
|
|
|
|
.config-form {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 12px;
|
|
}
|
|
|
|
.config-form-row {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 4px;
|
|
}
|
|
|
|
.config-form-row label {
|
|
font-size: 12px;
|
|
font-weight: 500;
|
|
color: var(--text-secondary);
|
|
}
|
|
|
|
.config-form-row input,
|
|
.config-form-row select {
|
|
padding: 7px 10px;
|
|
background: var(--bg);
|
|
border: 1px solid var(--border);
|
|
border-radius: var(--radius);
|
|
color: var(--text);
|
|
font-size: 13px;
|
|
}
|
|
|
|
.config-form-row input:focus,
|
|
.config-form-row select:focus {
|
|
outline: none;
|
|
border-color: var(--accent);
|
|
box-shadow: 0 0 0 3px rgba(52, 211, 153, 0.1);
|
|
}
|
|
|
|
.config-form-hint {
|
|
font-size: 11px;
|
|
color: var(--text-secondary);
|
|
opacity: 0.7;
|
|
}
|
|
|
|
.config-form-actions {
|
|
display: flex;
|
|
gap: 8px;
|
|
margin-top: 4px;
|
|
}
|
|
|
|
.config-form-actions button {
|
|
padding: 6px 18px;
|
|
border-radius: var(--radius);
|
|
font-size: 13px;
|
|
font-weight: 600;
|
|
cursor: pointer;
|
|
transition: background 0.2s, transform 0.2s;
|
|
}
|
|
|
|
.config-form-actions button:first-child {
|
|
background: var(--accent);
|
|
color: #09090b;
|
|
border: none;
|
|
}
|
|
|
|
.config-form-actions button:first-child:hover {
|
|
background: var(--accent-hover);
|
|
transform: translateY(-1px);
|
|
}
|
|
|
|
.config-form-actions .btn-secondary {
|
|
background: transparent;
|
|
color: var(--text-secondary);
|
|
border: 1px solid var(--border);
|
|
}
|
|
|
|
.config-form-actions .btn-secondary:hover {
|
|
color: var(--text);
|
|
border-color: rgba(255, 255, 255, 0.2);
|
|
}
|
|
|
|
.btn-fetch-models {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 5px;
|
|
margin-top: 6px;
|
|
padding: 5px 11px;
|
|
background: transparent;
|
|
border: 1px solid var(--border);
|
|
border-radius: var(--radius);
|
|
color: var(--text-secondary);
|
|
cursor: pointer;
|
|
font-size: 12px;
|
|
transition: color 0.15s, border-color 0.15s, background 0.15s;
|
|
}
|
|
|
|
.btn-fetch-models:hover {
|
|
color: var(--text);
|
|
border-color: var(--accent);
|
|
background: color-mix(in srgb, var(--accent) 8%, transparent);
|
|
}
|
|
|
|
.btn-fetch-models:disabled {
|
|
opacity: 0.5;
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.test-connection-result {
|
|
margin-top: 8px;
|
|
padding: 6px 12px;
|
|
border-radius: var(--radius);
|
|
font-size: 13px;
|
|
}
|
|
|
|
.test-connection-result.test-ok {
|
|
background: rgba(74, 222, 128, 0.12);
|
|
color: #4ade80;
|
|
border: 1px solid rgba(74, 222, 128, 0.3);
|
|
}
|
|
|
|
.test-connection-result.test-fail {
|
|
background: rgba(248, 113, 113, 0.12);
|
|
color: #f87171;
|
|
border: 1px solid rgba(248, 113, 113, 0.3);
|
|
}
|
|
|