etalon/BountyBoard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: chat scroll/pagination, message search; fix members dialog growth

Browse Source 
- Messages: the message list now scrolls inside a fixed-height pane instead of
  growing the page; new messages autoscroll only when already at the bottom,
  and scrolling near the top loads older history (40 at a time) with the
  position preserved.
- Add a message search box in the conversations sidebar backed by a new
  GET /api/v1/messages/search endpoint (searches the caller's conversations,
  returns snippets); clicking a result opens that conversation.
- Manage-members dialog no longer grows horizontally: results are stacked in a
  fixed-width, scrollable list.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
etalon
2026-06-13 11:43:11 +02:00
parent df08682bed
commit b4e919502f
4 changed files with 196 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/static/css/app.css
+19 -4
View File
@@ -628,8 +628,8 @@ body[data-nav=side] #tab-audit {
}
/* ---- chat ---- */
.chat-layout { display: grid; grid-template-columns: 280px 1fr; gap: 18px; min-height: 70vh; }
.chat-sidebar { overflow: auto; }
.chat-layout { display: grid; grid-template-columns: 280px 1fr; gap: 18px; height: calc(100vh - 150px); }
.chat-sidebar { overflow: auto; min-height: 0; }
.conv-list { list-style: none; margin: 8px 0 0; padding: 0; }
.conv-list li { border-bottom: var(--hairline); }
.conv-list li.active .conv-item {
@@ -643,8 +643,10 @@ body[data-nav=side] #tab-audit {
border-radius: var(--radius);
}
.conv-item:hover { background: var(--surface2); }
.chat-main { display: flex; flex-direction: column; }
.chat-messages { flex: 1; overflow: auto; padding: 8px 0; min-height: 320px; }
.chat-main { display: flex; flex-direction: column; min-height: 0; }
/* flex:1 + min-height:0 lets the message list scroll internally instead of
growing the whole page */
.chat-messages { flex: 1; overflow-y: auto; padding: 8px 0; min-height: 0; }
.chat-msg {
max-width: 75%; margin: 10px 0; padding: 9px 13px;
background: var(--surface2);
@@ -815,6 +817,19 @@ legend {
#nc-results .nc-empty { color: var(--muted); padding: 10px; font-size: 0.88rem; }
#nc-selected { min-height: 30px; display: flex; gap: 6px; flex-wrap: wrap; }
/* members dialog: fixed width, vertically-stacked results (no horizontal growth) */
#members-dialog > .stack { width: 440px; max-width: 86vw; }
#mm-list li { justify-content: space-between; }
#mm-results { max-height: 200px; overflow: auto; margin-top: 6px; }
#mm-results .nc-row {
display: block; width: 100%; text-align: left;
font: inherit; font-size: 0.92rem;
background: none; border: none; color: var(--text);
padding: 8px 10px; cursor: pointer;
border-bottom: var(--hairline); border-radius: var(--radius);
}
#mm-results .nc-row:hover { background: var(--surface2); }
/* ---- floating messages bubble + mini panel ---- */
.chat-fab {
position: fixed; bottom: 16px; right: 16px; z-index: 2147483645;