Commit Graph
123 Commits
Author SHA1 Message Date
weishu 999ee64852 refactor(web): unify session creation into single page with path history 2025-12-22 21:45:11 +08:00
weishu 0c16b7b215 feat(web): improve token refresh handling with automatic 401 retry and focus-based refresh 2025-12-22 18:29:32 +08:00
weishu aacab0be51 feat(web): add auto-focus to composer input on desktop devices only
Adds touch device detection via media query (pointer: coarse) to prevent
triggering virtual keyboard on mobile. Input auto-focus is now conditional
on desktop environments where it improves keyboard-based interactions.
2025-12-22 09:46:03 +08:00
weishu 7c86f83d5c feat: add switch to remote button for local mode 2025-12-22 00:05:55 +08:00
weishu 16c2e7c7ec fix(web): fix navigation in session creation flow with back buttons
- Add back buttons to MachinesPage and SpawnPage for non-Telegram environments
- Fix navigation after session creation to clear spawn flow from history
- Update useAppGoBack hook to use explicit path navigation for consistent behavior
2025-12-21 23:55:33 +08:00
weishu 56ae2c85a2 feat(cli): add Agent Client Protocol (ACP) integration for external agent support
Implements comprehensive ACP backend enabling integration with ACP-compliant agents like Gemini. Includes stdio transport, message handling, permission flow, and registry for agent management. Adds new 'hapi gemini' command to launch ACP agent sessions.
2025-12-21 18:40:04 +08:00
weishu eac7ff239a fix: improve error handling in git operations and queries 2025-12-20 23:09:53 +08:00
weishu 8ebd4f6ab9 feat: add git integration with file browsing and diff viewing
Add comprehensive git support across the stack:
- CLI: register git RPC handlers (status, diff numstat, diff file)
- Server: create git routes with proper session path resolution
- Web: add file browser, diff viewer, and git status visualization
- Add FileIcon component and git parser utilities
- Add TanStack Router routes for /files and /file pages
- Add git-themed CSS variables for light and dark modes
2025-12-20 23:00:26 +08:00
weishu bf18224d05 fix(web): suppress focus ring on pointer interactions while preserving keyboard accessibility 2025-12-20 19:52:56 +08:00
weishu 3bac5c7bc6 feat(web): integrate TanStack React Router for client-side routing
Replace state-based screen navigation with proper URL-based routing. This includes:
- New router configuration with routes for sessions, machines, and spawn pages
- App context provider to share API and token across the app
- useAppGoBack hook for handling browser and Telegram back navigation
- Refactored App component to render outlet and use router hooks
- Memory history for Telegram app, browser history for web
2025-12-20 16:49:10 +08:00
weishu d2ad977394 server: add SSE events stream for webapp
web: switch webapp updates to SSE
2025-12-19 21:28:53 +08:00
weishu 3a7272d03d feat(web): integrate TanStack Query for state management
Replace manual state management with TanStack Query (React Query) for more robust server state handling. This refactoring introduces:

- New hooks for queries: useSessions, useSession, useMessages, useMachines
- New hooks for mutations: useSendMessage, useSessionActions, useSpawnSession
- Centralized query client with optimized configuration (5s staleTime, disabled window focus refetch)
- Query key factory for consistent cache invalidation
- Improved message synchronization via socket events with cache updates
- Optimistic updates for message sending with retry capability
- Simplified App.tsx by removing manual state management logic
- Integrated React Query devtools in development mode

This enables automatic cache management, better error handling, and a foundation for more sophisticated data fetching patterns.
2025-12-19 18:25:13 +08:00
weishu 7da8144ff6 fix(web): restore dark mode styling broken by conditional Telegram SDK loading
The conditional Telegram SDK loading (commit 4606ba2) caused dark mode to
break in non-Telegram browsers. Added dark mode CSS variable overrides with
proper fallbacks, and restored the module-level applyTheme() call that applies
theme before React renders, preventing a flash of incorrect styling.

- web/src/index.css: Added dark mode overrides for primary colors (--app-bg,
  --app-fg, --app-hint, --app-link, --app-button, --app-button-text,
  --app-secondary-bg) with system-appropriate dark fallbacks when Telegram
  theme variables are unavailable
- web/src/hooks/useTheme.ts: Restored module-level applyTheme(currentScheme)
  call to ensure theme is applied before React renders
