@webinex/chatify 1.0.0-alpha08 → 1.0.0-build1
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/dist/cjs/index.js +1 -1
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/types/core/action.d.ts +4 -1
- package/dist/cjs/types/core/models.d.ts +2 -2
- package/dist/cjs/types/ui/Chatify.d.ts +4 -4
- package/dist/cjs/types/ui/Message.d.ts +1 -1
- package/dist/cjs/types/ui/SendingMessage.d.ts +1 -1
- package/dist/cjs/types/ui/localizer.d.ts +1 -0
- package/dist/css/chatify.css +56 -56
- package/dist/esm/index.js +1 -1
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/types/core/action.d.ts +4 -1
- package/dist/esm/types/core/models.d.ts +2 -2
- package/dist/esm/types/ui/Chatify.d.ts +4 -4
- package/dist/esm/types/ui/Message.d.ts +1 -1
- package/dist/esm/types/ui/SendingMessage.d.ts +1 -1
- package/dist/esm/types/ui/localizer.d.ts +1 -0
- package/dist/index.d.ts +11 -7
- package/package.json +1 -1
- package/src/core/action.tsx +38 -1
- package/src/core/models.tsx +2 -2
- package/src/core/useSignalRMonitor.tsx +6 -3
- package/src/ui/ChatSettings.tsx +1 -1
- package/src/ui/Chatify.tsx +4 -4
- package/src/ui/Message.tsx +3 -3
- package/src/ui/SendingMessage.tsx +4 -4
- package/src/ui/SystemMessage.tsx +5 -1
- package/src/ui/localizer.tsx +2 -0
- package/src/ui/styles/index.scss +4 -4
|
@@ -35,14 +35,14 @@ export interface SendMessageRequest {
|
|
|
35
35
|
files: File[];
|
|
36
36
|
requestId: string;
|
|
37
37
|
}
|
|
38
|
-
export interface
|
|
38
|
+
export interface MessageBody {
|
|
39
39
|
text: string;
|
|
40
40
|
files: File[];
|
|
41
41
|
}
|
|
42
42
|
export interface AddChatRequest {
|
|
43
43
|
requestId: string;
|
|
44
44
|
name: string;
|
|
45
|
-
message?:
|
|
45
|
+
message?: MessageBody;
|
|
46
46
|
members: string[];
|
|
47
47
|
}
|
|
48
48
|
export interface ReadRequest {
|
|
@@ -8,8 +8,8 @@ import { AddChatButton } from './AddChatButton';
|
|
|
8
8
|
import { Footer } from './Footer';
|
|
9
9
|
import { ChatName } from './ChatName';
|
|
10
10
|
import { ChatListItemBox, ChatListItemLastMessage, ChatListItemLastMessageAuthor, ChatListItemLastMessageContent, ChatListItemName, ChatListItemUnreadCount } from './ChatListItem';
|
|
11
|
-
import { SendingMessage,
|
|
12
|
-
import { MessageAuthor,
|
|
11
|
+
import { SendingMessage, SendingMessageContent, SendingMessageInfoBox, SendingMessageText } from './SendingMessage';
|
|
12
|
+
import { MessageAuthor, MessageContent, MessageBox, MessageInfoBox, MessageReadObserver, MessageRow, MessageText } from './Message';
|
|
13
13
|
import { Icon } from './Icon';
|
|
14
14
|
export interface ChatifyCustomizeValue {
|
|
15
15
|
Avatar?: typeof Avatar.Component | null;
|
|
@@ -26,13 +26,13 @@ export interface ChatifyCustomizeValue {
|
|
|
26
26
|
ChatListItemLastMessageAuthor?: typeof ChatListItemLastMessageAuthor.Component | null;
|
|
27
27
|
ChatListItemLastMessageContent?: typeof ChatListItemLastMessageContent.Component | null;
|
|
28
28
|
SendingMessage?: typeof SendingMessage.Component | null;
|
|
29
|
-
SendingMessageBody?: typeof
|
|
29
|
+
SendingMessageBody?: typeof SendingMessageContent.Component | null;
|
|
30
30
|
SendingMessageInfoBox?: typeof SendingMessageInfoBox.Component | null;
|
|
31
31
|
SendingMessageText?: typeof SendingMessageText.Component | null;
|
|
32
32
|
MessageBox?: typeof MessageBox.Component | null;
|
|
33
33
|
MessageReadObserver?: typeof MessageReadObserver.Component | null;
|
|
34
34
|
MessageRow?: typeof MessageRow.Component | null;
|
|
35
|
-
|
|
35
|
+
MessageContent?: typeof MessageContent.Component | null;
|
|
36
36
|
MessageInfoBox?: typeof MessageInfoBox.Component | null;
|
|
37
37
|
MessageText?: typeof MessageText.Component | null;
|
|
38
38
|
MessageAuthor?: typeof MessageAuthor.Component | null;
|
|
@@ -9,7 +9,7 @@ export interface MessageRowProps extends MessageBoxProps {
|
|
|
9
9
|
export declare const MessageAuthor: import("../util").Customizable<FC<MessageBoxProps>, string>;
|
|
10
10
|
export declare const MessageText: import("../util").Customizable<FC<MessageBoxProps>, string>;
|
|
11
11
|
export declare const MessageInfoBox: import("../util").Customizable<FC<MessageBoxProps>, string>;
|
|
12
|
-
export declare const
|
|
12
|
+
export declare const MessageContent: import("../util").Customizable<FC<MessageBoxProps>, string>;
|
|
13
13
|
export declare const MessageRow: import("../util").Customizable<FC<MessageRowProps>, string>;
|
|
14
14
|
export declare const MessageBox: import("../util").Customizable<FC<MessageBoxProps>, string>;
|
|
15
15
|
export interface MessageReadObserverProps extends MessageBoxProps {
|
|
@@ -6,5 +6,5 @@ export interface SendingMessageProps {
|
|
|
6
6
|
}
|
|
7
7
|
export declare const SendingMessageText: import("../util").Customizable<FC<SendingMessageProps>, string>;
|
|
8
8
|
export declare const SendingMessageInfoBox: import("../util").Customizable<FC<SendingMessageProps>, string>;
|
|
9
|
-
export declare const
|
|
9
|
+
export declare const SendingMessageContent: import("../util").Customizable<FC<SendingMessageProps>, string>;
|
|
10
10
|
export declare const SendingMessage: import("../util").Customizable<FC<SendingMessageProps>, string>;
|
package/dist/index.d.ts
CHANGED
|
@@ -7,6 +7,7 @@ interface Localizer {
|
|
|
7
7
|
timestamp: (value: string) => string;
|
|
8
8
|
system: {
|
|
9
9
|
chatCreated: () => string;
|
|
10
|
+
memberAdded: () => string;
|
|
10
11
|
};
|
|
11
12
|
message: {
|
|
12
13
|
read: () => React$1.ReactNode;
|
|
@@ -76,14 +77,14 @@ interface SendMessageRequest {
|
|
|
76
77
|
files: File[];
|
|
77
78
|
requestId: string;
|
|
78
79
|
}
|
|
79
|
-
interface
|
|
80
|
+
interface MessageBody {
|
|
80
81
|
text: string;
|
|
81
82
|
files: File[];
|
|
82
83
|
}
|
|
83
84
|
interface AddChatRequest {
|
|
84
85
|
requestId: string;
|
|
85
86
|
name: string;
|
|
86
|
-
message?:
|
|
87
|
+
message?: MessageBody;
|
|
87
88
|
members: string[];
|
|
88
89
|
}
|
|
89
90
|
interface ReadRequest {
|
|
@@ -217,9 +218,12 @@ declare const ACTIONS: {
|
|
|
217
218
|
read_received: (state: State, { events }: {
|
|
218
219
|
events: ReadEvent[];
|
|
219
220
|
}) => State;
|
|
220
|
-
member_added: (state: State, { chatId, account }: {
|
|
221
|
+
member_added: (state: State, { chatId, chatName, account, me, message, }: {
|
|
221
222
|
chatId: string;
|
|
223
|
+
chatName: string;
|
|
222
224
|
account: Account;
|
|
225
|
+
me: string;
|
|
226
|
+
message: Message;
|
|
223
227
|
}) => State;
|
|
224
228
|
member_removed: (state: State, { chatId, accountId, deleteHistory, me, }: {
|
|
225
229
|
chatId: string;
|
|
@@ -321,7 +325,7 @@ interface SendingMessageProps {
|
|
|
321
325
|
}
|
|
322
326
|
declare const SendingMessageText: Customizable<FC<SendingMessageProps>, string>;
|
|
323
327
|
declare const SendingMessageInfoBox: Customizable<FC<SendingMessageProps>, string>;
|
|
324
|
-
declare const
|
|
328
|
+
declare const SendingMessageContent: Customizable<FC<SendingMessageProps>, string>;
|
|
325
329
|
declare const SendingMessage: Customizable<FC<SendingMessageProps>, string>;
|
|
326
330
|
|
|
327
331
|
interface MessageBoxProps {
|
|
@@ -333,7 +337,7 @@ interface MessageRowProps extends MessageBoxProps {
|
|
|
333
337
|
declare const MessageAuthor: Customizable<FC<MessageBoxProps>, string>;
|
|
334
338
|
declare const MessageText: Customizable<FC<MessageBoxProps>, string>;
|
|
335
339
|
declare const MessageInfoBox: Customizable<FC<MessageBoxProps>, string>;
|
|
336
|
-
declare const
|
|
340
|
+
declare const MessageContent: Customizable<FC<MessageBoxProps>, string>;
|
|
337
341
|
declare const MessageRow: Customizable<FC<MessageRowProps>, string>;
|
|
338
342
|
declare const MessageBox: Customizable<FC<MessageBoxProps>, string>;
|
|
339
343
|
interface MessageReadObserverProps extends MessageBoxProps {
|
|
@@ -363,13 +367,13 @@ interface ChatifyCustomizeValue {
|
|
|
363
367
|
ChatListItemLastMessageAuthor?: typeof ChatListItemLastMessageAuthor.Component | null;
|
|
364
368
|
ChatListItemLastMessageContent?: typeof ChatListItemLastMessageContent.Component | null;
|
|
365
369
|
SendingMessage?: typeof SendingMessage.Component | null;
|
|
366
|
-
SendingMessageBody?: typeof
|
|
370
|
+
SendingMessageBody?: typeof SendingMessageContent.Component | null;
|
|
367
371
|
SendingMessageInfoBox?: typeof SendingMessageInfoBox.Component | null;
|
|
368
372
|
SendingMessageText?: typeof SendingMessageText.Component | null;
|
|
369
373
|
MessageBox?: typeof MessageBox.Component | null;
|
|
370
374
|
MessageReadObserver?: typeof MessageReadObserver.Component | null;
|
|
371
375
|
MessageRow?: typeof MessageRow.Component | null;
|
|
372
|
-
|
|
376
|
+
MessageContent?: typeof MessageContent.Component | null;
|
|
373
377
|
MessageInfoBox?: typeof MessageInfoBox.Component | null;
|
|
374
378
|
MessageText?: typeof MessageText.Component | null;
|
|
375
379
|
MessageAuthor?: typeof MessageAuthor.Component | null;
|
package/package.json
CHANGED
package/src/core/action.tsx
CHANGED
|
@@ -214,7 +214,16 @@ export const ACTIONS = {
|
|
|
214
214
|
return state;
|
|
215
215
|
},
|
|
216
216
|
|
|
217
|
-
member_added: (
|
|
217
|
+
member_added: (
|
|
218
|
+
state: State,
|
|
219
|
+
{
|
|
220
|
+
chatId,
|
|
221
|
+
chatName,
|
|
222
|
+
account,
|
|
223
|
+
me,
|
|
224
|
+
message,
|
|
225
|
+
}: { chatId: string; chatName: string; account: Account; me: string; message: Message },
|
|
226
|
+
): State => {
|
|
218
227
|
state = {
|
|
219
228
|
...state,
|
|
220
229
|
query: {
|
|
@@ -230,6 +239,34 @@ export const ACTIONS = {
|
|
|
230
239
|
state.query['chat.' + chatId].data.members = [...state.query['chat.' + chatId].data.members, account];
|
|
231
240
|
}
|
|
232
241
|
|
|
242
|
+
if (state.query['messages.' + chatId]?.data !== undefined) {
|
|
243
|
+
state.query['messages.' + chatId] = {
|
|
244
|
+
...state.query['messages.' + chatId],
|
|
245
|
+
data: [{ type: 'message', ...message }, ...state.query['messages.' + chatId].data],
|
|
246
|
+
};
|
|
247
|
+
}
|
|
248
|
+
|
|
249
|
+
if (account.id !== me && state.query['chat-list'].data !== undefined) {
|
|
250
|
+
state.query['chat-list'] = { ...state.query['chat-list'] };
|
|
251
|
+
state.query['chat-list'].data = state.query['chat-list'].data.map((x: ChatListItem) =>
|
|
252
|
+
x.id === chatId ? { ...x, message: { ...message } } : x,
|
|
253
|
+
);
|
|
254
|
+
}
|
|
255
|
+
|
|
256
|
+
if (account.id === me && state.query['chat-list'].data !== undefined) {
|
|
257
|
+
const listItem: ChatListItem = {
|
|
258
|
+
id: chatId,
|
|
259
|
+
name: chatName,
|
|
260
|
+
message: { ...message },
|
|
261
|
+
unreadCount: 0,
|
|
262
|
+
};
|
|
263
|
+
|
|
264
|
+
state.query['chat-list'] = {
|
|
265
|
+
...state.query['chat-list'],
|
|
266
|
+
data: [...state.query['chat-list'].data, listItem],
|
|
267
|
+
};
|
|
268
|
+
}
|
|
269
|
+
|
|
233
270
|
return state;
|
|
234
271
|
},
|
|
235
272
|
|
package/src/core/models.tsx
CHANGED
|
@@ -41,7 +41,7 @@ export interface SendMessageRequest {
|
|
|
41
41
|
requestId: string;
|
|
42
42
|
}
|
|
43
43
|
|
|
44
|
-
export interface
|
|
44
|
+
export interface MessageBody {
|
|
45
45
|
text: string;
|
|
46
46
|
files: File[];
|
|
47
47
|
}
|
|
@@ -49,7 +49,7 @@ export interface MessageContent {
|
|
|
49
49
|
export interface AddChatRequest {
|
|
50
50
|
requestId: string;
|
|
51
51
|
name: string;
|
|
52
|
-
message?:
|
|
52
|
+
message?: MessageBody;
|
|
53
53
|
members: string[];
|
|
54
54
|
}
|
|
55
55
|
|
|
@@ -26,9 +26,12 @@ export function useSignalRMonitor(me: string, client: ChatifyClient) {
|
|
|
26
26
|
}),
|
|
27
27
|
);
|
|
28
28
|
unsubscribes.push(
|
|
29
|
-
client.subscribe(
|
|
30
|
-
|
|
31
|
-
|
|
29
|
+
client.subscribe(
|
|
30
|
+
'chatify://member-added',
|
|
31
|
+
([chatId, chatName, account, message]: [string, string, Account, Message]) => {
|
|
32
|
+
dispatch({ type: 'member_added', data: { chatId, chatName, account, me, message } });
|
|
33
|
+
},
|
|
34
|
+
),
|
|
32
35
|
);
|
|
33
36
|
unsubscribes.push(
|
|
34
37
|
client.subscribe(
|
package/src/ui/ChatSettings.tsx
CHANGED
|
@@ -9,7 +9,7 @@ function Member(props: { account: Account; chatId: string }) {
|
|
|
9
9
|
const [remove] = useRemoveMember();
|
|
10
10
|
|
|
11
11
|
const onRemoveClick = useCallback(
|
|
12
|
-
() => remove({ chatId, accountId: account.id, deleteHistory:
|
|
12
|
+
() => remove({ chatId, accountId: account.id, deleteHistory: false }),
|
|
13
13
|
[remove, chatId, account.id],
|
|
14
14
|
);
|
|
15
15
|
|
package/src/ui/Chatify.tsx
CHANGED
|
@@ -21,13 +21,13 @@ import {
|
|
|
21
21
|
} from './ChatListItem';
|
|
22
22
|
import {
|
|
23
23
|
SendingMessage,
|
|
24
|
-
|
|
24
|
+
SendingMessageContent,
|
|
25
25
|
SendingMessageInfoBox,
|
|
26
26
|
SendingMessageText,
|
|
27
27
|
} from './SendingMessage';
|
|
28
28
|
import {
|
|
29
29
|
MessageAuthor,
|
|
30
|
-
|
|
30
|
+
MessageContent,
|
|
31
31
|
MessageBox,
|
|
32
32
|
MessageInfoBox,
|
|
33
33
|
MessageReadObserver,
|
|
@@ -51,13 +51,13 @@ export interface ChatifyCustomizeValue {
|
|
|
51
51
|
ChatListItemLastMessageAuthor?: typeof ChatListItemLastMessageAuthor.Component | null;
|
|
52
52
|
ChatListItemLastMessageContent?: typeof ChatListItemLastMessageContent.Component | null;
|
|
53
53
|
SendingMessage?: typeof SendingMessage.Component | null;
|
|
54
|
-
SendingMessageBody?: typeof
|
|
54
|
+
SendingMessageBody?: typeof SendingMessageContent.Component | null;
|
|
55
55
|
SendingMessageInfoBox?: typeof SendingMessageInfoBox.Component | null;
|
|
56
56
|
SendingMessageText?: typeof SendingMessageText.Component | null;
|
|
57
57
|
MessageBox?: typeof MessageBox.Component | null;
|
|
58
58
|
MessageReadObserver?: typeof MessageReadObserver.Component | null;
|
|
59
59
|
MessageRow?: typeof MessageRow.Component | null;
|
|
60
|
-
|
|
60
|
+
MessageContent?: typeof MessageContent.Component | null;
|
|
61
61
|
MessageInfoBox?: typeof MessageInfoBox.Component | null;
|
|
62
62
|
MessageText?: typeof MessageText.Component | null;
|
|
63
63
|
MessageAuthor?: typeof MessageAuthor.Component | null;
|
package/src/ui/Message.tsx
CHANGED
|
@@ -48,9 +48,9 @@ export const MessageInfoBox = customize<FC<MessageBoxProps>, string>('MessageInf
|
|
|
48
48
|
);
|
|
49
49
|
});
|
|
50
50
|
|
|
51
|
-
export const
|
|
51
|
+
export const MessageContent = customize<FC<MessageBoxProps>, string>('MessageContent', (props) => {
|
|
52
52
|
return (
|
|
53
|
-
<div className="wxchtf-message-
|
|
53
|
+
<div className="wxchtf-message-content">
|
|
54
54
|
<MessageText {...props} />
|
|
55
55
|
<MessageInfoBox {...props} />
|
|
56
56
|
</div>
|
|
@@ -66,7 +66,7 @@ export const MessageRow = customize<FC<MessageRowProps>, string>('MessageRow', (
|
|
|
66
66
|
return (
|
|
67
67
|
<div ref={containerRef} className={'wxchtf-message' + (my ? ' --my' : '')}>
|
|
68
68
|
<MessageAuthor {...props} />
|
|
69
|
-
<
|
|
69
|
+
<MessageContent {...props} />
|
|
70
70
|
</div>
|
|
71
71
|
);
|
|
72
72
|
});
|
|
@@ -29,11 +29,11 @@ export const SendingMessageInfoBox = customize<FC<SendingMessageProps>, string>(
|
|
|
29
29
|
},
|
|
30
30
|
);
|
|
31
31
|
|
|
32
|
-
export const
|
|
33
|
-
'
|
|
32
|
+
export const SendingMessageContent = customize<FC<SendingMessageProps>, string>(
|
|
33
|
+
'SendingMessageContent',
|
|
34
34
|
(props) => {
|
|
35
35
|
return (
|
|
36
|
-
<div className="wxchtf-sending-message-
|
|
36
|
+
<div className="wxchtf-sending-message-content">
|
|
37
37
|
<SendingMessageText {...props} />
|
|
38
38
|
<SendingMessageInfoBox {...props} />
|
|
39
39
|
</div>
|
|
@@ -44,7 +44,7 @@ export const SendingMessageBody = customize<FC<SendingMessageProps>, string>(
|
|
|
44
44
|
export const SendingMessage = customize<FC<SendingMessageProps>, string>('SendingMessage', (props) => {
|
|
45
45
|
return (
|
|
46
46
|
<div className="wxchtf-sending-message">
|
|
47
|
-
<
|
|
47
|
+
<SendingMessageContent {...props} />
|
|
48
48
|
</div>
|
|
49
49
|
);
|
|
50
50
|
});
|
package/src/ui/SystemMessage.tsx
CHANGED
|
@@ -10,7 +10,11 @@ export function formatSystemMessage(localizer: Localizer, text: string): React.R
|
|
|
10
10
|
return localizer.system.chatCreated();
|
|
11
11
|
}
|
|
12
12
|
|
|
13
|
-
|
|
13
|
+
if (text.startsWith('chatify://member-added::')) {
|
|
14
|
+
return localizer.system.memberAdded();
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
return text;
|
|
14
18
|
}
|
|
15
19
|
|
|
16
20
|
export function SystemMessage(props: SystemMessageProps) {
|
package/src/ui/localizer.tsx
CHANGED
|
@@ -5,6 +5,7 @@ export interface Localizer {
|
|
|
5
5
|
timestamp: (value: string) => string;
|
|
6
6
|
system: {
|
|
7
7
|
chatCreated: () => string;
|
|
8
|
+
memberAdded: () => string;
|
|
8
9
|
};
|
|
9
10
|
message: {
|
|
10
11
|
read: () => React.ReactNode;
|
|
@@ -58,6 +59,7 @@ export const defaultLocalizer: Localizer = {
|
|
|
58
59
|
},
|
|
59
60
|
system: {
|
|
60
61
|
chatCreated: () => 'Chat created',
|
|
62
|
+
memberAdded: () => 'New member added',
|
|
61
63
|
},
|
|
62
64
|
|
|
63
65
|
input: {
|
package/src/ui/styles/index.scss
CHANGED
|
@@ -78,8 +78,8 @@
|
|
|
78
78
|
margin-left: 15px;
|
|
79
79
|
}
|
|
80
80
|
|
|
81
|
-
.wxchtf-message-
|
|
82
|
-
.wxchtf-sending-message-
|
|
81
|
+
.wxchtf-message-content,
|
|
82
|
+
.wxchtf-sending-message-content {
|
|
83
83
|
direction: ltr;
|
|
84
84
|
border-bottom-left-radius: 10px;
|
|
85
85
|
border-bottom-right-radius: 0;
|
|
@@ -96,8 +96,8 @@
|
|
|
96
96
|
}
|
|
97
97
|
}
|
|
98
98
|
|
|
99
|
-
.wxchtf-message-
|
|
100
|
-
.wxchtf-sending-message-
|
|
99
|
+
.wxchtf-message-content,
|
|
100
|
+
.wxchtf-sending-message-content {
|
|
101
101
|
min-width: 300px;
|
|
102
102
|
max-width: 70%;
|
|
103
103
|
border-radius: $messageBorderRadius;
|