@droppii-org/chat-mobile 0.2.16 → 0.2.18

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.
Files changed (127) hide show
  1. package/lib/module/assets/images/icon_excel.png +0 -0
  2. package/lib/module/assets/images/icon_img.png +0 -0
  3. package/lib/module/assets/images/icon_pdf.png +0 -0
  4. package/lib/module/assets/images/icon_txt.png +0 -0
  5. package/lib/module/assets/images/icon_word.png +0 -0
  6. package/lib/module/assets/images/index.js +5 -0
  7. package/lib/module/assets/images/index.js.map +1 -1
  8. package/lib/module/components/AttachmentPreview/FilePreview.js +107 -0
  9. package/lib/module/components/AttachmentPreview/FilePreview.js.map +1 -0
  10. package/lib/module/components/AttachmentPreview/MediaPreview.js +212 -0
  11. package/lib/module/components/AttachmentPreview/MediaPreview.js.map +1 -0
  12. package/lib/module/components/AttachmentPreview/index.js +49 -0
  13. package/lib/module/components/AttachmentPreview/index.js.map +1 -0
  14. package/lib/module/components/MergedImageGrid.js +28 -18
  15. package/lib/module/components/MergedImageGrid.js.map +1 -1
  16. package/lib/module/components/messages/fileMessage/index.js +122 -12
  17. package/lib/module/components/messages/fileMessage/index.js.map +1 -1
  18. package/lib/module/components/messages/mergedMessage/index.js +4 -7
  19. package/lib/module/components/messages/mergedMessage/index.js.map +1 -1
  20. package/lib/module/hooks/useFileAttachment.js +116 -0
  21. package/lib/module/hooks/useFileAttachment.js.map +1 -0
  22. package/lib/module/hooks/useFileDownload.js +175 -0
  23. package/lib/module/hooks/useFileDownload.js.map +1 -0
  24. package/lib/module/hooks/useImageAttachment.js +16 -8
  25. package/lib/module/hooks/useImageAttachment.js.map +1 -1
  26. package/lib/module/hooks/useVideoAttachment.js +1 -1
  27. package/lib/module/index.js +1 -1
  28. package/lib/module/index.js.map +1 -1
  29. package/lib/module/screens/MediaView/VideoPlayer.js +1 -0
  30. package/lib/module/screens/MediaView/VideoPlayer.js.map +1 -1
  31. package/lib/module/screens/MediaView/index.js +7 -9
  32. package/lib/module/screens/MediaView/index.js.map +1 -1
  33. package/lib/module/screens/chat-detail/ChatComposer.js +44 -36
  34. package/lib/module/screens/chat-detail/ChatComposer.js.map +1 -1
  35. package/lib/module/screens/chat-detail/ChatListLegend.js +11 -2
  36. package/lib/module/screens/chat-detail/ChatListLegend.js.map +1 -1
  37. package/lib/module/screens/chat-detail/hooks/useAttachmentMapping.js +51 -0
  38. package/lib/module/screens/chat-detail/hooks/useAttachmentMapping.js.map +1 -0
  39. package/lib/module/screens/chat-detail/hooks/useAttachmentSendHandler.js +39 -13
  40. package/lib/module/screens/chat-detail/hooks/useAttachmentSendHandler.js.map +1 -1
  41. package/lib/module/services/attachmentHandlers/fileAttachmentHandler.js +6 -6
  42. package/lib/module/services/attachmentHandlers/fileAttachmentHandler.js.map +1 -1
  43. package/lib/module/services/attachmentHandlers/index.js +1 -1
  44. package/lib/module/services/attachmentHandlers/index.js.map +1 -1
  45. package/lib/module/services/attachmentHandlers/videoAttachmentHandler.js +1 -1
  46. package/lib/module/translation/resources/i18n.js +10 -0
  47. package/lib/module/translation/resources/i18n.js.map +1 -1
  48. package/lib/module/utils/device.js +32 -0
  49. package/lib/module/utils/device.js.map +1 -1
  50. package/lib/module/utils/imageUtils.js +44 -28
  51. package/lib/module/utils/imageUtils.js.map +1 -1
  52. package/lib/module/utils/videoThumbnail.js +76 -3
  53. package/lib/module/utils/videoThumbnail.js.map +1 -1
  54. package/lib/typescript/src/assets/images/index.d.ts +5 -0
  55. package/lib/typescript/src/assets/images/index.d.ts.map +1 -1
  56. package/lib/typescript/src/components/AttachmentPreview/FilePreview.d.ts +6 -0
  57. package/lib/typescript/src/components/AttachmentPreview/FilePreview.d.ts.map +1 -0
  58. package/lib/typescript/src/components/AttachmentPreview/MediaPreview.d.ts +9 -0
  59. package/lib/typescript/src/components/AttachmentPreview/MediaPreview.d.ts.map +1 -0
  60. package/lib/typescript/src/components/AttachmentPreview/index.d.ts +9 -0
  61. package/lib/typescript/src/components/AttachmentPreview/index.d.ts.map +1 -0
  62. package/lib/typescript/src/components/MergedImageGrid.d.ts +2 -2
  63. package/lib/typescript/src/components/MergedImageGrid.d.ts.map +1 -1
  64. package/lib/typescript/src/components/messages/fileMessage/index.d.ts.map +1 -1
  65. package/lib/typescript/src/components/messages/mergedMessage/index.d.ts.map +1 -1
  66. package/lib/typescript/src/hooks/useFileAttachment.d.ts +20 -0
  67. package/lib/typescript/src/hooks/useFileAttachment.d.ts.map +1 -0
  68. package/lib/typescript/src/hooks/useFileDownload.d.ts +15 -0
  69. package/lib/typescript/src/hooks/useFileDownload.d.ts.map +1 -0
  70. package/lib/typescript/src/hooks/useImageAttachment.d.ts +1 -2
  71. package/lib/typescript/src/hooks/useImageAttachment.d.ts.map +1 -1
  72. package/lib/typescript/src/screens/MediaView/VideoPlayer.d.ts.map +1 -1
  73. package/lib/typescript/src/screens/MediaView/index.d.ts.map +1 -1
  74. package/lib/typescript/src/screens/chat-detail/ChatComposer.d.ts.map +1 -1
  75. package/lib/typescript/src/screens/chat-detail/ChatListLegend.d.ts.map +1 -1
  76. package/lib/typescript/src/screens/chat-detail/hooks/useAttachmentMapping.d.ts +10 -0
  77. package/lib/typescript/src/screens/chat-detail/hooks/useAttachmentMapping.d.ts.map +1 -0
  78. package/lib/typescript/src/screens/chat-detail/hooks/useAttachmentSendHandler.d.ts +4 -1
  79. package/lib/typescript/src/screens/chat-detail/hooks/useAttachmentSendHandler.d.ts.map +1 -1
  80. package/lib/typescript/src/services/attachmentHandlers/fileAttachmentHandler.d.ts +2 -2
  81. package/lib/typescript/src/services/attachmentHandlers/fileAttachmentHandler.d.ts.map +1 -1
  82. package/lib/typescript/src/services/attachmentHandlers/index.d.ts +1 -1
  83. package/lib/typescript/src/services/attachmentHandlers/index.d.ts.map +1 -1
  84. package/lib/typescript/src/translation/resources/i18n.d.ts.map +1 -1
  85. package/lib/typescript/src/types/attachment.d.ts +22 -1
  86. package/lib/typescript/src/types/attachment.d.ts.map +1 -1
  87. package/lib/typescript/src/utils/device.d.ts +7 -0
  88. package/lib/typescript/src/utils/device.d.ts.map +1 -1
  89. package/lib/typescript/src/utils/imageUtils.d.ts +1 -0
  90. package/lib/typescript/src/utils/imageUtils.d.ts.map +1 -1
  91. package/lib/typescript/src/utils/videoThumbnail.d.ts.map +1 -1
  92. package/package.json +5 -1
  93. package/src/assets/images/icon_excel.png +0 -0
  94. package/src/assets/images/icon_img.png +0 -0
  95. package/src/assets/images/icon_pdf.png +0 -0
  96. package/src/assets/images/icon_txt.png +0 -0
  97. package/src/assets/images/icon_word.png +0 -0
  98. package/src/assets/images/index.ts +5 -0
  99. package/src/components/AttachmentPreview/FilePreview.tsx +137 -0
  100. package/src/components/AttachmentPreview/MediaPreview.tsx +238 -0
  101. package/src/components/AttachmentPreview/index.tsx +68 -0
  102. package/src/components/MergedImageGrid.tsx +36 -23
  103. package/src/components/messages/fileMessage/index.tsx +156 -13
  104. package/src/components/messages/mergedMessage/index.tsx +5 -7
  105. package/src/hooks/useFileAttachment.ts +163 -0
  106. package/src/hooks/useFileDownload.ts +200 -0
  107. package/src/hooks/useImageAttachment.ts +23 -13
  108. package/src/hooks/useVideoAttachment.ts +1 -1
  109. package/src/screens/MediaView/VideoPlayer.tsx +1 -0
  110. package/src/screens/MediaView/index.tsx +7 -6
  111. package/src/screens/chat-detail/ChatComposer.tsx +61 -30
  112. package/src/screens/chat-detail/ChatListLegend.tsx +9 -2
  113. package/src/screens/chat-detail/hooks/useAttachmentMapping.ts +58 -0
  114. package/src/screens/chat-detail/hooks/useAttachmentSendHandler.ts +50 -11
  115. package/src/services/attachmentHandlers/fileAttachmentHandler.ts +8 -7
  116. package/src/services/attachmentHandlers/index.ts +4 -1
  117. package/src/services/attachmentHandlers/videoAttachmentHandler.ts +1 -1
  118. package/src/translation/resources/i18n.ts +10 -0
  119. package/src/types/attachment.ts +23 -1
  120. package/src/utils/device.ts +58 -0
  121. package/src/utils/imageUtils.ts +50 -28
  122. package/src/utils/videoThumbnail.ts +77 -3
  123. package/lib/module/components/AttachmentPreview.js +0 -250
  124. package/lib/module/components/AttachmentPreview.js.map +0 -1
  125. package/lib/typescript/src/components/AttachmentPreview.d.ts +0 -28
  126. package/lib/typescript/src/components/AttachmentPreview.d.ts.map +0 -1
  127. package/src/components/AttachmentPreview.tsx +0 -304
