taskchef 9.7.1 → 9.7.2

package/src/mcp-app/react/CalendarView.test.tsx

@@ -57,3 +57,22 @@ test('a selected project hides bar prefixes and persistent helper captions are a
   expect(screen.queryByRole('button', { name: /Project ·/ })).not.toBeInTheDocument();
   expect(screen.queryByText(/Recorded work ·|Selected Codex history only/)).not.toBeInTheDocument();
 });
+
+test('hover highlights a chat across continued and resumed weeks, and clears on leave', async () => {
+  const result = data(2);
+  result.chats[0].segments[0].end = `${month()}-19`;
+  render(<CalendarView request={async () => result} tasks={[task('0'), task('1')]} refreshKey="1" onOpenDetail={vi.fn()} />);
+  const bars = await screen.findAllByRole('button', { name: /Project · Chat 0/ });
+  const otherBars = screen.getAllByRole('button', { name: /Project · Chat 1/ });
+  expect(bars.length).toBeGreaterThan(3);
+  for (const bar of [bars[0], bars[bars.length - 1]]) {
+    fireEvent.mouseEnter(bar);
+    for (const segment of bars) expect(segment).toHaveClass('calendar-bar-highlighted');
+    for (const segment of otherBars) expect(segment).not.toHaveClass('calendar-bar-highlighted');
+    fireEvent.mouseLeave(bar);
+    for (const segment of bars) expect(segment).not.toHaveClass('calendar-bar-highlighted');
+  }
+  fireEvent.mouseEnter(otherBars[0]);
+  for (const segment of otherBars) expect(segment).toHaveClass('calendar-bar-highlighted');
+  for (const segment of bars) expect(segment).not.toHaveClass('calendar-bar-highlighted');
+});

package/src/mcp-app/react/CalendarView.tsx

@@ -14,6 +14,7 @@ export function CalendarView({ request, tasks, refreshKey, onOpenDetail, showPro
   const [data, setData] = useState<CalendarData | null>(null);
   const [error, setError] = useState<string | null>(null);
   const [retry, setRetry] = useState(0);
+  const [hoveredTaskId, setHoveredTaskId] = useState<string | null>(null);
   const [expanded, setExpanded] = useState<string[]>([]);
   const timeZone = Intl.DateTimeFormat().resolvedOptions().timeZone;
   useEffect(() => {
@@ -28,6 +29,7 @@ export function CalendarView({ request, tasks, refreshKey, onOpenDetail, showPro
     if (delta > 0 && month >= currentMonth) return;
     const date = new Date(`${month}-01T12:00:00Z`);
     date.setUTCMonth(date.getUTCMonth() + delta);
+    setHoveredTaskId(null);
     setMonth(date.toISOString().slice(0, 7)); setData(null); setExpanded([]);
   }
   const first = `${month}-01`;
@@ -76,7 +78,7 @@ export function CalendarView({ request, tasks, refreshKey, onOpenDetail, showPro
                 const col = Math.round((Date.parse(bar.left) - Date.parse(start)) / 86400000);
                 const span = Math.round((Date.parse(bar.right) - Date.parse(bar.left)) / 86400000) + 1;
                 const title = showProject ? `${bar.task.project.name} · ${bar.task.title}` : bar.task.title;
-                return <button key={`${bar.task.id}:${bar.start}`} className="calendar-bar" style={{ gridColumn: `${col + 1} / span ${span}`, gridRow: bar.lane + 2, borderColor: `hsl(${projectHue(bar.task)} 45% 55%)`, backgroundColor: `hsl(${projectHue(bar.task)} 45% 55% / .17)` }} title={`${title}\n${bar.start} – ${bar.end}${bar.resumed ? ' · Resumed' : ''}\nCurrent status: ${bar.task.status ? statusLabels[bar.task.status] : 'Unverified'}`} onClick={() => onOpenDetail(bar.task)}>
+                return <button key={`${bar.task.id}:${bar.start}`} className={`calendar-bar${hoveredTaskId === bar.task.id ? " calendar-bar-highlighted" : ""}`} onMouseEnter={() => setHoveredTaskId(bar.task.id)} onMouseLeave={() => setHoveredTaskId(null)} style={{ gridColumn: `${col + 1} / span ${span}`, gridRow: bar.lane + 2, borderColor: `hsl(${projectHue(bar.task)} 45% 55%)`, backgroundColor: `hsl(${projectHue(bar.task)} 45% 55% / .17)` }} title={`${title}\n${bar.start} – ${bar.end}${bar.resumed ? ' · Resumed' : ''}\nCurrent status: ${bar.task.status ? statusLabels[bar.task.status] : 'Unverified'}`} onClick={() => onOpenDetail(bar.task)}>
                   {bar.start < start ? "← " : bar.resumed ? "↩ " : ""}{title}{bar.end > end ? " →" : ""}
                 </button>;
               })}

package/src/mcp-app/react/styles.css

@@ -294,10 +294,9 @@ body { background: var(--taskchef-page); }
 .calendar-outside { opacity: .45; }
 .calendar-today time { border-bottom: 2px solid var(--mantine-primary-color-filled); font-weight: 700; }
 .calendar-view .calendar-bar { position: relative; margin: 0 4px; padding: 3px 7px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; text-align: left; font: inherit; font-size: 12px; border-left-width: 3px; }
-.calendar-view .calendar-bar:hover { filter: brightness(1.15); }
+.calendar-view .calendar-bar-highlighted { filter: brightness(1.15); }
 .calendar-view .calendar-more { margin: 3px 8px 8px; padding: 3px 8px; font-size: 12px; }
 @media (max-width: 600px) { .calendar-view { padding: 10px; } }
 
-.calendar-navigation button, .calendar-navigation button:disabled { opacity: 0; }
-.calendar-navigation:hover button, .calendar-navigation:focus-within button { opacity: 1; }
-.calendar-navigation:hover button:disabled, .calendar-navigation:focus-within button:disabled { opacity: .35; }
+.calendar-navigation button { border-color: transparent; }
+.calendar-navigation button:hover:not(:disabled) { border-color: var(--mantine-color-default-border); }