@siran/chat-react-hooks 0.1.0 → 0.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +15 -15
- package/dist/ChatContext.d.ts +55 -0
- package/dist/ChatContext.d.ts.map +1 -0
- package/dist/hooks/useChatStore.d.ts +27 -0
- package/dist/hooks/useChatStore.d.ts.map +1 -0
- package/dist/hooks/useConversation.d.ts +30 -0
- package/dist/hooks/useConversation.d.ts.map +1 -0
- package/dist/hooks/useConversations.d.ts +51 -0
- package/dist/hooks/useConversations.d.ts.map +1 -0
- package/dist/hooks/useConversationsWithLastMessages.d.ts +57 -0
- package/dist/hooks/useConversationsWithLastMessages.d.ts.map +1 -0
- package/dist/hooks/useCreateConversation.d.ts +40 -0
- package/dist/hooks/useCreateConversation.d.ts.map +1 -0
- package/dist/hooks/useDeleteMessage.d.ts +38 -0
- package/dist/hooks/useDeleteMessage.d.ts.map +1 -0
- package/dist/hooks/useEditMessage.d.ts +47 -0
- package/dist/hooks/useEditMessage.d.ts.map +1 -0
- package/dist/hooks/useLastMessage.d.ts +8 -0
- package/dist/hooks/useLastMessage.d.ts.map +1 -0
- package/dist/hooks/useMarkMessageAsRead.d.ts +29 -0
- package/dist/hooks/useMarkMessageAsRead.d.ts.map +1 -0
- package/dist/hooks/useMessage.d.ts +30 -0
- package/dist/hooks/useMessage.d.ts.map +1 -0
- package/dist/hooks/useMessages.d.ts +54 -0
- package/dist/hooks/useMessages.d.ts.map +1 -0
- package/dist/hooks/useMessagesPagination.d.ts +27 -0
- package/dist/hooks/useMessagesPagination.d.ts.map +1 -0
- package/dist/hooks/usePresence.d.ts +41 -0
- package/dist/hooks/usePresence.d.ts.map +1 -0
- package/dist/hooks/useSendMessage.d.ts +51 -0
- package/dist/hooks/useSendMessage.d.ts.map +1 -0
- package/dist/hooks/useSubscribeToAllConversations.d.ts +21 -0
- package/dist/hooks/useSubscribeToAllConversations.d.ts.map +1 -0
- package/dist/hooks/useSubscribeToConversation.d.ts +34 -0
- package/dist/hooks/useSubscribeToConversation.d.ts.map +1 -0
- package/dist/hooks/useSubscribeToUser.d.ts +24 -0
- package/dist/hooks/useSubscribeToUser.d.ts.map +1 -0
- package/dist/hooks/useTrackPresence.d.ts +25 -0
- package/dist/hooks/useTrackPresence.d.ts.map +1 -0
- package/dist/hooks/useTyping.d.ts +29 -0
- package/dist/hooks/useTyping.d.ts.map +1 -0
- package/dist/index.d.ts +49 -0
- package/dist/index.d.ts.map +1 -0
- package/package.json +10 -6
package/README.md
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
# @
|
|
1
|
+
# @siran/chat-react-hooks
|
|
2
2
|
|
|
3
3
|
Hooks et contextes React réutilisables pour intégrer le système de chat dans des applications React.
|
|
4
4
|
|
|
@@ -13,7 +13,7 @@ Ce package fait partie du monorepo Sekoliko. Les dépendances sont gérées auto
|
|
|
13
13
|
Enveloppez votre application avec le `ChatProvider` :
|
|
14
14
|
|
|
15
15
|
```tsx
|
|
16
|
-
import { ChatProvider } from "@
|
|
16
|
+
import { ChatProvider } from "@siran/chat-react-hooks";
|
|
17
17
|
import { createChatClient } from "@siran/chat-client";
|
|
18
18
|
|
|
19
19
|
function App() {
|
|
@@ -37,7 +37,7 @@ function App() {
|
|
|
37
37
|
Récupère un message spécifique par son ID depuis le store.
|
|
38
38
|
|
|
39
39
|
```tsx
|
|
40
|
-
import { useMessage } from "@
|
|
40
|
+
import { useMessage } from "@siran/chat-react-hooks";
|
|
41
41
|
|
|
42
42
|
function MessageView({ messageId }: { messageId: string }) {
|
|
43
43
|
const message = useMessage(messageId);
|
|
@@ -61,7 +61,7 @@ Charge et suit les conversations. Modèle: **subscribe → engine pushes updates
|
|
|
61
61
|
**Important**: Utilisez `useSubscribeToUser()` pour recevoir les mises à jour en temps réel.
|
|
62
62
|
|
|
63
63
|
```tsx
|
|
64
|
-
import { useConversations, useSubscribeToUser } from "@
|
|
64
|
+
import { useConversations, useSubscribeToUser } from "@siran/chat-react-hooks";
|
|
65
65
|
|
|
66
66
|
function ConversationsList({ userId }: { userId: string }) {
|
|
67
67
|
// S'abonner aux événements de l'utilisateur pour recevoir les mises à jour
|
|
@@ -96,7 +96,7 @@ Charge et suit les messages d'une conversation. Modèle: **subscribe → engine
|
|
|
96
96
|
**Important**: Utilisez `useSubscribeToConversation()` pour recevoir les mises à jour en temps réel.
|
|
97
97
|
|
|
98
98
|
```tsx
|
|
99
|
-
import { useMessages, useSubscribeToConversation } from "@
|
|
99
|
+
import { useMessages, useSubscribeToConversation } from "@siran/chat-react-hooks";
|
|
100
100
|
|
|
101
101
|
function MessagesList({ conversationId, userId }: { conversationId: string; userId: string }) {
|
|
102
102
|
// S'abonner aux événements de la conversation pour recevoir les mises à jour
|
|
@@ -127,7 +127,7 @@ function MessagesList({ conversationId, userId }: { conversationId: string; user
|
|
|
127
127
|
Obtient les utilisateurs en train de taper dans une conversation.
|
|
128
128
|
|
|
129
129
|
```tsx
|
|
130
|
-
import { useTyping } from "@
|
|
130
|
+
import { useTyping } from "@siran/chat-react-hooks";
|
|
131
131
|
|
|
132
132
|
function TypingIndicator({ conversationId }: { conversationId: string }) {
|
|
133
133
|
const typingUsers = useTyping(conversationId);
|
|
@@ -149,7 +149,7 @@ function TypingIndicator({ conversationId }: { conversationId: string }) {
|
|
|
149
149
|
Obtient la présence d'un utilisateur.
|
|
150
150
|
|
|
151
151
|
```tsx
|
|
152
|
-
import { usePresence } from "@
|
|
152
|
+
import { usePresence } from "@siran/chat-react-hooks";
|
|
153
153
|
|
|
154
154
|
function UserStatus({ userId }: { userId: string }) {
|
|
155
155
|
const presence = usePresence(userId);
|
|
@@ -174,7 +174,7 @@ function UserStatus({ userId }: { userId: string }) {
|
|
|
174
174
|
Envoie un message dans une conversation.
|
|
175
175
|
|
|
176
176
|
```tsx
|
|
177
|
-
import { useSendMessage } from "@
|
|
177
|
+
import { useSendMessage } from "@siran/chat-react-hooks";
|
|
178
178
|
|
|
179
179
|
function MessageInput({ conversationId, senderId }: Props) {
|
|
180
180
|
const [content, setContent] = useState("");
|
|
@@ -215,7 +215,7 @@ function MessageInput({ conversationId, senderId }: Props) {
|
|
|
215
215
|
Crée une nouvelle conversation.
|
|
216
216
|
|
|
217
217
|
```tsx
|
|
218
|
-
import { useCreateConversation } from "@
|
|
218
|
+
import { useCreateConversation } from "@siran/chat-react-hooks";
|
|
219
219
|
|
|
220
220
|
function CreateConversationButton({ participantIds }: Props) {
|
|
221
221
|
const { createConversation, loading, error } = useCreateConversation();
|
|
@@ -245,7 +245,7 @@ function CreateConversationButton({ participantIds }: Props) {
|
|
|
245
245
|
Édite un message existant.
|
|
246
246
|
|
|
247
247
|
```tsx
|
|
248
|
-
import { useEditMessage } from "@
|
|
248
|
+
import { useEditMessage } from "@siran/chat-react-hooks";
|
|
249
249
|
|
|
250
250
|
function EditMessageButton({ messageId }: { messageId: string }) {
|
|
251
251
|
const [newContent, setNewContent] = useState("");
|
|
@@ -282,7 +282,7 @@ function EditMessageButton({ messageId }: { messageId: string }) {
|
|
|
282
282
|
Supprime un message.
|
|
283
283
|
|
|
284
284
|
```tsx
|
|
285
|
-
import { useDeleteMessage } from "@
|
|
285
|
+
import { useDeleteMessage } from "@siran/chat-react-hooks";
|
|
286
286
|
|
|
287
287
|
function DeleteMessageButton({ messageId }: { messageId: string }) {
|
|
288
288
|
const { deleteMessage, loading, error } = useDeleteMessage();
|
|
@@ -310,7 +310,7 @@ function DeleteMessageButton({ messageId }: { messageId: string }) {
|
|
|
310
310
|
Marque un message comme lu.
|
|
311
311
|
|
|
312
312
|
```tsx
|
|
313
|
-
import { useMarkMessageAsRead } from "@
|
|
313
|
+
import { useMarkMessageAsRead } from "@siran/chat-react-hooks";
|
|
314
314
|
|
|
315
315
|
function MessageItem({ messageId }: { messageId: string }) {
|
|
316
316
|
const { markAsRead, loading } = useMarkMessageAsRead();
|
|
@@ -331,7 +331,7 @@ function MessageItem({ messageId }: { messageId: string }) {
|
|
|
331
331
|
S'abonne automatiquement aux événements d'une conversation. Se désabonne automatiquement lors du démontage.
|
|
332
332
|
|
|
333
333
|
```tsx
|
|
334
|
-
import { useSubscribeToConversation } from "@
|
|
334
|
+
import { useSubscribeToConversation } from "@siran/chat-react-hooks";
|
|
335
335
|
|
|
336
336
|
function ConversationView({ conversationId }: { conversationId: string }) {
|
|
337
337
|
// S'abonner automatiquement aux événements de la conversation
|
|
@@ -348,7 +348,7 @@ function ConversationView({ conversationId }: { conversationId: string }) {
|
|
|
348
348
|
S'abonne automatiquement aux événements d'un utilisateur. Se désabonne automatiquement lors du démontage.
|
|
349
349
|
|
|
350
350
|
```tsx
|
|
351
|
-
import { useSubscribeToUser } from "@
|
|
351
|
+
import { useSubscribeToUser } from "@siran/chat-react-hooks";
|
|
352
352
|
|
|
353
353
|
function UserPresence({ userId }: { userId: string }) {
|
|
354
354
|
// S'abonner automatiquement aux événements de l'utilisateur
|
|
@@ -367,7 +367,7 @@ function UserPresence({ userId }: { userId: string }) {
|
|
|
367
367
|
Accède directement au ChatClient. Utile pour des cas d'usage avancés.
|
|
368
368
|
|
|
369
369
|
```tsx
|
|
370
|
-
import { useChat } from "@
|
|
370
|
+
import { useChat } from "@siran/chat-react-hooks";
|
|
371
371
|
|
|
372
372
|
function AdvancedComponent() {
|
|
373
373
|
const chat = useChat();
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* ChatContext - Context React pour fournir le ChatClient à l'application.
|
|
3
|
+
*/
|
|
4
|
+
import { type ReactNode } from "react";
|
|
5
|
+
import type { IChatClient } from "@siran/chat-client";
|
|
6
|
+
/**
|
|
7
|
+
* Props pour le ChatProvider.
|
|
8
|
+
*/
|
|
9
|
+
export interface ChatProviderProps {
|
|
10
|
+
/**
|
|
11
|
+
* Instance du ChatClient à fournir à l'application.
|
|
12
|
+
*/
|
|
13
|
+
client: IChatClient;
|
|
14
|
+
/**
|
|
15
|
+
* Composants enfants qui auront accès au ChatClient.
|
|
16
|
+
*/
|
|
17
|
+
children: ReactNode;
|
|
18
|
+
}
|
|
19
|
+
/**
|
|
20
|
+
* Provider React pour le ChatClient.
|
|
21
|
+
*
|
|
22
|
+
* @example
|
|
23
|
+
* ```tsx
|
|
24
|
+
* import { ChatProvider } from "@siran/chat-react-hooks";
|
|
25
|
+
*
|
|
26
|
+
* function App() {
|
|
27
|
+
* const chatClient = createChatClient({ engine, eventSubscriber });
|
|
28
|
+
*
|
|
29
|
+
* return (
|
|
30
|
+
* <ChatProvider client={chatClient}>
|
|
31
|
+
* <YourApp />
|
|
32
|
+
* </ChatProvider>
|
|
33
|
+
* );
|
|
34
|
+
* }
|
|
35
|
+
* ```
|
|
36
|
+
*/
|
|
37
|
+
export declare function ChatProvider({ client, children }: ChatProviderProps): import("react/jsx-runtime").JSX.Element;
|
|
38
|
+
/**
|
|
39
|
+
* Hook pour accéder au ChatClient depuis le context.
|
|
40
|
+
*
|
|
41
|
+
* @throws {Error} Si utilisé en dehors d'un ChatProvider
|
|
42
|
+
*
|
|
43
|
+
* @example
|
|
44
|
+
* ```tsx
|
|
45
|
+
* function MyComponent() {
|
|
46
|
+
* const chat = useChat();
|
|
47
|
+
*
|
|
48
|
+
* const handleSend = async () => {
|
|
49
|
+
* await chat.sendMessage({ ... });
|
|
50
|
+
* };
|
|
51
|
+
* }
|
|
52
|
+
* ```
|
|
53
|
+
*/
|
|
54
|
+
export declare function useChat(): IChatClient;
|
|
55
|
+
//# sourceMappingURL=ChatContext.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ChatContext.d.ts","sourceRoot":"","sources":["../src/ChatContext.tsx"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAA6B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAClE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAQtD;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC;;OAEG;IACH,MAAM,EAAE,WAAW,CAAC;IAEpB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,YAAY,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,iBAAiB,2CAEnE;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,OAAO,IAAI,WAAW,CAQrC"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Hook pour s'abonner au store du ChatClient.
|
|
3
|
+
* Utilise useSyncExternalStore pour une intégration optimale avec React.
|
|
4
|
+
*/
|
|
5
|
+
import type { ChatStoreSnapshot } from "@siran/chat-client";
|
|
6
|
+
/**
|
|
7
|
+
* Hook pour accéder au snapshot actuel du store.
|
|
8
|
+
* Se met automatiquement à jour lorsque le store change.
|
|
9
|
+
*
|
|
10
|
+
* @returns Le snapshot actuel du store contenant toutes les données mises en cache
|
|
11
|
+
*
|
|
12
|
+
* @example
|
|
13
|
+
* ```tsx
|
|
14
|
+
* function ChatData() {
|
|
15
|
+
* const snapshot = useChatStore();
|
|
16
|
+
*
|
|
17
|
+
* return (
|
|
18
|
+
* <div>
|
|
19
|
+
* <p>Conversations: {snapshot.conversations.length}</p>
|
|
20
|
+
* <p>Messages dans conv-1: {snapshot.messages["conv-1"]?.length || 0}</p>
|
|
21
|
+
* </div>
|
|
22
|
+
* );
|
|
23
|
+
* }
|
|
24
|
+
* ```
|
|
25
|
+
*/
|
|
26
|
+
export declare function useChatStore(): ChatStoreSnapshot;
|
|
27
|
+
//# sourceMappingURL=useChatStore.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useChatStore.d.ts","sourceRoot":"","sources":["../../src/hooks/useChatStore.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAIH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAE5D;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,YAAY,IAAI,iBAAiB,CAahD"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import type { Conversation } from '@siran/chat-core';
|
|
2
|
+
/**
|
|
3
|
+
* Hook pour récupérer une conversation spécifique depuis le store du client.
|
|
4
|
+
*
|
|
5
|
+
* La conversation doit être déjà chargée dans le store (via useConversations ou subscription).
|
|
6
|
+
* Si la conversation n'est pas dans le store, elle sera undefined.
|
|
7
|
+
*
|
|
8
|
+
* Le hook s'abonne automatiquement aux changements du store via le client.
|
|
9
|
+
* Optimisé pour ne se re-rendre que lorsque la conversation spécifique change.
|
|
10
|
+
*
|
|
11
|
+
* @param conversationId - ID de la conversation à récupérer
|
|
12
|
+
*
|
|
13
|
+
* @returns La conversation trouvée ou undefined
|
|
14
|
+
*
|
|
15
|
+
* @example
|
|
16
|
+
* ```tsx
|
|
17
|
+
* function ChatHeader() {
|
|
18
|
+
* const { conversationId } = useChatContext();
|
|
19
|
+
* const conversation = useConversation(conversationId);
|
|
20
|
+
*
|
|
21
|
+
* return (
|
|
22
|
+
* <View>
|
|
23
|
+
* <Text>{conversation?.name || 'Conversation'}</Text>
|
|
24
|
+
* </View>
|
|
25
|
+
* );
|
|
26
|
+
* }
|
|
27
|
+
* ```
|
|
28
|
+
*/
|
|
29
|
+
export declare function useConversation(conversationId: string | undefined): Conversation | undefined;
|
|
30
|
+
//# sourceMappingURL=useConversation.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useConversation.d.ts","sourceRoot":"","sources":["../../src/hooks/useConversation.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAErD;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,wBAAgB,eAAe,CAAC,cAAc,EAAE,MAAM,GAAG,SAAS,GAAG,YAAY,GAAG,SAAS,CAiD5F"}
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Hook pour gérer les conversations.
|
|
3
|
+
*/
|
|
4
|
+
import type { GetConversationsInput } from "@siran/chat-core";
|
|
5
|
+
/**
|
|
6
|
+
* Hook pour charger et suivre les conversations.
|
|
7
|
+
*
|
|
8
|
+
* Modèle: subscribe → engine pushes updates
|
|
9
|
+
* - Charge les conversations une fois au montage (si autoLoad est true)
|
|
10
|
+
* - Les mises à jour arrivent automatiquement via les événements temps réel du store
|
|
11
|
+
* - Pas de polling, tout passe par les événements temps réel
|
|
12
|
+
*
|
|
13
|
+
* @param input - Paramètres pour charger les conversations (optionnel)
|
|
14
|
+
* @param options - Options supplémentaires
|
|
15
|
+
* @param options.autoLoad - Si true, charge les conversations automatiquement au montage (défaut: true)
|
|
16
|
+
*
|
|
17
|
+
* @returns État des conversations et fonction pour recharger
|
|
18
|
+
*
|
|
19
|
+
* @example
|
|
20
|
+
* ```tsx
|
|
21
|
+
* function ConversationsList() {
|
|
22
|
+
* // S'abonner aux événements de l'utilisateur pour recevoir les mises à jour
|
|
23
|
+
* useSubscribeToUser("user-123");
|
|
24
|
+
*
|
|
25
|
+
* const { conversations, loading, error, refetch } = useConversations({
|
|
26
|
+
* userId: "user-123",
|
|
27
|
+
* status: "active",
|
|
28
|
+
* });
|
|
29
|
+
*
|
|
30
|
+
* if (loading) return <div>Chargement...</div>;
|
|
31
|
+
* if (error) return <div>Erreur: {error.message}</div>;
|
|
32
|
+
*
|
|
33
|
+
* return (
|
|
34
|
+
* <ul>
|
|
35
|
+
* {conversations.map(conv => (
|
|
36
|
+
* <li key={conv.id}>{conv.name || conv.id}</li>
|
|
37
|
+
* ))}
|
|
38
|
+
* </ul>
|
|
39
|
+
* );
|
|
40
|
+
* }
|
|
41
|
+
* ```
|
|
42
|
+
*/
|
|
43
|
+
export declare function useConversations(input?: GetConversationsInput, options?: {
|
|
44
|
+
autoLoad?: boolean;
|
|
45
|
+
}): {
|
|
46
|
+
conversations: Conversation[];
|
|
47
|
+
loading: boolean;
|
|
48
|
+
error: Error | null;
|
|
49
|
+
refetch: () => Promise<void>;
|
|
50
|
+
};
|
|
51
|
+
//# sourceMappingURL=useConversations.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useConversations.d.ts","sourceRoot":"","sources":["../../src/hooks/useConversations.ts"],"names":[],"mappings":"AAAA;;GAEG;AAIH,OAAO,KAAK,EAEV,qBAAqB,EAEtB,MAAM,kBAAkB,CAAC;AAW1B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,wBAAgB,gBAAgB,CAC9B,KAAK,CAAC,EAAE,qBAAqB,EAC7B,OAAO,CAAC,EAAE;IACR,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;;;;;EAkGF"}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Hook pour récupérer les conversations avec leurs derniers messages.
|
|
3
|
+
*/
|
|
4
|
+
import type { Conversation, ChatMessage, GetConversationsInput } from "@siran/chat-core";
|
|
5
|
+
/**
|
|
6
|
+
* Représente une conversation avec son dernier message.
|
|
7
|
+
*/
|
|
8
|
+
export interface ConversationWithLastMessage {
|
|
9
|
+
conversation: Conversation;
|
|
10
|
+
lastMessage: ChatMessage | undefined;
|
|
11
|
+
}
|
|
12
|
+
/**
|
|
13
|
+
* Hook optimisé pour charger les conversations avec leurs derniers messages.
|
|
14
|
+
*
|
|
15
|
+
* Utilise la requête optimisée qui charge tout en une seule requête.
|
|
16
|
+
* Les derniers messages sont automatiquement associés à leurs conversations.
|
|
17
|
+
*
|
|
18
|
+
* @param input - Paramètres pour charger les conversations
|
|
19
|
+
* @param options - Options supplémentaires
|
|
20
|
+
* @param options.autoLoad - Si true, charge automatiquement au montage (défaut: true)
|
|
21
|
+
*
|
|
22
|
+
* @returns État des conversations avec derniers messages et fonction pour recharger
|
|
23
|
+
*
|
|
24
|
+
* @example
|
|
25
|
+
* ```tsx
|
|
26
|
+
* function ConversationsList() {
|
|
27
|
+
* useSubscribeToUser("user-123");
|
|
28
|
+
*
|
|
29
|
+
* const { conversationsWithLastMessages, loading, error, refetch } = useConversationsWithLastMessages({
|
|
30
|
+
* userId: "user-123",
|
|
31
|
+
* });
|
|
32
|
+
*
|
|
33
|
+
* if (loading) return <div>Chargement...</div>;
|
|
34
|
+
* if (error) return <div>Erreur: {error.message}</div>;
|
|
35
|
+
*
|
|
36
|
+
* return (
|
|
37
|
+
* <ul>
|
|
38
|
+
* {conversationsWithLastMessages.map(({ conversation, lastMessage }) => (
|
|
39
|
+
* <li key={conversation.id}>
|
|
40
|
+
* <span>{conversation.name || conversation.id}</span>
|
|
41
|
+
* {lastMessage && <p>{lastMessage.content}</p>}
|
|
42
|
+
* </li>
|
|
43
|
+
* ))}
|
|
44
|
+
* </ul>
|
|
45
|
+
* );
|
|
46
|
+
* }
|
|
47
|
+
* ```
|
|
48
|
+
*/
|
|
49
|
+
export declare function useConversationsWithLastMessages(input?: GetConversationsInput, options?: {
|
|
50
|
+
autoLoad?: boolean;
|
|
51
|
+
}): {
|
|
52
|
+
conversationsWithLastMessages: ConversationWithLastMessage[];
|
|
53
|
+
loading: boolean;
|
|
54
|
+
error: Error | null;
|
|
55
|
+
refetch: () => Promise<void>;
|
|
56
|
+
};
|
|
57
|
+
//# sourceMappingURL=useConversationsWithLastMessages.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useConversationsWithLastMessages.d.ts","sourceRoot":"","sources":["../../src/hooks/useConversationsWithLastMessages.ts"],"names":[],"mappings":"AAAA;;GAEG;AAIH,OAAO,KAAK,EACV,YAAY,EACZ,WAAW,EACX,qBAAqB,EACtB,MAAM,kBAAkB,CAAC;AAW1B;;GAEG;AACH,MAAM,WAAW,2BAA2B;IAC1C,YAAY,EAAE,YAAY,CAAC;IAC3B,WAAW,EAAE,WAAW,GAAG,SAAS,CAAC;CACtC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,wBAAgB,gCAAgC,CAC9C,KAAK,CAAC,EAAE,qBAAqB,EAC7B,OAAO,CAAC,EAAE;IACR,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;;;;;EAyGF"}
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Hook pour créer une conversation.
|
|
3
|
+
*/
|
|
4
|
+
import type { CreateConversationInput, CreateConversationResult } from "@siran/chat-core";
|
|
5
|
+
/**
|
|
6
|
+
* Hook pour créer une nouvelle conversation.
|
|
7
|
+
*
|
|
8
|
+
* @returns Fonction pour créer une conversation et état de la mutation
|
|
9
|
+
*
|
|
10
|
+
* @example
|
|
11
|
+
* ```tsx
|
|
12
|
+
* function CreateConversationButton({ participantIds }: Props) {
|
|
13
|
+
* const { createConversation, loading, error } = useCreateConversation();
|
|
14
|
+
*
|
|
15
|
+
* const handleCreate = async () => {
|
|
16
|
+
* const result = await createConversation({
|
|
17
|
+
* type: "direct",
|
|
18
|
+
* participantIds,
|
|
19
|
+
* createdBy: "user-123",
|
|
20
|
+
* });
|
|
21
|
+
*
|
|
22
|
+
* if (result.ok) {
|
|
23
|
+
* console.log("Conversation créée:", result.conversation.id);
|
|
24
|
+
* }
|
|
25
|
+
* };
|
|
26
|
+
*
|
|
27
|
+
* return (
|
|
28
|
+
* <button onClick={handleCreate} disabled={loading}>
|
|
29
|
+
* {loading ? "Création..." : "Créer une conversation"}
|
|
30
|
+
* </button>
|
|
31
|
+
* );
|
|
32
|
+
* }
|
|
33
|
+
* ```
|
|
34
|
+
*/
|
|
35
|
+
export declare function useCreateConversation(): {
|
|
36
|
+
createConversation: (input: CreateConversationInput) => Promise<CreateConversationResult>;
|
|
37
|
+
loading: boolean;
|
|
38
|
+
error: Error | null;
|
|
39
|
+
};
|
|
40
|
+
//# sourceMappingURL=useCreateConversation.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useCreateConversation.d.ts","sourceRoot":"","sources":["../../src/hooks/useCreateConversation.ts"],"names":[],"mappings":"AAAA;;GAEG;AAIH,OAAO,KAAK,EACV,uBAAuB,EACvB,wBAAwB,EACzB,MAAM,kBAAkB,CAAC;AAU1B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,wBAAgB,qBAAqB;gCAQnB,uBAAuB,KAAG,OAAO,CAAC,wBAAwB,CAAC;;;EAgC5E"}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Hook pour supprimer un message.
|
|
3
|
+
*/
|
|
4
|
+
import type { DeleteMessageInput, DeleteMessageResult } from "@siran/chat-core";
|
|
5
|
+
/**
|
|
6
|
+
* Hook pour supprimer un message.
|
|
7
|
+
*
|
|
8
|
+
* @returns Fonction pour supprimer un message et état de la mutation
|
|
9
|
+
*
|
|
10
|
+
* @example
|
|
11
|
+
* ```tsx
|
|
12
|
+
* function DeleteMessageButton({ messageId }: { messageId: string }) {
|
|
13
|
+
* const { deleteMessage, loading, error } = useDeleteMessage();
|
|
14
|
+
*
|
|
15
|
+
* const handleDelete = async () => {
|
|
16
|
+
* if (confirm("Êtes-vous sûr de vouloir supprimer ce message ?")) {
|
|
17
|
+
* const result = await deleteMessage({ messageId });
|
|
18
|
+
*
|
|
19
|
+
* if (result.ok) {
|
|
20
|
+
* console.log("Message supprimé");
|
|
21
|
+
* }
|
|
22
|
+
* }
|
|
23
|
+
* };
|
|
24
|
+
*
|
|
25
|
+
* return (
|
|
26
|
+
* <button onClick={handleDelete} disabled={loading}>
|
|
27
|
+
* {loading ? "Suppression..." : "Supprimer"}
|
|
28
|
+
* </button>
|
|
29
|
+
* );
|
|
30
|
+
* }
|
|
31
|
+
* ```
|
|
32
|
+
*/
|
|
33
|
+
export declare function useDeleteMessage(): {
|
|
34
|
+
deleteMessage: (input: DeleteMessageInput) => Promise<DeleteMessageResult>;
|
|
35
|
+
loading: boolean;
|
|
36
|
+
error: Error | null;
|
|
37
|
+
};
|
|
38
|
+
//# sourceMappingURL=useDeleteMessage.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useDeleteMessage.d.ts","sourceRoot":"","sources":["../../src/hooks/useDeleteMessage.ts"],"names":[],"mappings":"AAAA;;GAEG;AAIH,OAAO,KAAK,EACV,kBAAkB,EAClB,mBAAmB,EACpB,MAAM,kBAAkB,CAAC;AAU1B;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,wBAAgB,gBAAgB;2BAQd,kBAAkB,KAAG,OAAO,CAAC,mBAAmB,CAAC;;;EAgClE"}
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Hook pour éditer un message.
|
|
3
|
+
*/
|
|
4
|
+
import type { EditMessageInput, EditMessageResult } from "@siran/chat-core";
|
|
5
|
+
/**
|
|
6
|
+
* Hook pour éditer un message existant.
|
|
7
|
+
*
|
|
8
|
+
* @returns Fonction pour éditer un message et état de la mutation
|
|
9
|
+
*
|
|
10
|
+
* @example
|
|
11
|
+
* ```tsx
|
|
12
|
+
* function EditMessageButton({ messageId }: { messageId: string }) {
|
|
13
|
+
* const [newContent, setNewContent] = useState("");
|
|
14
|
+
* const { editMessage, loading, error } = useEditMessage();
|
|
15
|
+
*
|
|
16
|
+
* const handleEdit = async () => {
|
|
17
|
+
* const result = await editMessage({
|
|
18
|
+
* messageId,
|
|
19
|
+
* content: newContent,
|
|
20
|
+
* });
|
|
21
|
+
*
|
|
22
|
+
* if (result.ok) {
|
|
23
|
+
* console.log("Message édité");
|
|
24
|
+
* }
|
|
25
|
+
* };
|
|
26
|
+
*
|
|
27
|
+
* return (
|
|
28
|
+
* <div>
|
|
29
|
+
* <input
|
|
30
|
+
* value={newContent}
|
|
31
|
+
* onChange={(e) => setNewContent(e.target.value)}
|
|
32
|
+
* />
|
|
33
|
+
* <button onClick={handleEdit} disabled={loading}>
|
|
34
|
+
* {loading ? "Édition..." : "Éditer"}
|
|
35
|
+
* </button>
|
|
36
|
+
* {error && <div>Erreur: {error.message}</div>}
|
|
37
|
+
* </div>
|
|
38
|
+
* );
|
|
39
|
+
* }
|
|
40
|
+
* ```
|
|
41
|
+
*/
|
|
42
|
+
export declare function useEditMessage(): {
|
|
43
|
+
editMessage: (input: EditMessageInput) => Promise<EditMessageResult>;
|
|
44
|
+
loading: boolean;
|
|
45
|
+
error: Error | null;
|
|
46
|
+
};
|
|
47
|
+
//# sourceMappingURL=useEditMessage.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useEditMessage.d.ts","sourceRoot":"","sources":["../../src/hooks/useEditMessage.ts"],"names":[],"mappings":"AAAA;;GAEG;AAIH,OAAO,KAAK,EACV,gBAAgB,EAChB,iBAAiB,EAClB,MAAM,kBAAkB,CAAC;AAU1B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,wBAAgB,cAAc;yBAQZ,gBAAgB,KAAG,OAAO,CAAC,iBAAiB,CAAC;;;EAgC9D"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { ChatMessage } from "@siran/chat-core";
|
|
2
|
+
/**
|
|
3
|
+
* Hook pour récupérer le dernier message d'une conversation depuis le store.
|
|
4
|
+
*
|
|
5
|
+
* Optimisé pour ne se re-render que lorsque le dernier message de cette conversation change.
|
|
6
|
+
*/
|
|
7
|
+
export declare function useLastMessage(conversationId: string | undefined): ChatMessage | undefined;
|
|
8
|
+
//# sourceMappingURL=useLastMessage.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useLastMessage.d.ts","sourceRoot":"","sources":["../../src/hooks/useLastMessage.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAEpD;;;;GAIG;AACH,wBAAgB,cAAc,CAAC,cAAc,EAAE,MAAM,GAAG,SAAS,GAAG,WAAW,GAAG,SAAS,CAqD1F"}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Hook pour marquer un message comme lu.
|
|
3
|
+
*/
|
|
4
|
+
import type { MarkMessageAsReadInput, MarkMessageAsReadResult } from "@siran/chat-core";
|
|
5
|
+
/**
|
|
6
|
+
* Hook pour marquer un message comme lu.
|
|
7
|
+
*
|
|
8
|
+
* @returns Fonction pour marquer un message comme lu et état de la mutation
|
|
9
|
+
*
|
|
10
|
+
* @example
|
|
11
|
+
* ```tsx
|
|
12
|
+
* function MessageItem({ messageId }: { messageId: string }) {
|
|
13
|
+
* const { markAsRead, loading } = useMarkMessageAsRead();
|
|
14
|
+
*
|
|
15
|
+
* useEffect(() => {
|
|
16
|
+
* // Marquer comme lu quand le message devient visible
|
|
17
|
+
* markAsRead({ messageId });
|
|
18
|
+
* }, [messageId, markAsRead]);
|
|
19
|
+
*
|
|
20
|
+
* return <div>Message...</div>;
|
|
21
|
+
* }
|
|
22
|
+
* ```
|
|
23
|
+
*/
|
|
24
|
+
export declare function useMarkMessageAsRead(): {
|
|
25
|
+
markAsRead: (input: MarkMessageAsReadInput) => Promise<MarkMessageAsReadResult>;
|
|
26
|
+
loading: boolean;
|
|
27
|
+
error: Error | null;
|
|
28
|
+
};
|
|
29
|
+
//# sourceMappingURL=useMarkMessageAsRead.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useMarkMessageAsRead.d.ts","sourceRoot":"","sources":["../../src/hooks/useMarkMessageAsRead.ts"],"names":[],"mappings":"AAAA;;GAEG;AAIH,OAAO,KAAK,EACV,sBAAsB,EACtB,uBAAuB,EACxB,MAAM,kBAAkB,CAAC;AAU1B;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,oBAAoB;wBAQlB,sBAAsB,KAAG,OAAO,CAAC,uBAAuB,CAAC;;;EAgC1E"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Hook pour récupérer un message spécifique par son ID.
|
|
3
|
+
*/
|
|
4
|
+
import type { ChatMessage } from "@siran/chat-core";
|
|
5
|
+
/**
|
|
6
|
+
* Hook pour récupérer un message spécifique depuis le store.
|
|
7
|
+
*
|
|
8
|
+
* Modèle: subscribe → engine pushes updates
|
|
9
|
+
* - Le message est récupéré depuis le store (mis à jour via les événements temps réel)
|
|
10
|
+
* - Retourne undefined si le message n'est pas trouvé dans le store
|
|
11
|
+
*
|
|
12
|
+
* @param messageId - ID du message à récupérer
|
|
13
|
+
*
|
|
14
|
+
* @returns Le message trouvé ou undefined
|
|
15
|
+
*
|
|
16
|
+
* @example
|
|
17
|
+
* ```tsx
|
|
18
|
+
* function MessageView({ messageId }: { messageId: string }) {
|
|
19
|
+
* const message = useMessage(messageId);
|
|
20
|
+
*
|
|
21
|
+
* if (!message) {
|
|
22
|
+
* return <div>Message non trouvé</div>;
|
|
23
|
+
* }
|
|
24
|
+
*
|
|
25
|
+
* return <div>{message.content}</div>;
|
|
26
|
+
* }
|
|
27
|
+
* ```
|
|
28
|
+
*/
|
|
29
|
+
export declare function useMessage(messageId: string | undefined): ChatMessage | undefined;
|
|
30
|
+
//# sourceMappingURL=useMessage.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useMessage.d.ts","sourceRoot":"","sources":["../../src/hooks/useMessage.ts"],"names":[],"mappings":"AAAA;;GAEG;AAIH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAEpD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,wBAAgB,UAAU,CAAC,SAAS,EAAE,MAAM,GAAG,SAAS,GAAG,WAAW,GAAG,SAAS,CAiBjF"}
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Hook pour gérer les messages d'une conversation.
|
|
3
|
+
*/
|
|
4
|
+
import type { GetMessagesInput } from "@siran/chat-core";
|
|
5
|
+
/**
|
|
6
|
+
* Hook pour charger et suivre les messages d'une conversation.
|
|
7
|
+
*
|
|
8
|
+
* Modèle: subscribe → engine pushes updates
|
|
9
|
+
* - Charge les messages une fois au montage (si autoLoad est true)
|
|
10
|
+
* - Les mises à jour arrivent automatiquement via les événements temps réel du store
|
|
11
|
+
* - Pas de polling, tout passe par les événements temps réel
|
|
12
|
+
*
|
|
13
|
+
* @param conversationId - ID de la conversation
|
|
14
|
+
* @param userId - ID de l'utilisateur (requis pour vérifier les permissions)
|
|
15
|
+
* @param input - Paramètres supplémentaires pour charger les messages (optionnel)
|
|
16
|
+
* @param options - Options supplémentaires
|
|
17
|
+
* @param options.autoLoad - Si true, charge les messages automatiquement au montage (défaut: true)
|
|
18
|
+
*
|
|
19
|
+
* @returns État des messages et fonction pour recharger
|
|
20
|
+
*
|
|
21
|
+
* @example
|
|
22
|
+
* ```tsx
|
|
23
|
+
* function MessagesList({ conversationId, userId }: { conversationId: string; userId: string }) {
|
|
24
|
+
* // S'abonner aux événements de la conversation pour recevoir les mises à jour
|
|
25
|
+
* useSubscribeToConversation(conversationId);
|
|
26
|
+
*
|
|
27
|
+
* const { messages, loading, error, refetch } = useMessages(conversationId, userId, {
|
|
28
|
+
* options: { limit: 50 },
|
|
29
|
+
* });
|
|
30
|
+
*
|
|
31
|
+
* if (loading) return <div>Chargement...</div>;
|
|
32
|
+
* if (error) return <div>Erreur: {error.message}</div>;
|
|
33
|
+
*
|
|
34
|
+
* return (
|
|
35
|
+
* <ul>
|
|
36
|
+
* {messages.map(msg => (
|
|
37
|
+
* <li key={msg.id}>{msg.content}</li>
|
|
38
|
+
* ))}
|
|
39
|
+
* </ul>
|
|
40
|
+
* );
|
|
41
|
+
* }
|
|
42
|
+
* ```
|
|
43
|
+
*/
|
|
44
|
+
export declare function useMessages(conversationId: string, userId: string, input?: {
|
|
45
|
+
options?: GetMessagesInput["options"];
|
|
46
|
+
}, options?: {
|
|
47
|
+
autoLoad?: boolean;
|
|
48
|
+
}): {
|
|
49
|
+
messages: ChatMessage[];
|
|
50
|
+
loading: boolean;
|
|
51
|
+
error: Error | null;
|
|
52
|
+
refetch: () => Promise<void>;
|
|
53
|
+
};
|
|
54
|
+
//# sourceMappingURL=useMessages.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useMessages.d.ts","sourceRoot":"","sources":["../../src/hooks/useMessages.ts"],"names":[],"mappings":"AAAA;;GAEG;AAKH,OAAO,KAAK,EAEV,gBAAgB,EAEjB,MAAM,kBAAkB,CAAC;AAW1B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,wBAAgB,WAAW,CACzB,cAAc,EAAE,MAAM,EACtB,MAAM,EAAE,MAAM,EACd,KAAK,CAAC,EAAE;IACN,OAAO,CAAC,EAAE,gBAAgB,CAAC,SAAS,CAAC,CAAC;CACvC,EACD,OAAO,CAAC,EAAE;IACR,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;;;;;EAiEF"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import type { ChatMessage } from '@siran/chat-core';
|
|
2
|
+
export interface UseMessagesPaginationOptions {
|
|
3
|
+
conversationId: string;
|
|
4
|
+
userId: string;
|
|
5
|
+
autoLoad?: boolean;
|
|
6
|
+
}
|
|
7
|
+
export interface UseMessagesPaginationResult {
|
|
8
|
+
messages: ChatMessage[];
|
|
9
|
+
loading: boolean;
|
|
10
|
+
error: Error | null;
|
|
11
|
+
loadingMore: boolean;
|
|
12
|
+
hasMoreMessages: boolean;
|
|
13
|
+
loadMoreMessages: () => void;
|
|
14
|
+
}
|
|
15
|
+
/**
|
|
16
|
+
* Hook sélecteur pour récupérer les messages paginés depuis le store.
|
|
17
|
+
* Le store est la seule source de vérité.
|
|
18
|
+
*
|
|
19
|
+
* @param options - Options de configuration
|
|
20
|
+
* @param options.conversationId - ID de la conversation
|
|
21
|
+
* @param options.userId - ID de l'utilisateur (requis pour vérifier les permissions)
|
|
22
|
+
* @param options.autoLoad - Si true, charge les messages automatiquement au montage (défaut: true)
|
|
23
|
+
*
|
|
24
|
+
* @returns État des messages et fonction pour charger plus
|
|
25
|
+
*/
|
|
26
|
+
export declare function useMessagesPagination({ conversationId, userId, autoLoad, }: UseMessagesPaginationOptions): UseMessagesPaginationResult;
|
|
27
|
+
//# sourceMappingURL=useMessagesPagination.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useMessagesPagination.d.ts","sourceRoot":"","sources":["../../src/hooks/useMessagesPagination.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAgBpD,MAAM,WAAW,4BAA4B;IAC3C,cAAc,EAAE,MAAM,CAAC;IACvB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,2BAA2B;IAC1C,QAAQ,EAAE,WAAW,EAAE,CAAC;IACxB,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,WAAW,EAAE,OAAO,CAAC;IACrB,eAAe,EAAE,OAAO,CAAC;IACzB,gBAAgB,EAAE,MAAM,IAAI,CAAC;CAC9B;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,cAAc,EACd,MAAM,EACN,QAAe,GAChB,EAAE,4BAA4B,GAAG,2BAA2B,CAwJ5D"}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Hook pour gérer la présence des utilisateurs.
|
|
3
|
+
*/
|
|
4
|
+
/**
|
|
5
|
+
* Type pour le statut de présence d'un utilisateur.
|
|
6
|
+
*/
|
|
7
|
+
export type PresenceStatus = "online" | "offline" | "away" | "busy";
|
|
8
|
+
/**
|
|
9
|
+
* Informations de présence d'un utilisateur.
|
|
10
|
+
*/
|
|
11
|
+
export interface Presence {
|
|
12
|
+
status: PresenceStatus;
|
|
13
|
+
lastSeenAt?: Date;
|
|
14
|
+
}
|
|
15
|
+
/**
|
|
16
|
+
* Hook pour obtenir la présence d'un utilisateur.
|
|
17
|
+
*
|
|
18
|
+
* @param userId - ID de l'utilisateur
|
|
19
|
+
*
|
|
20
|
+
* @returns Informations de présence de l'utilisateur, ou undefined si non disponible
|
|
21
|
+
*
|
|
22
|
+
* @example
|
|
23
|
+
* ```tsx
|
|
24
|
+
* function UserStatus({ userId }: { userId: string }) {
|
|
25
|
+
* const presence = usePresence(userId);
|
|
26
|
+
*
|
|
27
|
+
* if (!presence) return <span>Statut inconnu</span>;
|
|
28
|
+
*
|
|
29
|
+
* return (
|
|
30
|
+
* <div>
|
|
31
|
+
* <span>Statut: {presence.status}</span>
|
|
32
|
+
* {presence.lastSeenAt && (
|
|
33
|
+
* <span>Vu pour la dernière fois: {presence.lastSeenAt.toLocaleString()}</span>
|
|
34
|
+
* )}
|
|
35
|
+
* </div>
|
|
36
|
+
* );
|
|
37
|
+
* }
|
|
38
|
+
* ```
|
|
39
|
+
*/
|
|
40
|
+
export declare function usePresence(userId: string): Presence | undefined;
|
|
41
|
+
//# sourceMappingURL=usePresence.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"usePresence.d.ts","sourceRoot":"","sources":["../../src/hooks/usePresence.ts"],"names":[],"mappings":"AAAA;;GAEG;AAIH;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,CAAC;AAEpE;;GAEG;AACH,MAAM,WAAW,QAAQ;IACvB,MAAM,EAAE,cAAc,CAAC;IACvB,UAAU,CAAC,EAAE,IAAI,CAAC;CACnB;AAED;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,wBAAgB,WAAW,CAAC,MAAM,EAAE,MAAM,GAAG,QAAQ,GAAG,SAAS,CAGhE"}
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Hook pour envoyer un message.
|
|
3
|
+
*/
|
|
4
|
+
import type { SendMessageInput, SendMessageResult } from "@siran/chat-core";
|
|
5
|
+
/**
|
|
6
|
+
* Hook pour envoyer un message dans une conversation.
|
|
7
|
+
*
|
|
8
|
+
* @returns Fonction pour envoyer un message et état de la mutation
|
|
9
|
+
*
|
|
10
|
+
* @example
|
|
11
|
+
* ```tsx
|
|
12
|
+
* function MessageInput({ conversationId, senderId }: Props) {
|
|
13
|
+
* const [content, setContent] = useState("");
|
|
14
|
+
* const { sendMessage, loading, error } = useSendMessage();
|
|
15
|
+
*
|
|
16
|
+
* const handleSubmit = async (e: FormEvent) => {
|
|
17
|
+
* e.preventDefault();
|
|
18
|
+
*
|
|
19
|
+
* const result = await sendMessage({
|
|
20
|
+
* conversationId,
|
|
21
|
+
* senderId,
|
|
22
|
+
* content,
|
|
23
|
+
* });
|
|
24
|
+
*
|
|
25
|
+
* if (result.ok) {
|
|
26
|
+
* setContent("");
|
|
27
|
+
* }
|
|
28
|
+
* };
|
|
29
|
+
*
|
|
30
|
+
* return (
|
|
31
|
+
* <form onSubmit={handleSubmit}>
|
|
32
|
+
* <input
|
|
33
|
+
* value={content}
|
|
34
|
+
* onChange={(e) => setContent(e.target.value)}
|
|
35
|
+
* disabled={loading}
|
|
36
|
+
* />
|
|
37
|
+
* <button type="submit" disabled={loading}>
|
|
38
|
+
* {loading ? "Envoi..." : "Envoyer"}
|
|
39
|
+
* </button>
|
|
40
|
+
* {error && <div>Erreur: {error.message}</div>}
|
|
41
|
+
* </form>
|
|
42
|
+
* );
|
|
43
|
+
* }
|
|
44
|
+
* ```
|
|
45
|
+
*/
|
|
46
|
+
export declare function useSendMessage(): {
|
|
47
|
+
sendMessage: (input: SendMessageInput) => Promise<SendMessageResult>;
|
|
48
|
+
loading: boolean;
|
|
49
|
+
error: Error | null;
|
|
50
|
+
};
|
|
51
|
+
//# sourceMappingURL=useSendMessage.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useSendMessage.d.ts","sourceRoot":"","sources":["../../src/hooks/useSendMessage.ts"],"names":[],"mappings":"AAAA;;GAEG;AAIH,OAAO,KAAK,EACV,gBAAgB,EAChB,iBAAiB,EAClB,MAAM,kBAAkB,CAAC;AAU1B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AACH,wBAAgB,cAAc;yBAQZ,gBAAgB,KAAG,OAAO,CAAC,iBAAiB,CAAC;;;EAgC9D"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Hook pour s'abonner automatiquement à toutes les conversations de l'utilisateur
|
|
3
|
+
* après le login.
|
|
4
|
+
*
|
|
5
|
+
* Cela permet de recevoir les messages en temps réel dans toutes les conversations,
|
|
6
|
+
* pas seulement celle qui est actuellement ouverte.
|
|
7
|
+
*/
|
|
8
|
+
export interface UseSubscribeToAllConversationsOptions {
|
|
9
|
+
userId: string;
|
|
10
|
+
enabled?: boolean;
|
|
11
|
+
}
|
|
12
|
+
/**
|
|
13
|
+
* Hook pour s'abonner automatiquement à toutes les conversations de l'utilisateur.
|
|
14
|
+
*
|
|
15
|
+
* @param options - Options de configuration
|
|
16
|
+
* @param options.userId - ID de l'utilisateur
|
|
17
|
+
* @param options.enabled - Active/désactive le hook (défaut: true)
|
|
18
|
+
* @returns { isReady } - isReady est true quand toutes les subscriptions sont établies
|
|
19
|
+
*/
|
|
20
|
+
export declare function useSubscribeToAllConversations({ userId, enabled, }: UseSubscribeToAllConversationsOptions): void;
|
|
21
|
+
//# sourceMappingURL=useSubscribeToAllConversations.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useSubscribeToAllConversations.d.ts","sourceRoot":"","sources":["../../src/hooks/useSubscribeToAllConversations.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAMH,MAAM,WAAW,qCAAqC;IACpD,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED;;;;;;;GAOG;AACH,wBAAgB,8BAA8B,CAAC,EAC7C,MAAM,EACN,OAAc,GACf,EAAE,qCAAqC,GAAG,IAAI,CA2C9C"}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Hook pour s'abonner aux événements d'une conversation.
|
|
3
|
+
*/
|
|
4
|
+
/**
|
|
5
|
+
* Hook pour s'abonner automatiquement aux événements d'une conversation.
|
|
6
|
+
* Se désabonne automatiquement lors du démontage du composant.
|
|
7
|
+
*
|
|
8
|
+
* @param conversationId - ID de la conversation à laquelle s'abonner
|
|
9
|
+
* @param options - Options de configuration
|
|
10
|
+
* @param options.enabled - Si false, ne s'abonne pas (défaut: true)
|
|
11
|
+
* @param options.userId - ID de l'utilisateur courant. Si fourni, marque automatiquement
|
|
12
|
+
* les messages comme "livrés" lors de l'abonnement
|
|
13
|
+
*
|
|
14
|
+
* @example
|
|
15
|
+
* ```tsx
|
|
16
|
+
* function ConversationView({ conversationId }: { conversationId: string }) {
|
|
17
|
+
* const currentUser = useCurrentUser();
|
|
18
|
+
*
|
|
19
|
+
* // S'abonner et marquer les messages comme livrés
|
|
20
|
+
* useSubscribeToConversation(conversationId, {
|
|
21
|
+
* userId: currentUser?.id,
|
|
22
|
+
* });
|
|
23
|
+
*
|
|
24
|
+
* const messages = useMessages(conversationId);
|
|
25
|
+
*
|
|
26
|
+
* return <div>Messages...</div>;
|
|
27
|
+
* }
|
|
28
|
+
* ```
|
|
29
|
+
*/
|
|
30
|
+
export declare function useSubscribeToConversation(conversationId: string, options?: {
|
|
31
|
+
enabled?: boolean;
|
|
32
|
+
userId?: string;
|
|
33
|
+
}): void;
|
|
34
|
+
//# sourceMappingURL=useSubscribeToConversation.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useSubscribeToConversation.d.ts","sourceRoot":"","sources":["../../src/hooks/useSubscribeToConversation.ts"],"names":[],"mappings":"AAAA;;GAEG;AAKH;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,0BAA0B,CACxC,cAAc,EAAE,MAAM,EACtB,OAAO,GAAE;IAAE,OAAO,CAAC,EAAE,OAAO,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAA;CAAO,GACnD,IAAI,CAgBN"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Hook pour s'abonner aux événements d'un utilisateur.
|
|
3
|
+
*/
|
|
4
|
+
/**
|
|
5
|
+
* Hook pour s'abonner automatiquement aux événements d'un utilisateur.
|
|
6
|
+
* Se désabonne automatiquement lors du démontage du composant.
|
|
7
|
+
*
|
|
8
|
+
* @param userId - ID de l'utilisateur auquel s'abonner
|
|
9
|
+
* @param enabled - Si false, ne s'abonne pas (défaut: true)
|
|
10
|
+
*
|
|
11
|
+
* @example
|
|
12
|
+
* ```tsx
|
|
13
|
+
* function UserPresence({ userId }: { userId: string }) {
|
|
14
|
+
* // S'abonner automatiquement aux événements de l'utilisateur
|
|
15
|
+
* useSubscribeToUser(userId);
|
|
16
|
+
*
|
|
17
|
+
* const presence = usePresence(userId);
|
|
18
|
+
*
|
|
19
|
+
* return <div>Statut: {presence?.status}</div>;
|
|
20
|
+
* }
|
|
21
|
+
* ```
|
|
22
|
+
*/
|
|
23
|
+
export declare function useSubscribeToUser(userId: string, enabled?: boolean): void;
|
|
24
|
+
//# sourceMappingURL=useSubscribeToUser.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useSubscribeToUser.d.ts","sourceRoot":"","sources":["../../src/hooks/useSubscribeToUser.ts"],"names":[],"mappings":"AAAA;;GAEG;AAKH;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,kBAAkB,CAChC,MAAM,EAAE,MAAM,EACd,OAAO,GAAE,OAAc,GACtB,IAAI,CAcN"}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Hook pour tracker la présence de l'utilisateur courant.
|
|
3
|
+
*/
|
|
4
|
+
/**
|
|
5
|
+
* Hook pour tracker automatiquement la présence de l'utilisateur courant.
|
|
6
|
+
* Quand ce hook est actif, les autres utilisateurs verront cet utilisateur comme "en ligne".
|
|
7
|
+
* Se désactive automatiquement lors du démontage du composant.
|
|
8
|
+
*
|
|
9
|
+
* @param userId - ID de l'utilisateur dont on veut tracker la présence
|
|
10
|
+
* @param enabled - Si false, ne track pas la présence (défaut: true)
|
|
11
|
+
*
|
|
12
|
+
* @example
|
|
13
|
+
* ```tsx
|
|
14
|
+
* function App() {
|
|
15
|
+
* const currentUser = useCurrentUser();
|
|
16
|
+
*
|
|
17
|
+
* // Track la présence de l'utilisateur connecté
|
|
18
|
+
* useTrackPresence(currentUser?.id || '', !!currentUser);
|
|
19
|
+
*
|
|
20
|
+
* return <MainApp />;
|
|
21
|
+
* }
|
|
22
|
+
* ```
|
|
23
|
+
*/
|
|
24
|
+
export declare function useTrackPresence(userId: string, enabled?: boolean): void;
|
|
25
|
+
//# sourceMappingURL=useTrackPresence.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useTrackPresence.d.ts","sourceRoot":"","sources":["../../src/hooks/useTrackPresence.ts"],"names":[],"mappings":"AAAA;;GAEG;AAKH;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,GAAE,OAAc,GAAG,IAAI,CAc9E"}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Hook pour gérer l'état de frappe (typing) dans une conversation.
|
|
3
|
+
*/
|
|
4
|
+
/**
|
|
5
|
+
* Hook pour obtenir les utilisateurs en train de taper dans une conversation.
|
|
6
|
+
*
|
|
7
|
+
* @param conversationId - ID de la conversation
|
|
8
|
+
*
|
|
9
|
+
* @returns Liste des IDs des utilisateurs en train de taper
|
|
10
|
+
*
|
|
11
|
+
* @example
|
|
12
|
+
* ```tsx
|
|
13
|
+
* function TypingIndicator({ conversationId }: { conversationId: string }) {
|
|
14
|
+
* const typingUsers = useTyping(conversationId);
|
|
15
|
+
*
|
|
16
|
+
* if (typingUsers.length === 0) return null;
|
|
17
|
+
*
|
|
18
|
+
* return (
|
|
19
|
+
* <div>
|
|
20
|
+
* {typingUsers.length === 1
|
|
21
|
+
* ? `Utilisateur ${typingUsers[0]} est en train de taper...`
|
|
22
|
+
* : `${typingUsers.length} utilisateurs sont en train de taper...`}
|
|
23
|
+
* </div>
|
|
24
|
+
* );
|
|
25
|
+
* }
|
|
26
|
+
* ```
|
|
27
|
+
*/
|
|
28
|
+
export declare function useTyping(conversationId: string): string[];
|
|
29
|
+
//# sourceMappingURL=useTyping.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useTyping.d.ts","sourceRoot":"","sources":["../../src/hooks/useTyping.ts"],"names":[],"mappings":"AAAA;;GAEG;AAIH;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,wBAAgB,SAAS,CAAC,cAAc,EAAE,MAAM,GAAG,MAAM,EAAE,CAG1D"}
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @siran/chat-react-hooks
|
|
3
|
+
*
|
|
4
|
+
* Hooks et contextes React réutilisables pour intégrer le système de chat
|
|
5
|
+
* dans des applications React.
|
|
6
|
+
*
|
|
7
|
+
* @example
|
|
8
|
+
* ```tsx
|
|
9
|
+
* import { ChatProvider, useConversations, useMessages, useSendMessage } from "@siran/chat-react-hooks";
|
|
10
|
+
*
|
|
11
|
+
* function App() {
|
|
12
|
+
* const chatClient = createChatClient({ engine, eventSubscriber });
|
|
13
|
+
*
|
|
14
|
+
* return (
|
|
15
|
+
* <ChatProvider client={chatClient}>
|
|
16
|
+
* <ChatApp />
|
|
17
|
+
* </ChatProvider>
|
|
18
|
+
* );
|
|
19
|
+
* }
|
|
20
|
+
*
|
|
21
|
+
* function ChatApp() {
|
|
22
|
+
* const { conversations } = useConversations({ userId: "user-123" });
|
|
23
|
+
* const { messages } = useMessages("conv-456");
|
|
24
|
+
* const { sendMessage } = useSendMessage();
|
|
25
|
+
*
|
|
26
|
+
* return <div>...</div>;
|
|
27
|
+
* }
|
|
28
|
+
* ```
|
|
29
|
+
*/
|
|
30
|
+
export { ChatProvider, useChat, type ChatProviderProps, } from "./ChatContext";
|
|
31
|
+
export { useConversations, } from "./hooks/useConversations";
|
|
32
|
+
export { useConversationsWithLastMessages, type ConversationWithLastMessage, } from "./hooks/useConversationsWithLastMessages";
|
|
33
|
+
export { useConversation, } from "./hooks/useConversation";
|
|
34
|
+
export { useMessages, } from "./hooks/useMessages";
|
|
35
|
+
export { useMessage, } from "./hooks/useMessage";
|
|
36
|
+
export { useLastMessage, } from "./hooks/useLastMessage";
|
|
37
|
+
export { useTyping, } from "./hooks/useTyping";
|
|
38
|
+
export { usePresence, type Presence, type PresenceStatus, } from "./hooks/usePresence";
|
|
39
|
+
export { useMessagesPagination, } from "./hooks/useMessagesPagination";
|
|
40
|
+
export { useSendMessage, } from "./hooks/useSendMessage";
|
|
41
|
+
export { useCreateConversation, } from "./hooks/useCreateConversation";
|
|
42
|
+
export { useEditMessage, } from "./hooks/useEditMessage";
|
|
43
|
+
export { useDeleteMessage, } from "./hooks/useDeleteMessage";
|
|
44
|
+
export { useMarkMessageAsRead, } from "./hooks/useMarkMessageAsRead";
|
|
45
|
+
export { useSubscribeToConversation, } from "./hooks/useSubscribeToConversation";
|
|
46
|
+
export { useSubscribeToUser, } from "./hooks/useSubscribeToUser";
|
|
47
|
+
export { useTrackPresence, } from "./hooks/useTrackPresence";
|
|
48
|
+
export { useSubscribeToAllConversations, type UseSubscribeToAllConversationsOptions, } from "./hooks/useSubscribeToAllConversations";
|
|
49
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AAGH,OAAO,EACL,YAAY,EACZ,OAAO,EACP,KAAK,iBAAiB,GACvB,MAAM,eAAe,CAAC;AAGvB,OAAO,EACL,gBAAgB,GACjB,MAAM,0BAA0B,CAAC;AAClC,OAAO,EACL,gCAAgC,EAChC,KAAK,2BAA2B,GACjC,MAAM,0CAA0C,CAAC;AAClD,OAAO,EACL,eAAe,GAChB,MAAM,yBAAyB,CAAC;AACjC,OAAO,EACL,WAAW,GACZ,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EACL,UAAU,GACX,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EACL,cAAc,GACf,MAAM,wBAAwB,CAAC;AAChC,OAAO,EACL,SAAS,GACV,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EACL,WAAW,EACX,KAAK,QAAQ,EACb,KAAK,cAAc,GACpB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EACL,qBAAqB,GACtB,MAAM,+BAA+B,CAAC;AAGvC,OAAO,EACL,cAAc,GACf,MAAM,wBAAwB,CAAC;AAChC,OAAO,EACL,qBAAqB,GACtB,MAAM,+BAA+B,CAAC;AACvC,OAAO,EACL,cAAc,GACf,MAAM,wBAAwB,CAAC;AAChC,OAAO,EACL,gBAAgB,GACjB,MAAM,0BAA0B,CAAC;AAClC,OAAO,EACL,oBAAoB,GACrB,MAAM,8BAA8B,CAAC;AAEtC,OAAO,EACL,0BAA0B,GAC3B,MAAM,oCAAoC,CAAC;AAC5C,OAAO,EACL,kBAAkB,GACnB,MAAM,4BAA4B,CAAC;AACpC,OAAO,EACL,gBAAgB,GACjB,MAAM,0BAA0B,CAAC;AAClC,OAAO,EACL,8BAA8B,EAC9B,KAAK,qCAAqC,GAC3C,MAAM,wCAAwC,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@siran/chat-react-hooks",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.1",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"exports": {
|
|
6
6
|
".": {
|
|
@@ -10,17 +10,17 @@
|
|
|
10
10
|
},
|
|
11
11
|
"main": "./dist/index.js",
|
|
12
12
|
"types": "./dist/index.d.ts",
|
|
13
|
-
"files": [
|
|
13
|
+
"files": [
|
|
14
|
+
"dist"
|
|
15
|
+
],
|
|
14
16
|
"scripts": {
|
|
15
17
|
"build:js": "bun build src/index.ts --outdir dist --target=node",
|
|
16
18
|
"build:types": "tsc --emitDeclarationOnly",
|
|
17
19
|
"build": "bun run build:js && bun run build:types"
|
|
18
20
|
},
|
|
19
21
|
"dependencies": {
|
|
20
|
-
"
|
|
21
|
-
"
|
|
22
|
-
"@siran/chat-client": "workspace:*",
|
|
23
|
-
"@siran/chat-core": "workspace:*"
|
|
22
|
+
"@siran/chat-client": "0.1.1",
|
|
23
|
+
"@siran/chat-core": "0.1.0"
|
|
24
24
|
},
|
|
25
25
|
"devDependencies": {
|
|
26
26
|
"@happy-dom/global-registrator": "^20.3.4",
|
|
@@ -29,5 +29,9 @@
|
|
|
29
29
|
"@types/react": "^19",
|
|
30
30
|
"@types/react-dom": "^19",
|
|
31
31
|
"happy-dom": "^17.4.4"
|
|
32
|
+
},
|
|
33
|
+
"peerDependencies": {
|
|
34
|
+
"react": "^19",
|
|
35
|
+
"react-dom": "^19"
|
|
32
36
|
}
|
|
33
37
|
}
|