Commit Graph

32 Commits

Author SHA1 Message Date
Nicolas Varrot
a11cebdc55 a11y: add aria-labels to sidebar footer buttons 2026-02-28 09:02:52 +00:00
Nicolas Varrot
88c98f4a66 a11y: add role and keyboard dismiss to overlay backdrops in Sidebar 2026-02-27 09:02:19 +00:00
Nicolas Varrot
414e2ccae5 fix: session tooltip click-through, copy buttons stopPropagation, rename spacebar (v1.64.2) 2026-02-15 20:39:28 +00:00
Nicolas Varrot
7606a09ba9 fix: clipboard fallback for insecure contexts, session rename via sessions.patch
- Add copyToClipboard utility with execCommand fallback for HTTP deployments (#76)
- Replace all navigator.clipboard.writeText calls with copyToClipboard
- Session rename now persists server-side via sessions.patch (#78)
- Pass onRename callback from App to Sidebar
2026-02-15 20:07:33 +00:00
Nicolas Varrot
7890d34583 feat: session rename — double-click or pencil icon to set custom session names
- Double-click session name in sidebar to rename inline
- Pencil icon on hover for discoverability
- Custom names persisted in localStorage
- Enter to confirm, Escape to cancel, blur to save
- Clear name to revert to auto-generated display name
- Search filter respects custom names
- i18n for all 8 languages
2026-02-15 14:03:10 +00:00
Nicolas Varrot
b3eea972a1 feat: unread message count badges in sidebar sessions 2026-02-15 10:03:02 +00:00
Nicolas Varrot
143e9486c2 feat: PWA install prompt, brand-colored channel icons, image load fix, semantic connection indicator
- Fix image display bug: remove loading='lazy' + use opacity instead of hidden (#66)
- PWA: add id/scope to manifest, fix SW cache name, add install prompt hook + button (#64)
- Colorize channel icons with brand colors (Discord blurple, Telegram blue, etc.) (#68)
- Use semantic green for connection indicator instead of theme accent (#70)
- Replace Sparkles icon with PinchChat logo in sidebar (#65)
- Replace decorative dots in sidebar footer with GitHub link (#71)
2026-02-14 13:58:18 +00:00
Nicolas Varrot
d3b1b931b2 fix: clearer update indicator — current version + separate green badge for available update 2026-02-13 22:11:04 +00:00
Nicolas Varrot
d478eee638 fix: cursor desync in highlighted textarea (#68) + update indicator (#67)
- Remove font-style:italic from .ht-italic (different glyph widths cause desync)
- Remove font-weight:600 from .ht-heading (bolder glyphs are wider)
- Remove background/border-radius from code token spans
- Remove text-decoration from .ht-link
- Token spans now ONLY use color — zero text geometry changes
- Use inherit for font-size/line-height in shared .ht-backdrop/.ht-textarea
- Add update check hook: polls GitHub releases, shows indicator in sidebar
2026-02-13 22:01:25 +00:00
Nicolas Varrot
2b095278c7 feat: session filter chips in sidebar — filter by channel type, active status 2026-02-13 21:54:45 +00:00
Nicolas Varrot
b783ae181b feat: optimistic message rendering with send status indicators
- User messages appear instantly with 'sending' state (dimmed, clock icon)
- Transitions to 'sent' (checkmark) when server acknowledges
- Shows error state (alert icon, retry visible) if send fails
- Applied to both primary and secondary sessions
2026-02-13 09:12:09 +00:00
Nicolas Varrot
de6976bae8 fix: add missing aria-labels to icon-only buttons for accessibility
- Sidebar close button: aria-label for screen readers
- Sidebar search clear button: aria-label
- ChatMessage raw JSON copy button: aria-label
- Added i18n keys: sidebar.close, sidebar.clearSearch (EN + FR)
2026-02-13 05:42:23 +00:00
Nicolas Varrot
f09482e6cb feat: multi-tab split view for 2 sessions side by side
- Add split view button (columns icon) in sidebar session actions
- Click to open any session in a secondary pane alongside the primary
- Resizable divider between panes (drag to resize, persisted in localStorage)
- Secondary pane supports full chat: history, streaming, send, abort
- Close split view via X button or clicking the split icon again
- Each pane has independent scroll, search, and tool collapse
- Keyboard shortcut and i18n support (EN/FR)
2026-02-13 02:44:33 +00:00
Nicolas Varrot
35652eaeb5 feat: drag & drop session reordering in sidebar
- Drag sessions to reorder within pinned/unpinned groups
- Custom order persists in localStorage
- Visual feedback: dragged item fades, drop target highlights
- Disabled during search filtering
- Works alongside existing pin feature (pinned group stays on top)
2026-02-13 02:10:53 +00:00
Nicolas Varrot
b60c0ce3c4 fix: migrate all components to theme-aware CSS variables
Replace ~150 hardcoded Tailwind color classes (bg-zinc-*, text-zinc-*,
border-white/*, text-cyan-*, bg-cyan-*) with CSS custom properties
(--pc-*) across all 17 components.

Add @theme block in index.css for Tailwind v4 theme-aware utility
classes (bg-pc-elevated, text-pc-text, border-pc-border, etc.).

Add --pc-hover, --pc-hover-strong, --pc-separator variables per theme
(white/alpha for dark/OLED, black/alpha for light).

Theme switcher (dark/light/OLED) now actually works — all UI elements
respond to theme changes in real-time.

Fixes #55
2026-02-13 00:29:50 +00:00
Nicolas Varrot
b20bf41bf4 feat: theme switcher — dark, light, OLED modes with configurable accent colors
- Add ThemeContext with CSS custom properties for all base colors
- Three theme modes: Dark (default), Light, OLED Black
- Six accent colors: Cyan, Violet, Emerald, Amber, Rose, Blue
- Theme switcher dropdown in header (palette icon)
- Persisted in localStorage
- CSS variables replace hardcoded hex colors in index.css and components
- i18n support (EN/FR) for theme labels
2026-02-12 23:51:01 +00:00
Nicolas Varrot
53d619c357 feat: relative timestamps, message preview, and recency sort in sidebar
- Show relative time (2m, 3h, 1d) next to each session name
- Display last message preview below session name (truncated to 80 chars)
- Sort sessions by most recently updated (within pinned/unpinned groups)
- Map updatedAt and lastMessagePreview from gateway sessions.list response
2026-02-12 17:59:16 +00:00
Nicolas Varrot
52a1a7f270 feat: human-friendly session titles in header and sidebar
Replace raw session keys/UUIDs with readable names derived from
session metadata (label, kind, channel). Priority: label > kind-based
name (Main, Cron, Task) with channel suffix > cleaned key fallback.

New utility: src/lib/sessionName.ts used by both Header and Sidebar.
2026-02-12 17:35:53 +00:00
Nicolas Varrot
e94325b38a feat: delete session from sidebar with confirmation dialog 2026-02-12 16:57:18 +00:00
Nicolas Varrot
fa9b10ac97 feat: resizable sidebar with drag handle and persisted width 2026-02-12 15:46:39 +00:00
Nicolas Varrot
e24378aa75 feat: add session pinning to sidebar
- Pin icon appears on hover for each session, filled when pinned
- Pinned sessions sort to top of list (preserved across page reloads via localStorage)
- Subtle divider separates pinned from unpinned sessions
- i18n support for pin/unpin labels (EN + FR)
2026-02-12 12:19:18 +00:00
Nicolas Varrot
c0d27a7754 feat: add unread message indicators on sidebar sessions
Show a cyan dot on sessions that received new messages while
viewing a different session. The dot clears when switching to
that session.
2026-02-12 11:36:31 +00:00
Nicolas Varrot
6734b54389 fix: resolve CI lint errors in Sidebar, TypingIndicator, and useGateway
- Sidebar: replace useEffect setState with callback pattern for filter reset
- TypingIndicator: initialize useRef with 0 instead of impure Date.now()
- TypingIndicator: remove redundant setElapsed(0) from mount effect
- useGateway: remove unused eslint-disable directive
2026-02-12 11:27:42 +00:00
Nicolas Varrot
f55a24cb06 feat: add keyboard navigation for session list in sidebar
Arrow Up/Down to navigate sessions, Enter to select, Escape to close.
Sessions use role='option' with aria-selected for screen reader support.
Mouse hover syncs with keyboard focus index for smooth interaction.
2026-02-12 09:56:13 +00:00
Nicolas Varrot
3c5fcdfc73 fix: inject app version from package.json instead of hardcoded 1.0.0
- Add Vite define for __APP_VERSION__ from package.json
- Use dynamic version in gateway connect handshake and userAgent
- Show version number in sidebar footer
- Add globals.d.ts type declaration
2026-02-12 09:37:28 +00:00
Nicolas Varrot
73d9e5f6f2 feat: add channel/type icons to session list in sidebar
Show Discord, Telegram, WhatsApp, Signal, Slack brand icons,
clock icon for cron sessions, bot icon for sub-agents, and
globe icon for webchat sessions. Falls back to message bubble
for unknown channels.

Closes feedback #23
2026-02-12 02:45:33 +00:00
Nicolas Varrot
84c8e24457 style: unify token progress bars with subtle cyan opacity ramp
Replace the disparate gradient/orange/red color scheme with a single
soft sky-blue (rgb 56,189,248) that subtly intensifies as usage grows.
Opacity ramps from 0.35 at low usage to 1.0 at full context.
Applies to both sidebar session bars and header token bar.
2026-02-11 20:15:31 +00:00
Nicolas Varrot
177970988a feat(sidebar): add session search filter with Ctrl+K shortcut
- Search input appears when 4+ sessions exist
- Filters sessions by label/key in real-time
- Ctrl+K / Cmd+K keyboard shortcut to focus search
- Clear button and 'no results' state
- i18n support (EN + FR)
2026-02-11 19:46:28 +00:00
Nicolas Varrot
9b3aed4adc feat: add runtime language selector in header (EN/FR toggle)
- Add LanguageSelector component with globe icon + cycle button
- Refactor i18n to support reactive locale switching via useSyncExternalStore
- Locale priority: localStorage > VITE_LOCALE > navigator.language > 'en'
- All components now use useT() hook for reactive re-rendering on locale change
- Persists choice to localStorage (key: pinchchat-locale)
- No page reload needed — instant switch
2026-02-11 16:18:22 +00:00
Nicolas Varrot
99b7db9793 feat: add i18n support with VITE_LOCALE env var (en/fr)
- Lightweight i18n system in src/lib/i18n.ts (no external deps)
- All UI strings extracted to translation keys
- English (default) and French locales included
- Set VITE_LOCALE=fr in .env for French UI
- Fallback to English for unknown locales
2026-02-11 13:19:20 +00:00
Nicolas Varrot
3370916931 fix: localize UI to English and add ARIA accessibility attributes
- Replace all French UI strings with English (Connected, Thinking, Result, Send, etc.)
- Add role="log" + aria-live="polite" to chat message area
- Add role="form" + aria-label to message input area
- Add aria-label to sidebar toggle, attach file, send, and textarea
- Add role="banner" to header, role="navigation" to sidebar
- Add role="application" to app root
2026-02-11 12:17:54 +00:00
Nicolas Varrot
1f8ff9ae0a Initial commit — ClawChat v1.0.0 2026-02-11 00:48:43 +00:00