MrSphay/odysseus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Sidebar Chat button Quality of Life improvement. (#155)

Browse Source
This commit is contained in:
Alan Met
2026-06-01 03:52:10 +01:00
committed by GitHub
parent 411cb872cc
commit 864e7ad558
3 changed files with 33 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
static/app.js
View File

@@ -1025,16 +1025,10 @@ function initializeEventListeners() {
});
}
// "Chats" sidebar section header:
// • Click the auto-injected chevron (section-management.js adds it)
// or the empty area of the title → toggle collapse of the list.
// • Click the "Chats" text label → open the Chats tab of the library.
// We stop propagation on the label so section-management.js's
// section-title click handler (which toggles collapse) doesn't also
// fire when the user is trying to open the library.
const chatsSectionLabel = el('chats-section-label');
if (chatsSectionLabel) {
chatsSectionLabel.addEventListener('click', (e) => {
// Manage Chats — opens Full Library modal (decoupled from Chats accordion toggle)
const chatsLibraryBtn = el('chats-library-btn');
if (chatsLibraryBtn) {
chatsLibraryBtn.addEventListener('click', (e) => {
e.stopPropagation();
if (sessionModule) sessionModule.openLibrary('chats');
});

12
static/index.html
View File

@@ -693,8 +693,16 @@
<div class="section" id="sessions-section">
<div class="section-header-flex">
<span class="section-title" id="chats-section-title"><svg class="section-icon" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/></svg><span id="chats-section-label" class="section-title-label" style="cursor:pointer;" title="Open Library">Chats</span><span id="chats-notif-dot" class="sidebar-notif-dot" style="display:none"></span></span>
<div style="position:relative; display:inline-block;">
<span class="section-title" id="chats-section-title"><svg class="section-icon" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/></svg><span id="chats-section-label" class="section-title-label">Chats</span><span id="chats-notif-dot" class="sidebar-notif-dot" style="display:none"></span></span>
<div style="position:relative; display:inline-block; display:flex; gap:4px; align-items:center;">
<button type="button" class="section-header-btn chats-manage-btn" id="chats-library-btn" title="Manage Chats (Library)">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<rect x="3" y="3" width="7" height="7"></rect>
<rect x="14" y="3" width="7" height="7"></rect>
<rect x="14" y="14" width="7" height="7"></rect>
<rect x="3" y="14" width="7" height="7"></rect>
</svg>
</button>
<button type="button" class="section-header-btn" id="session-sort-btn" title="Sort sessions">
<svg class="sort-icon" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<line x1="4" y1="6" x2="20" y2="6"/>

19
static/style.css
View File

@@ -1208,6 +1208,25 @@ body.bg-pattern-sparkles {
.section-header-btn.active { opacity: 0.9; color: var(--accent); }
.section-header-btn svg { width: 12px; height: 12px; }
/* Chats library — grid icon, hover-reveal so the header only toggles collapse */
#sessions-section .chats-manage-btn {
opacity: 0;
transition: opacity 0.12s, background 0.08s;
}
#sessions-section .section-header-flex:hover .chats-manage-btn,
#sessions-section .chats-manage-btn:hover,
#sessions-section .chats-manage-btn:focus-visible {
opacity: 0.45;
}
#sessions-section .chats-manage-btn:hover,
#sessions-section .chats-manage-btn:focus-visible {
opacity: 1;
}
@media (hover: none) {
#sessions-section .chats-manage-btn { opacity: 0.35; }
#sessions-section .chats-manage-btn:active { opacity: 1; }
}
/* Collapse chevron */
.section-collapse-btn {
all: unset;