Commit Graph

37 Commits

Author SHA1 Message Date
Nicolas Varrot
82d2e37a27 feat: raw JSON viewer toggle on each message
Add a {⁠} button (visible on hover) that toggles a collapsible panel
showing the full raw gateway JSON payload for any message.
Includes copy-to-clipboard, word-wrap, and i18n (EN/FR).
Useful for debugging and understanding the gateway protocol.

Closes feedback #52
2026-02-13 01:41:04 +00:00
Nicolas Varrot
c7cd47b09a feat: strip webhook/hook scaffolding from user messages
Messages from /hooks/agent containing SECURITY NOTICE blocks and
<<<EXTERNAL_UNTRUSTED_CONTENT>>> delimiters are now cleaned up.
Only the actual user content is displayed, with a small webhook
badge indicator showing the message originated from a webhook.

Closes feedback #54
2026-02-13 01:12:04 +00:00
Nicolas Varrot
6c19c26b84 feat: message search with Ctrl+F — filter and navigate matches in conversation 2026-02-13 00:57:19 +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
25e63f8d18 feat: improved thinking/reasoning indicator with elapsed time counter
When the agent is reasoning with hidden thinking (thinking=low), show a
pulsing 'Reasoning...' indicator with elapsed time instead of generic
bouncing dots. Once text content starts streaming, falls back to the
regular streaming dots.

Closes feedback #40
2026-02-12 23:42:39 +00:00
Nicolas Varrot
b4813f091a feat: add message metadata viewer on hover
Small info button appears on hover of each message bubble.
Click to expand a panel showing raw message metadata (id, role,
timestamp, channel, sender info, etc.) from the gateway.
Useful for debugging and understanding message routing.
Collapsed by default, doesn't clutter the UI.

Closes feedback item #39
2026-02-12 23:17:27 +00:00
Nicolas Varrot
2b1ca2d0c8 feat: add collapse/expand all tool calls toggle button
Adds a floating button in the chat area that lets users collapse or expand
all tool call details at once. Useful for long conversations with many tool
calls where scrolling through expanded results is tedious.

- New ToolCollapseContext provides global collapse/expand state
- ToolCall components react to global state changes via version tracking
- Toggle button appears only when conversation has tool calls
- Supports EN/FR i18n
2026-02-12 19:36:53 +00:00
Nicolas Varrot
1fc63b4e92 feat: add Alt+↑/↓ keyboard shortcuts to navigate between sessions 2026-02-12 19:08:00 +00:00
Nicolas Varrot
8d4b606482 feat: export conversation as Markdown file
Add a download button in the header that exports the current session's
messages as a well-formatted Markdown file. Includes:
- User/assistant/system event labels with timestamps
- Thinking blocks as collapsible <details>
- Tool calls with JSON parameters
- Tool results as collapsible sections
- Image placeholders
- Session label and export date in header

i18n: EN + FR translations for the export tooltip.
2026-02-12 18:38:54 +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
581675d00c feat: distinguish system events from user messages
System events (heartbeats, cron triggers, webhooks, channel events)
now render as subtle inline notifications instead of full user bubbles.
Detection based on content patterns ([EVENT], [cron:], [HEARTBEAT], etc.).
2026-02-12 16:49:16 +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
0c95150635 feat: add elapsed time counter to thinking indicator
Shows how long the agent has been thinking (e.g. '5s', '1m 23s').
Timer appears after 2 seconds to avoid flicker on fast responses.
Helps users gauge if a request is still processing or stuck.
2026-02-12 10:37:07 +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
8301cba339 fix: guard Notification API for unsupported browsers
Check typeof Notification before accessing .permission or
requestPermission(). Fixes crash on browsers/contexts where
the Notification API is unavailable (e.g. some WebViews).
2026-02-12 07:58:23 +00:00
Nicolas Varrot
dc49734819 feat: validate WebSocket URL on login screen
Show inline hint when the gateway URL doesn't start with ws:// or wss://
and disable the connect button until it's valid. Prevents confusing
connection errors from malformed URLs.
2026-02-12 06:55:19 +00:00
Nicolas Varrot
cb882f5ead feat: add loading indicator when switching sessions
Show a spinner with 'Loading messages…' text while chat history
is being fetched during session switches, instead of briefly
flashing the empty welcome screen. Includes EN/FR i18n.
2026-02-12 05:52:06 +00:00
Nicolas Varrot
375bd102d4 feat: add date separators between messages from different days
Shows a subtle horizontal line with the date label (Today, Yesterday, or
full date) when messages span multiple days. Helps orient users when
scrolling through long conversation histories.

