Users, groups, permissions, model settings and reasoning display
Four features, plus the schema machinery they needed. **Schema sync.** The first live instance had data in it, and create_all only creates missing *tables* -- a new column silently never appeared. db/migrations.py now diffs the declared models against the database and ALTER TABLE ... ADD COLUMN for what is missing, deriving a backfill default from the column type (SQLite refuses a NOT NULL column without one, and a Python-side `default=dict` cannot be expressed in DDL). Verified against a copy of the live database: eight changes applied, all rows preserved, second run a no-op. Renames, drops and retypes are still manual and say so. **Permissions.** A flat set of named booleans: an instance baseline widened by each group the user belongs to. A group grants and never denies -- with denies, "why can this user not do X" cannot be answered without simulating every group. Admins bypass entirely, because an admin can grant it back to themselves in two clicks and pretending otherwise is theatre. Model *access* is separate: public, or granted to groups. The picker is not the boundary -- switching a chat to a model you cannot reach is a 403. **Model settings.** Ordering, pinned-first, an instance default and a per-user default, display names, descriptions, capability flags, and uploaded images. Images are stored and served locally rather than by URL: a remote URL makes every page render a request to a third party. Uploads are validated by magic number, not the declared content type, and stored under a random name. Models with no image get a generated initial whose hue is derived from the model id, so it is stable. **Reasoning display.** Streams into its own collapsible block above the answer, labelled "Thought for 14 seconds", collapsed once finished, and never replayed as context on the next turn. Two sources: the reasoning_content delta field, and <think> tags inline in content -- the latter needs a streaming splitter because the tags arrive split across chunks. Models emitting no reasoning show nothing, via a :has() rule rather than JavaScript. Verified against qwen35-9b on llama-swap: 694 reasoning events, 52 answer tokens, cleanly separated. Two bugs found and fixed while testing: - A bare `Mapped[list]` relationship is treated by SQLAlchemy as a scalar and returns None instead of []. It needs the element type. - FastAPI substitutes the default for an empty form value, so with `x: str | None = Form(None)` a submitted `x=` is indistinguishable from an absent field. That silently broke clearing a system prompt or a temperature. update_chat now reads the raw form and checks key presence. 143 tests, ruff clean. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Jaroslav Beneš
@@ -103,6 +103,81 @@
|
||||
}
|
||||
.nav-item.is-disabled:hover { background: none; color: var(--ink-muted); }
|
||||
|
||||
/* --- Model list ----------------------------------------------------------- */
|
||||
.bulk-bar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--sp-2);
|
||||
flex-wrap: wrap;
|
||||
margin-bottom: var(--sp-4);
|
||||
}
|
||||
.bulk-bar .model-rows { flex-basis: 100%; margin-top: var(--sp-3); }
|
||||
|
||||
.model-rows {
|
||||
border: 1px solid var(--border);
|
||||
border-radius: var(--radius-lg);
|
||||
overflow: hidden;
|
||||
}
|
||||
.model-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--sp-3);
|
||||
padding: var(--sp-3);
|
||||
border-bottom: 1px solid var(--border);
|
||||
background: var(--surface);
|
||||
}
|
||||
.model-row:last-child { border-bottom: 0; }
|
||||
.model-row.is-off { opacity: 0.55; }
|
||||
.model-row__check { accent-color: var(--accent); width: 1rem; height: 1rem; flex: none; }
|
||||
.model-row__avatar { flex: none; }
|
||||
.model-row__main { flex: 1; min-width: 0; }
|
||||
.model-row__title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--sp-2);
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.model-row__id {
|
||||
display: block;
|
||||
font-family: var(--font-mono);
|
||||
font-size: var(--text-xs);
|
||||
color: var(--ink-muted);
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.model-row__actions { display: flex; gap: var(--sp-1); flex: none; align-items: center; }
|
||||
|
||||
/* --- Permission and checkbox grids ---------------------------------------- */
|
||||
.checkbox-row {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: var(--sp-2) var(--sp-4);
|
||||
}
|
||||
.checkbox-row .checkbox { flex: 0 0 auto; }
|
||||
.checkbox.is-muted { opacity: 0.6; }
|
||||
|
||||
.perm-row {
|
||||
align-items: flex-start;
|
||||
padding: var(--sp-2) 0;
|
||||
border-bottom: 1px solid var(--border);
|
||||
}
|
||||
.perm-row:last-child { border-bottom: 0; }
|
||||
.perm-row input { margin-top: 0.2rem; }
|
||||
.perm-row__desc {
|
||||
display: block;
|
||||
font-size: var(--text-xs);
|
||||
color: var(--ink-faint);
|
||||
font-weight: 400;
|
||||
line-height: var(--leading-normal);
|
||||
}
|
||||
|
||||
.input--file {
|
||||
padding: 0.35rem;
|
||||
font-size: var(--text-sm);
|
||||
background: var(--surface-raised);
|
||||
}
|
||||
|
||||
.field__hint code {
|
||||
font-family: var(--font-mono);
|
||||
font-size: 0.92em;
|
||||
|
||||
@@ -137,6 +137,66 @@
|
||||
}
|
||||
@keyframes caret { 0%, 49% { opacity: 0.75; } 50%, 100% { opacity: 0; } }
|
||||
|
||||
/* --- Reasoning ------------------------------------------------------------ */
|
||||
.reasoning {
|
||||
margin: 0 0 var(--sp-3);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: var(--radius);
|
||||
background: color-mix(in srgb, var(--surface) 70%, transparent);
|
||||
font-size: var(--text-sm);
|
||||
}
|
||||
|
||||
/*
|
||||
A live block is emitted before the first token arrives, and plenty of models
|
||||
emit no reasoning at all. Hiding it until it has content means those models
|
||||
never show an empty "Thinking" box, and no JavaScript is involved either way.
|
||||
*/
|
||||
.reasoning--live:not(:has(.reasoning__body:not(:empty))) { display: none; }
|
||||
|
||||
.reasoning__summary {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--sp-2);
|
||||
padding: var(--sp-2) var(--sp-3);
|
||||
cursor: pointer;
|
||||
color: var(--ink-muted);
|
||||
list-style: none;
|
||||
user-select: none;
|
||||
border-radius: var(--radius);
|
||||
}
|
||||
.reasoning__summary::-webkit-details-marker { display: none; }
|
||||
.reasoning__summary:hover { color: var(--ink); background: var(--surface-hover); }
|
||||
|
||||
.reasoning__icon { color: var(--gold); flex: none; }
|
||||
.reasoning__label { flex: 1; font-style: italic; }
|
||||
|
||||
.reasoning__chevron {
|
||||
flex: none;
|
||||
transition: transform var(--transition-fast);
|
||||
}
|
||||
.reasoning[open] .reasoning__chevron { transform: rotate(180deg); }
|
||||
|
||||
.reasoning__body {
|
||||
padding: 0 var(--sp-3) var(--sp-3);
|
||||
margin-left: var(--sp-2);
|
||||
border-left: 2px solid var(--border-strong);
|
||||
padding-left: var(--sp-3);
|
||||
white-space: pre-wrap;
|
||||
color: var(--ink-muted);
|
||||
font-size: var(--text-sm);
|
||||
line-height: var(--leading-relaxed);
|
||||
max-height: 26rem;
|
||||
overflow-y: auto;
|
||||
scrollbar-width: thin;
|
||||
}
|
||||
|
||||
/* Gentle pulse on the icon while thinking is still streaming. */
|
||||
.reasoning--live .reasoning__icon { animation: think-pulse 1.6s ease-in-out infinite; }
|
||||
@keyframes think-pulse {
|
||||
0%, 100% { opacity: 0.45; }
|
||||
50% { opacity: 1; }
|
||||
}
|
||||
|
||||
/* --- Message actions ------------------------------------------------------ */
|
||||
.msg__actions {
|
||||
display: flex;
|
||||
@@ -326,6 +386,57 @@
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* --- Chat settings panel -------------------------------------------------- */
|
||||
.chat-settings {
|
||||
flex: none;
|
||||
border-bottom: 1px solid var(--border);
|
||||
background: var(--bg-sunken);
|
||||
max-height: 60vh;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.chat-settings__inner {
|
||||
max-width: var(--thread-max-width);
|
||||
margin: 0 auto;
|
||||
padding: var(--sp-4) var(--sp-5);
|
||||
}
|
||||
.chat-settings__note {
|
||||
color: var(--ink-muted);
|
||||
font-size: var(--text-sm);
|
||||
font-style: italic;
|
||||
margin-bottom: var(--sp-4);
|
||||
}
|
||||
.chat-settings__params {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
|
||||
gap: var(--sp-3);
|
||||
}
|
||||
.chat-settings__params .field { margin-bottom: 0; }
|
||||
|
||||
/* --- Model avatars -------------------------------------------------------- */
|
||||
.model-avatar {
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
flex: none;
|
||||
border-radius: var(--radius);
|
||||
object-fit: cover;
|
||||
background: var(--surface-active);
|
||||
}
|
||||
.model-avatar--initial {
|
||||
display: grid;
|
||||
place-items: center;
|
||||
font-family: var(--font-display);
|
||||
font-weight: 600;
|
||||
font-size: var(--text-sm);
|
||||
/* Hue comes from the model id (see the stable_hue filter); saturation and
|
||||
lightness are fixed so every generated badge stays legible in both themes. */
|
||||
background: hsl(var(--avatar-hue, 40) 42% 34%);
|
||||
color: hsl(var(--avatar-hue, 40) 60% 92%);
|
||||
}
|
||||
:root[data-theme="shire"] .model-avatar--initial {
|
||||
background: hsl(var(--avatar-hue, 40) 46% 82%);
|
||||
color: hsl(var(--avatar-hue, 40) 60% 22%);
|
||||
}
|
||||
|
||||
/* --- Theme toggle --------------------------------------------------------- */
|
||||
/* Only the icon for the theme you would switch TO is shown. */
|
||||
:root[data-theme="moria"] .theme-icon--dark { display: none; }
|
||||
|
||||
Reference in New Issue
Block a user