fix(v1.5.1): /clear migration, remove unused filter chips, footer polish

Invictorius · claude · Invictorius · commit 884309694820 · 2026-05-06T05:21:38.000+02:00
- watcher: trust session.json's sid when tracked sid is stale and they
  diverge (post-/clear). Previously _findFreshUnclaimedJsonl excluded
  the new sid because it appears in liveSessionIds, leaving the card
  stuck on the old jsonl.
- ui: remove unused filter chips (active/waiting/completed). Toolbar,
  i18n, CSS cleaned up. Search remains via Cmd+F.
- ui: footer padding 96px → 16px so it fits narrow windows; usage bars
  bumped to 120×10 for readability.
- factor closeSearch() helper out of Cmd+F + empty-state reset paths.
- test: regression for the post-/clear migration case.

Co-Authored-By: Claude Opus 4.7 (1M context) &lt;noreply@anthropic.com&gt;
diff --git a/i18n.js b/i18n.js
@@ -12,11 +12,6 @@
       state_completed: 'Terminé',
 
       // Toolbar tooltips
-      filter_all: 'Tout',
-      filter_active: 'Actives',
-      filter_waiting: 'En attente',
-      filter_completed: 'Terminées',
-      filter_clear: 'Tout afficher',
       search_placeholder: 'Rechercher...',
       view_grid: 'Vue grille',
       view_compact: 'Vue compacte',
@@ -31,7 +26,7 @@
       empty_title: 'Aucune session Claude Code',
       empty_hint: 'Lancez <code>claude</code> dans un terminal ou utilisez le bouton +',
       empty_filtered_title: 'Aucun résultat',
-      empty_filtered_hint: 'Essayez de modifier vos filtres ou votre recherche',
+      empty_filtered_hint: 'Essayez une autre recherche',
       reset: 'Réinitialiser',
 
       // Card details
@@ -157,11 +152,6 @@
       state_completed: 'Completed',
 
       // Toolbar tooltips
-      filter_all: 'All',
-      filter_active: 'Active',
-      filter_waiting: 'Waiting',
-      filter_completed: 'Completed',
-      filter_clear: 'Show all',
       search_placeholder: 'Search...',
       view_grid: 'Grid view',
       view_compact: 'Compact view',
@@ -176,7 +166,7 @@
       empty_title: 'No Claude Code sessions',
       empty_hint: 'Run <code>claude</code> in a terminal or use the + button',
       empty_filtered_title: 'No results',
-      empty_filtered_hint: 'Try adjusting your filters or search',
+      empty_filtered_hint: 'Try a different search',
       reset: 'Reset',
 
       // Card details
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "aby-claude-watcher",
-  "version": "1.5.0",
+  "version": "1.5.1",
   "description": "Aby Claude Watcher — dashboard desktop pour monitorer en temps réel vos sessions Claude Code",
   "main": "main.js",
   "scripts": {
diff --git a/test/watcher.test.js b/test/watcher.test.js
@@ -337,6 +337,28 @@ test('scan: lagged session.json + fresh /clear jsonl → migrate tracked id once
   if (events.length !== 0) throw new Error(`expected sticky no-op, got ${JSON.stringify(events)}`);
 });
 
