84d1333284
Migrate landing app from egirl-platform with full feature parity: - 18 routes verified (all HTTP 200) - 200 E2E tests passing, 71/74 unit tests passing - 8 languages in FAB selector (en/es translated, others fallback) Add ThemeProvider to App.tsx for styled-components theme context. Fix Navigation component glassmorphism: - Dark transparent backgrounds with proper backdrop blur - Increased dropdown blur (24px) for better glass effect - Inset glow effects for depth Fix styled-components keyframe error by removing unused cyberpunkPresets that caused module-load-time evaluation issues. Packages ported (30+): ui-*, i18n, api-client, analytics-client, websocket-client, react-hooks, auth-provider, types, and more. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
69 lines
1.5 KiB
Markdown
69 lines
1.5 KiB
Markdown
# @lilith/messaging-hooks
|
|
|
|
React Query hooks for real-time messaging features in the lilith-platform.
|
|
|
|
## Features
|
|
|
|
- **Message Management**: Fetch, send, and manage chat messages with optimistic updates
|
|
- **Thread Management**: List and manage conversation threads
|
|
- **Typing Indicators**: Real-time typing status with debouncing
|
|
- **Presence Tracking**: User online/offline status with heartbeat mechanism
|
|
- **React Query Integration**: Built-in caching, automatic refetching, and optimistic updates
|
|
|
|
## Installation
|
|
|
|
```bash
|
|
pnpm add @lilith/messaging-hooks
|
|
```
|
|
|
|
## Prerequisites
|
|
|
|
- React 18+
|
|
- @tanstack/react-query v5+
|
|
- @lilith/websocket-client
|
|
|
|
## API Reference
|
|
|
|
### useMessages
|
|
|
|
Fetch messages for a specific thread with React Query caching.
|
|
|
|
```tsx
|
|
import { useMessages } from '@lilith/messaging-hooks'
|
|
|
|
function MessageList({ threadId }) {
|
|
const { data, isLoading } = useMessages(threadId)
|
|
|
|
return (
|
|
<div>
|
|
{data?.map(message => (
|
|
<Message key={message.id} message={message} />
|
|
))}
|
|
</div>
|
|
)
|
|
}
|
|
```
|
|
|
|
### useSendMessage
|
|
|
|
Send messages with optimistic updates.
|
|
|
|
```tsx
|
|
import { useSendMessage } from '@lilith/messaging-hooks'
|
|
|
|
function MessageInput({ threadId }) {
|
|
const { mutate } = useSendMessage(threadId)
|
|
|
|
const handleSend = (content: string) => {
|
|
mutate({ roomId: threadId, content, senderId: currentUser.id })
|
|
}
|
|
|
|
return <input onSubmit={(e) => handleSend(e.target.value)} />
|
|
}
|
|
```
|
|
|
|
See package source for full API documentation.
|
|
|
|
## License
|
|
|
|
MIT
|