@@ -1,28 +0,0 @@
1
- type AttachmentType = 'image' | 'video' | 'audio' | 'document' | 'file';
2
- interface AttachmentMetadata {
3
- path: string;
4
- filename?: string;
5
- size?: number;
6
- duration?: number;
7
- mimeType?: string;
8
- width?: number;
9
- height?: number;
10
- }
11
- interface AttachmentItem {
12
- metadata: AttachmentMetadata;
13
- uploadProgress: number;
14
- error: string | null;
15
- isUploading: boolean;
16
- uploadedUrl?: string;
17
- thumbnailUrl?: string;
18
- }
19
- interface AttachmentPreviewProps {
20
- visible: boolean;
21
- attachments?: Array<AttachmentItem & {
22
- type: AttachmentType;
23
- }>;
24
- onRemove: (type: AttachmentType, index: number) => void;
25
- }
26
- export declare const AttachmentPreview: import("react").MemoExoticComponent<({ visible, attachments, onRemove }: AttachmentPreviewProps) => import("react").JSX.Element>;
27
- export {};
28
- //# sourceMappingURL=AttachmentPreview.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"AttachmentPreview.d.ts","sourceRoot":"","sources":["../../../../src/components/AttachmentPreview.tsx"],"names":[],"mappings":"AAIA,KAAK,cAAc,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,UAAU,GAAG,MAAM,CAAC;AAExE,UAAU,kBAAkB;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,UAAU,cAAc;IACtB,QAAQ,EAAE,kBAAkB,CAAC;IAC7B,cAAc,EAAE,MAAM,CAAC;IACvB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,WAAW,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,UAAU,sBAAsB;IAC9B,OAAO,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,KAAK,CAAC,cAAc,GAAG;QAAE,IAAI,EAAE,cAAc,CAAA;KAAE,CAAC,CAAC;IAC/D,QAAQ,EAAE,CAAC,IAAI,EAAE,cAAc,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACzD;AAwBD,eAAO,MAAM,iBAAiB,2EACS,sBAAsB,iCA4J5D,CAAC"}
@@ -1,304 +0,0 @@
1
- import { memo } from 'react';
2
- import { ScrollView, StyleSheet } from 'react-native';
3
- import { KContainer, KImage, KColors, KLabel } from '@droppii/libs';
4
-
5
- type AttachmentType = 'image' | 'video' | 'audio' | 'document' | 'file';
6
-
7
- interface AttachmentMetadata {
8
- path: string;
9
- filename?: string;
10
- size?: number;
11
- duration?: number;
12
- mimeType?: string;
13
- width?: number;
14
- height?: number;
15
- }
16
-
17
- interface AttachmentItem {
18
- metadata: AttachmentMetadata;
19
- uploadProgress: number;
20
- error: string | null;
21
- isUploading: boolean;
22
- uploadedUrl?: string;
23
- thumbnailUrl?: string;
24
- }
25
-
26
- interface AttachmentPreviewProps {
27
- visible: boolean;
28
- attachments?: Array<AttachmentItem & { type: AttachmentType }>;
29
- onRemove: (type: AttachmentType, index: number) => void;
30
- }
31
-
32
- const formatDuration = (seconds: number): string => {
33
- const mins = Math.floor(seconds / 60);
34
- const secs = seconds % 60;
35
- return `${mins}:${secs.toString().padStart(2, '0')}`;
36
- };
37
-
38
- const getAttachmentIcon = (type: AttachmentType): string => {
39
- switch (type) {
40
- case 'image':
41
- return 'image';
42
- case 'video':
43
- return 'play-circle';
44
- case 'audio':
45
- return 'music';
46
- case 'document':
47
- return 'file-document';
48
- case 'file':
49
- default:
50
- return 'file';
51
- }
52
- };
53
-
54
- export const AttachmentPreview = memo(
55
- ({ visible, attachments, onRemove }: AttachmentPreviewProps) => {
56
- if (!visible || !attachments?.length) {
57
- return null;
58
- }
59
-
60
- return (
61
- <KContainer.View
62
- paddingH="0.75rem"
63
- // paddingV="0.75rem"
64
- brW={1}
65
- brC={KColors.palette.gray.w100}
66
- background={KColors.white}
67
- style={styles.container}
68
- >
69
- <KContainer.View row alignItems minH={70}>
70
- <KContainer.View flex>
71
- <ScrollView
72
- horizontal
73
- showsHorizontalScrollIndicator={false}
74
- scrollEventThrottle={16}
75
- contentContainerStyle={{ alignItems: 'center' }}
76
- >
77
- {attachments.map((item, index) => {
78
- const {
79
- type,
80
- metadata,
81
- uploadProgress,
82
- error,
83
- isUploading,
84
- thumbnailUrl,
85
- } = item;
86
-
87
- const isImage = type === 'image';
88
- const isVideo = type === 'video';
89
- const hasPreview = isImage || isVideo;
90
-
91
- return (
92
- <KContainer.View key={`${type}-${index}`}>
93
- <KContainer.View style={styles.thumbnail} center>
94
- {/* Video thumbnail */}
95
- {isVideo && thumbnailUrl && (
96
- <KImage.Base
97
- uri={thumbnailUrl}
98
- width={48}
99
- height={48}
100
- resizeMode="cover"
101
- />
102
- )}
103
-
104
- {/* Video placeholder (no thumbnail yet) */}
105
- {isVideo && !thumbnailUrl && (
106
- <KContainer.View
107
- style={[styles.videoBg, styles.videoThumbnail]}
108
- />
109
- )}
110
-
111
- {/* Image preview */}
112
- {isImage && (
113
- <KImage.Base
114
- uri={`file://${metadata.path}`}
115
- width={48}
116
- height={48}
117
- />
118
- )}
119
-
120
- {/* Show icon overlay for non-media files */}
121
- {!hasPreview && (
122
- <KContainer.View
123
- style={styles.iconOverlay}
124
- center
125
- background={KColors.palette.gray.w100}
126
- >
127
- <KImage.VectorIcons
128
- name={getAttachmentIcon(type)}
129
- provider="MaterialCommunityIcons"
130
- size={24}
131
- color={KColors.palette.primary.w400}
132
- />
133
- </KContainer.View>
134
- )}
135
-
136
- {/* Video duration badge */}
137
- {isVideo && metadata.duration && (
138
- <KContainer.View style={styles.durationBadge} center>
139
- <KLabel.Text
140
- typo="TextXsNormal"
141
- color={KColors.white}
142
- style={styles.durationText}
143
- >
144
- {formatDuration(metadata.duration / 1000)}
145
- </KLabel.Text>
146
- </KContainer.View>
147
- )}
148
-
149
- {/* Type icon for non-preview items */}
150
- {!hasPreview && (
151
- <KContainer.View style={styles.typeIcon} center>
152
- <KImage.VectorIcons
153
- name={getAttachmentIcon(type)}
154
- provider="MaterialCommunityIcons"
155
- size={14}
156
- color={KColors.white}
157
- />
158
- </KContainer.View>
159
- )}
160
-
161
- {/* Error state */}
162
- {error && (
163
- <KContainer.View style={styles.errorOverlay} center>
164
- <KImage.VectorIcons
165
- name="close-circle"
166
- provider="MaterialCommunityIcons"
167
- size={28}
168
- color={KColors.white}
169
- />
170
- </KContainer.View>
171
- )}
172
-
173
- {/* Progress overlay */}
174
- {isUploading && (
175
- <KContainer.View style={styles.progressOverlay} center>
176
- <KLabel.Text
177
- typo="TextSmNormal"
178
- color={KColors.white}
179
- >
180
- {uploadProgress}%
181
- </KLabel.Text>
182
- </KContainer.View>
183
- )}
184
- </KContainer.View>
185
- {/* Remove button */}
186
- <KContainer.Touchable
187
- style={styles.removeButton}
188
- center
189
- br="round"
190
- background={KColors.black}
191
- onPress={() => onRemove(type, index)}
192
- disabled={isUploading}
193
- hitSlop={{ top: 10, bottom: 10, left: 10, right: 10 }}
194
- >
195
- <KImage.VectorIcons
196
- name="close"
197
- provider="MaterialCommunityIcons"
198
- size={14}
199
- color={KColors.white}
200
- />
201
- </KContainer.Touchable>
202
- </KContainer.View>
203
- );
204
- })}
205
- </ScrollView>
206
- </KContainer.View>
207
- </KContainer.View>
208
- </KContainer.View>
209
- );
210
- }
211
- );
212
-
213
- AttachmentPreview.displayName = 'AttachmentPreview';
214
-
215
- const styles = StyleSheet.create({
216
- container: {
217
- // minHeight: 80,
218
- },
219
- thumbnail: {
220
- position: 'relative',
221
- width: 48,
222
- height: 48,
223
- borderRadius: 4,
224
- overflow: 'hidden',
225
- marginRight: 8,
226
- backgroundColor: KColors.palette.gray.w50,
227
- },
228
- durationBadge: {
229
- position: 'absolute',
230
- bottom: 4,
231
- right: 4,
232
- backgroundColor: 'rgba(0, 0, 0, 0.8)',
233
- borderRadius: 3,
234
- paddingVertical: 2,
235
- paddingHorizontal: 4,
236
- },
237
- durationText: {
238
- fontSize: 11,
239
- fontWeight: '600',
240
- },
241
- iconOverlay: {
242
- width: 48,
243
- height: 48,
244
- borderRadius: 4,
245
- },
246
- videoIcon: {
247
- position: 'absolute',
248
- top: 2,
249
- right: 2,
250
- backgroundColor: 'rgba(0, 0, 0, 0.6)',
251
- borderRadius: 8,
252
- width: 20,
253
- height: 20,
254
- },
255
- typeIcon: {
256
- position: 'absolute',
257
- bottom: 2,
258
- right: 2,
259
- backgroundColor: 'rgba(0, 0, 0, 0.7)',
260
- borderRadius: 6,
261
- width: 16,
262
- height: 16,
263
- },
264
- videoBg: {
265
- width: 48,
266
- height: 48,
267
- borderRadius: 4,
268
- },
269
- videoThumbnail: {
270
- backgroundColor: KColors.black,
271
- },
272
- progressOverlay: {
273
- position: 'absolute',
274
- top: 0,
275
- left: 0,
276
- right: 0,
277
- bottom: 0,
278
- backgroundColor: 'rgba(0, 0, 0, 0.6)',
279
- },
280
- errorOverlay: {
281
- position: 'absolute',
282
- top: 0,
283
- left: 0,
284
- right: 0,
285
- bottom: 0,
286
- backgroundColor: 'rgba(255, 59, 48, 0.8)',
287
- },
288
- removeButton: {
289
- position: 'absolute',
290
- top: -8,
291
- right: 2,
292
- width: 22,
293
- height: 22,
294
- shadowColor: '#000',
295
- shadowOffset: { width: 0, height: 1 },
296
- shadowOpacity: 0.2,
297
- shadowRadius: 2,
298
- elevation: 3,
299
- },
300
- sendButton: {
301
- width: 48,
302
- height: 48,
303
- },
304
- });