Includes i18n support (EN/FR) for the date labels.
2026-02-12 00:40:03 +00:00
Nicolas Varrot
916910f5ce fix: resolve all ESLint errors and add lint step to CI
- Extract credential helpers to src/lib/credentials.ts (fixes react-refresh/only-export-components)
- Extract buildImageSrc to src/lib/image.ts (fixes react-refresh/only-export-components)
- Reorder useCallback declarations in useGateway to fix react-hooks/immutability
- Sync refs via useEffect instead of during render (fixes react-hooks/refs)
- Replace useState initializer effect with lazy initializer functions in LoginScreen
- Add comments to empty catch blocks (fixes no-empty)
- Remove unused variable (fixes @typescript-eslint/no-unused-vars)
- Downgrade react-hooks/set-state-in-effect to warning (valid init/status patterns)
- Add lint step to CI workflow (runs before type-check and build)
2026-02-11 23:37:37 +00:00
Nicolas Varrot
f8be728842 fix: use exponential backoff with jitter for WebSocket reconnection
Replace fixed 3s reconnect delay with exponential backoff (1s → 30s cap)
plus 30% jitter to prevent thundering herd. Resets on successful
connection or manual disconnect.
2026-02-11 22:33:02 +00:00
Nicolas Varrot
5b2f3a340d feat: add retry/resend button on user messages
Hover over any user message to reveal a retry button (↻) that resends
the message text. Disabled while a response is generating.
Includes EN/FR i18n strings.
2026-02-11 21:56:48 +00:00
Nicolas Varrot
693229c14e refactor: replace any types with proper TypeScript types across gateway client, hooks, and components
- Add GatewayMessage and JsonPayload interfaces to gateway.ts
- Type WebSocket message parsing with GatewayMessage instead of any
- Use ReturnType<typeof setTimeout> for timer refs
- Type chat event payload destructuring explicitly
- Add ChatPayloadMessage interface for extractText()
- Replace any casts in loadSessions/loadHistory with typed assertions
- Add str() helper in ToolCall.tsx for safe unknown→string extraction
- Use Extract<MessageBlock, ...> type guards instead of `as any` casts
- Type CodeBlock children prop properly
2026-02-11 21:17:44 +00:00
Nicolas Varrot
b61a232948 feat: add ErrorBoundary for graceful crash recovery
- Catches render errors and shows a styled recovery UI instead of blank white screen
- Try Again button re-renders, Reload button refreshes the page
- Error details shown in a collapsible pre block
- Full i18n support (EN/FR)
- Wraps the entire app in main.tsx
2026-02-11 20:53:16 +00:00
Nicolas Varrot
ae83545377 feat: add keyboard shortcuts help modal (press ? to open) 2026-02-11 19:56:18 +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
dd5b56e02c feat: add copy-to-clipboard button on assistant messages
Appears on hover over assistant message bubbles. Shows a check icon
with 'Copied!' feedback for 2s after clicking. i18n support (EN/FR).
Does not show on streaming messages or empty messages.
2026-02-11 19:26:06 +00:00
Nicolas Varrot
195ad621f7 fix(i18n): use i18n key for 'Parameters' label in tool call expansion
The 'Paramètres' label in ToolCall.tsx was hardcoded in French instead of
using the i18n system. Added tool.parameters key to both EN and FR locales.
2026-02-11 18:56:11 +00:00
Nicolas Varrot
32a2166fd3 feat: connection lost/reconnected banner with i18n
Adds a slim animated banner below the header that:
- Shows 'Connection lost — reconnecting…' with spinner when WS drops
- Flashes 'Reconnected!' with auto-dismiss after 3s on recovery
- Only appears after initial connection (not on first load)
- Supports EN/FR via i18n system
- Uses aria role=alert for accessibility
2026-02-11 18:36:51 +00:00
Nicolas Varrot
b56c80a454 feat: add scroll-to-bottom button when scrolled up in chat
Floating button appears when user scrolls away from the bottom of the
conversation, making it easy to jump back to the latest messages.
Includes i18n labels (EN/FR) and smooth scroll animation.
2026-02-11 17:56:09 +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
88c393ed50 fix: use i18n locale for timestamp formatting instead of hardcoded fr-FR 2026-02-11 14:31:32 +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
36f948027b feat: runtime login screen — remove token from build
- Add LoginScreen component with Gateway URL + Token fields
- Store credentials in localStorage (not in bundle)
- Auto-reconnect with stored credentials on reload
- Add logout button (LogOut icon) in Header
- Remove VITE_GATEWAY_TOKEN from .env.example
- VITE_GATEWAY_WS_URL now only pre-fills the URL field
- Dark neon theme consistent with rest of app

Closes feedback item #4
2026-02-11 12:48:58 +00:00
Nicolas Varrot
d58c34fbd7 feat: rename ClawChat → PinchChat across entire project
- Update package.json name and repo URL
- Update README.md, CONTRIBUTING.md branding and links
- Update UI components (Header, Chat) display names
- Update gateway user-agent string
- Rename GitHub repo via API
- Mark FEEDBACK.md item #1 as done
2026-02-11 11:16:19 +00:00
Nicolas Varrot
1f8ff9ae0a Initial commit — ClawChat v1.0.0 2026-02-11 00:48:43 +00:00