2025-12-19 00:15:48 +08:00
weishu 4606ba23d9 feat(web): implement conditional Telegram SDK loading
Add lazy loading of Telegram SDK only when running inside Telegram Mini App
environment instead of unconditionally loading in all browsers. Includes:

- New environment detection functions: isTelegramEnvironment(), isTelegramApp()
- Dynamic SDK loading with 3s timeout via loadTelegramSdk()
- Removed static script tag from index.html
- Made haptic feedback lazy (SDK check on each call)
- Made theme listeners lazy (attached in initializeTheme())
- Updated all components to use unified detection functions

This prevents SDK load time overhead in regular browser environments while
ensuring the app works correctly both in Telegram and browser contexts.
2025-12-18 22:54:40 +08:00
weishu 80b8d2e34f fix: remove unreliable Telegram environment detection to fix loading delay
Remove unreliable conditions from Telegram environment detection in useAuthSource:
- window.Telegram !== undefined: Always true due to unconditional SDK loading
- window.self !== window.top: Causes false positives in iframe scenarios

Only keep URL parameter detection (tgWebApp in search/hash) which is reliable.
This prevents 5-second polling delay before login page displays on PC browser.
2025-12-18 16:28:24 +08:00
weishu be00343289 feat: add iOS Safari install guide and improve PWA UX with neutral theme
- Add iOS Safari install prompt with step-by-step modal guide
- Fix Telegram environment detection (check initData, not just SDK presence)
- Fix install prompt re-entrancy issue (clear deferredPrompt immediately)
- Extract icon components to separate file (web/src/components/icons.tsx)
- Rename "Happy App" to "Hapi" throughout the UI and manifests
- Change button/icon colors from blue (--app-button) to neutral theme (--app-fg/--app-bg)
- Add install dismiss state to prevent repeated prompts
- Improve iOS Safari detection with robust user agent parsing
2025-12-18 14:05:50 +08:00
weishu ea9f0f3b1a feat: implement progressive web app support with offline capabilities
Add complete PWA implementation including service worker registration,
offline support, and installation prompts:

- Add vite-plugin-pwa and workbox-window dependencies for PWA tooling
- Configure VitePWA plugin with web app manifest and app metadata
- Set up Workbox caching strategies for API endpoints and CDN assets
- Implement service worker auto-update with user-triggered refresh
- Create usePWAInstall hook to handle beforeinstallprompt events
- Create useOnlineStatus hook for monitoring network connectivity
- Add InstallPrompt component with haptic feedback integration
- Add OfflineBanner component to notify users of offline status
- Configure PWA icons and assets (64x64, 192x192, 512x512 variants)
- Add TypeScript type declarations for virtual PWA register module
- Integrate PWA components and service worker into App.tsx and main.tsx
- Add PWA meta tags and viewport configuration to index.html
2025-12-18 13:40:36 +08:00
weishu 9be0a96af4 feat: add web vibration api fallback for haptic feedback
Replace no-op browser haptic feedback with Web Vibration API support,
allowing haptic feedback when running outside Telegram Mini App. Also
remove stale react-syntax-highlighter type reference from tsconfig.
2025-12-18 12:53:11 +08:00
weishu cf2b96b566 feat: add browser environment support with access token authentication
Enable the web client to run in plain browser environments alongside Telegram Mini App support:

- Server: Add CLI_API_TOKEN authentication path as alternative to Telegram initData
- Client: Add useAuthSource hook to detect and manage Telegram vs browser auth sources
- Client: Add usePlatform hook for platform abstraction with graceful haptic feedback degradation
- Client: Add LoginPrompt component for browser access token login
- Client: Extend useTheme to fall back to system prefers-color-scheme in browser
- Client: Migrate all direct HapticFeedback calls to use usePlatform hook
2025-12-18 12:45:49 +08:00
weishu a6d088b51d feat: add iOS platform detection and improve dark theme contrast 2025-12-17 18:48:44 +08:00
weishu ec3a849cbd feat: refactor ChatInput with autocomplete, suggestion management, and settings integration
Extract word detection and suggestion logic into reusable utilities and hooks.
Add FloatingOverlay and Autocomplete components for intelligent input assistance.
Integrate settings panel and abort button directly into ChatInput component.
Simplify SessionHeader by removing settings dialog (now in ChatInput).
2025-12-17 09:13:15 +08:00
weishu 0485065b87 refactor: improve message synchronization with sequence-based pagination and merging 2025-12-16 21:07:20 +08:00
weishu b4654acb92 init 2025-12-16 15:03:50 +08:00