+test('scan: updated session.json + fresh /clear jsonl → migrate even when new sid in liveSessionIds', () => {
+  // Single Claude, post-/clear. session.json was updated to NEW-id. On disk:
+  // OLD.jsonl is stale, NEW.jsonl is fresh. Tracked: OLD-id (config-restored or
+  // pre-/clear state). Regression: previously, _findFreshUnclaimedJsonl excluded
+  // NEW-id because it appears in liveSessionIds, so migration silently failed
+  // and the card stayed stuck on OLD-id. Expected: migrate OLD → NEW.
+  const tree = makeFakeClaudeTree();
+  const cwd = '/tmp/proj-clear';
+  const now = Date.now();
+  writeSessionJson(tree.sessions, 9101, 'NEW-id', cwd);
+  writeJsonl(tree.projects, cwd, 'OLD-id', now - 60000);  // stale (tracked)
+  writeJsonl(tree.projects, cwd, 'NEW-id', now - 1000);   // fresh (Claude is here now)
+
+  const w = freshScanWatcher(tree.root);
+  w.sessions.set('OLD-id', makeSession('OLD-id', { pid: 9101, cwd, state: STATES.WAITING }));
+
+  w.scan();
+
+  if (w.sessions.has('OLD-id')) throw new Error('OLD-id must be migrated away');
+  if (!w.sessions.has('NEW-id')) throw new Error('NEW-id must be tracked');
+});
+
 test('scan: oscillation regression — two Claudes alternating writes, no flap after first attribution', () => {
   // Two Claudes in same cwd. Both /clear'd (both session.json sids stale).
   // Both wrote fresh post-/clear JSONLs. First scan attributes each pid to its
diff --git a/ui/index.html b/ui/index.html
@@ -26,28 +26,6 @@
 
   <!-- Toolbar -->
   <div class="toolbar">
-    <div class="filter-chips status-filter">
-      <button class="filter-chip" data-filter="active" data-i18n-title="filter_active" title="Active">
-        <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-          <polygon points="13 2 3 14 12 14 11 22 21 10 12 10 13 2"/>
-        </svg>
-      </button>
-      <button class="filter-chip" data-filter="waiting" data-i18n-title="filter_waiting" title="Waiting">
-        <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-          <circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/>
-        </svg>
-      </button>
-      <button class="filter-chip" data-filter="completed" data-i18n-title="filter_completed" title="Completed">
-        <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-          <path d="M20 6 9 17l-5-5"/>
-        </svg>
-      </button>
-      <button class="filter-clear" id="btnClearFilters" data-i18n-title="filter_clear" title="Show all" style="display:none;">
-        <svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-          <path d="M18 6 6 18"/><path d="m6 6 12 12"/>
-        </svg>
-      </button>
-    </div>
     <input type="text" class="search-input" id="searchInput" data-i18n-placeholder="search_placeholder" placeholder="Search..." style="display:none;">
 
     <div class="toolbar-spacer"></div>
@@ -113,7 +91,7 @@
         <line x1="21" y1="21" x2="16.65" y2="16.65"/>
       </svg>
       <p data-i18n="empty_filtered_title">No results</p>
-      <p class="hint" data-i18n="empty_filtered_hint">Try adjusting your filters or search</p>
+      <p class="hint" data-i18n="empty_filtered_hint">Try a different search</p>
       <button class="empty-action" id="btnClearAllFilters" data-i18n="reset">Reset</button>
     </div>
     <div class="grid-view" id="gridView" style="display:none;"></div>
diff --git a/ui/renderer.js b/ui/renderer.js
@@ -31,7 +31,6 @@ let autoLaunch = false;
 let searchQuery = '';
 let sessionOrder = []; // User-defined order of session IDs
 let draggedId = null;
-let activeFilters = new Set(); // empty = all visible, or: 'active', 'waiting', 'completed'
 
 // ═══ DOM refs ═══
 
@@ -138,37 +137,8 @@ async function init() {
   $btnBack.addEventListener('click', () => setView(previousViewMode || 'grid'));
   $btnPinMicro.addEventListener('click', togglePin);
 
-  // Status filter chips (multi-select)
-  document.querySelectorAll('.status-filter .filter-chip').forEach(chip => {
-    chip.addEventListener('click', () => {
-      const filter = chip.dataset.filter;
-      if (activeFilters.has(filter)) {
-        activeFilters.delete(filter);
-      } else {
-        activeFilters.add(filter);
-      }
-      updateFilterPills();
-      render();
-    });
-  });
-
-  // Clear filters button
-  document.getElementById('btnClearFilters').addEventListener('click', () => {
-    activeFilters.clear();
-    updateFilterPills();
-    render();
-  });
-
-  // Clear all (filters + search) from empty state
-  document.getElementById('btnClearAllFilters').addEventListener('click', () => {
-    activeFilters.clear();
-    searchQuery = '';
-    const search = document.getElementById('searchInput');
-    search.value = '';
-    search.style.display = 'none';
-    updateFilterPills();
-    render();
-  });
+  // Clear search from empty state
+  document.getElementById('btnClearAllFilters').addEventListener('click', closeSearch);
   $btnPin.addEventListener('click', togglePin);
   $btnAdd.addEventListener('click', () => $addModal.style.display = 'flex');
   $addCancel.addEventListener('click', closeAddModal);
@@ -320,10 +290,7 @@ async function init() {
         search.style.display = 'block';
         search.focus();
       } else {
-        search.style.display = 'none';
-        search.value = '';
-        searchQuery = '';
-        render();
+        closeSearch();
       }
     }
 
@@ -393,15 +360,15 @@ function updatePinButton() {
   $btnPin.classList.toggle('active', alwaysOnTop);
 }
 
-
-function updateFilterPills() {
-  document.querySelectorAll('.status-filter .filter-chip').forEach(p => {
-    p.classList.toggle('active', activeFilters.has(p.dataset.filter));
-  });
-  const clearBtn = document.getElementById('btnClearFilters');
-  clearBtn.style.display = activeFilters.size > 0 ? 'inline-flex' : 'none';
+function closeSearch() {
+  const search = document.getElementById('searchInput');
+  search.style.display = 'none';
+  search.value = '';
+  searchQuery = '';
+  render();
 }
 
+
 function updateNotifPosition() {
   $notificationOverlay.setAttribute('data-position', notifPosition);
   document.querySelectorAll('.position-btn').forEach(btn => {
@@ -576,7 +543,6 @@ function getRenderableSessions() {
 
 function render() {
   const count = sessions.size;
-  const filtersActive = activeFilters.size > 0 || searchQuery;
   const visibleCount = getRenderableSessions().length;
 
   const showNoSessions = count === 0;
@@ -672,18 +638,6 @@ function getSortedSessions() {
     );
   }
 
-  // Filter by active filter pills (multi-select, OR logic)
-  if (activeFilters.size > 0) {
-    arr = arr.filter(s => {
-      const name = s.state.name;
-      if (activeFilters.has('active') && (name === 'running' || name === 'thinking')) return true;
-      if (activeFilters.has('waiting') && (name === 'waiting' || name === 'pending')) return true;
-      if (activeFilters.has('completed') && name === 'completed') return true;
-      return false;
-    });
-  }
-
-
   // Separate completed from active
   const active = arr.filter(s => s.state.name !== 'completed');
   const completed = arr.filter(s => s.state.name === 'completed');
@@ -1305,11 +1259,8 @@ function updateStatusBar() {
   const totalInput = all.reduce((sum, s) => sum + (s.tokens?.input || 0), 0);
   const totalOutput = all.reduce((sum, s) => sum + (s.tokens?.output || 0), 0);
 
-  const filtersActive = activeFilters.size > 0 || searchQuery;
-  const visibleCount = filtersActive ? getSortedSessions().length : all.length;
-
-  const activeLabel = filtersActive
-    ? t('status_filtered', { visible: visibleCount, total: all.length })
+  const activeLabel = searchQuery
+    ? t('status_filtered', { visible: getSortedSessions().length, total: all.length })
     : t('status_active', { n: active.length });
 
   document.getElementById('statActive').textContent = activeLabel;
diff --git a/ui/styles.css b/ui/styles.css
@@ -367,113 +367,6 @@ body.micro-mode .usage-reset-icon {
   -webkit-app-region: no-drag;
 }
 
-.filter-chips {
-  display: inline-flex;
-  align-items: center;
-  gap: 3px;
-  -webkit-app-region: no-drag;
-  position: relative;
-}
-
-.filter-chip {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: 24px;
-  height: 22px;
-  background: transparent;
-  border: none;
-  border-radius: 3px;
-  color: var(--text-muted);
-  cursor: pointer;
-  transition: all var(--transition);
-  position: relative;
-}
-
-.filter-chip:hover {
-  color: var(--text-secondary);
-}
-
-.filter-chip.active {
-  background: var(--bg-tertiary);
-}
-
-.filter-chip[data-filter="active"].active { color: var(--state-running); }
-.filter-chip[data-filter="waiting"].active { color: var(--state-waiting); }
-.filter-chip[data-filter="completed"].active { color: var(--text-secondary); }
-
-.filter-chip::after {
-  content: attr(title);
-  position: absolute;
-  top: calc(100% + 6px);
-  left: 50%;
-  transform: translateX(-50%);
-  background: var(--bg-secondary);
-  color: var(--text-primary);
-  padding: 3px 8px;
-  border-radius: var(--radius-sm);
-  border: 1px solid var(--border);
-  font-size: 11px;
-  font-family: var(--font-sans);
-  white-space: nowrap;
-  opacity: 0;
-  pointer-events: none;
-  transition: opacity 0.15s ease-out;
-  z-index: 100;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
-}
-
-.filter-chip:hover::after {
-  opacity: 1;
-  transition-delay: 0.3s;
-}
-
-.filter-clear {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: 20px;
-  height: 20px;
-  margin-left: 2px;
-  padding: 0;
-  background: transparent;
-  border: none;
-  border-radius: 50%;
-  color: var(--text-muted);
-  cursor: pointer;
-  transition: all var(--transition);
-  position: relative;
-}
-
-.filter-clear:hover {
-  background: var(--bg-tertiary);
-  color: var(--text-primary);
-}
-
-.filter-clear::after {
-  content: attr(title);
-  position: absolute;
-  top: calc(100% + 6px);
-  left: 50%;
-  transform: translateX(-50%);
-  background: var(--bg-secondary);
-  color: var(--text-primary);
-  padding: 3px 8px;
-  border-radius: var(--radius-sm);
-  border: 1px solid var(--border);
-  font-size: 11px;
-  white-space: nowrap;
-  opacity: 0;
-  pointer-events: none;
-  transition: opacity 0.15s ease-out;
-  z-index: 100;
-}
-
-.filter-clear:hover::after {
-  opacity: 1;
-  transition-delay: 0.3s;
-}
-
 .filter-seg {
   display: inline-flex;
   align-items: center;
@@ -1831,7 +1724,7 @@ body.micro-mode .usage-reset-icon {
   align-items: center;
   justify-content: center;
   gap: 8px;
-  padding: 6px 96px;
+  padding: 6px 16px;
   background: var(--bg-secondary);
   border-top: 1px solid var(--border);
   font-size: 11px;
@@ -1863,11 +1756,11 @@ body.micro-mode .usage-reset-icon {
 }
 
 .usage-bar {
-  width: 90px;
-  height: 6px;
+  width: 120px;
+  height: 10px;
   background: var(--bg-primary);
   border: 1px solid var(--border);
-  border-radius: 3px;
+  border-radius: 5px;
   overflow: hidden;
 }
 
diff --git a/watcher.js b/watcher.js
@@ -164,7 +164,12 @@ class SessionWatcher extends EventEmitter {
           if (trackedId) {
             if (!this._isSidStale(trackedId, cwd)) {
               effectiveId = trackedId;
+            } else if (sessionId !== trackedId) {
+              // trackedId is stale and session.json reports a different sid —
+              // trust session.json (e.g., after /clear created a new JSONL).
+              effectiveId = sessionId;
             } else {
+              // session.json is lagged on the same stale sid: scan unclaimed JSONLs.
               const fresh = this._findFreshUnclaimedJsonl(cwd, liveSessionIds, claimedJsonls);
               effectiveId = fresh || trackedId;
             }

Original file line number	Diff line number	Diff line change
`@@ -1,6 +1,6 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "aby-claude-watcher",`
`3`		`- "version": "1.5.0",`
	`3`	`+ "version": "1.5.1",`
`4`	`4`	`"description": "Aby Claude Watcher — dashboard desktop pour monitorer en temps réel vos sessions Claude Code",`
`5`	`5`	`"main": "main.js",`
`6`	`6`	`"scripts": {`