beem-component 2.0.17 → 2.0.19

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 (4) hide show
  1. package/dist/components/ChatComponents/ChatBody/chatBody.js +197 -98
  2. package/package.json +2 -1
  3. package/src/App.js +716 -578
  4. package/src/lib/components/ChatComponents/ChatBody/chatBody.js +187 -83
package/src/App.js CHANGED
@@ -1,10 +1,11 @@
1
1
  // * eslint-disable func-style *
2
2
  /* eslint-disable jsx-a11y/media-has-caption */
3
- import React, { useState } from 'react';
4
- import AbcIcon from '@mui/icons-material/Abc';
3
+ import React from 'react';
4
+ // import AbcIcon from '@mui/icons-material/Abc';
5
5
  // import LocalOfferOutlinedIcon from '@mui/icons-material/LocalOfferOutlined';
6
6
 
7
7
  // import { Tooltip } from '@mui/material';
8
+
8
9
  import {
9
10
  BmChat,
10
11
  GlobalStyle,
@@ -12,41 +13,43 @@ import {
12
13
  BmChatAccordion,
13
14
  BmAccordion,
14
15
  BmChatForm,
15
- BmButton,
16
- BmButtonDropDown,
17
- BmBtnIcon,
16
+ // BmButton,
17
+ // BmButtonDropDown,
18
+ // BmBtnIcon,
18
19
  BmContactCard,
19
- BmContactCheckbox,
20
- BmCounter,
21
- BmProfileIcon,
20
+ // BmContactCheckbox,
21
+ // BmCounter,
22
+ // BmProfileIcon,
22
23
  } from './lib/components';
23
24
 
24
- const datsa = JSON.stringify({
25
- dotgoV2: {
26
- type: 'product_details',
27
- subType: 'product_list',
28
- catalogId: '3987644271555185',
29
- header: {
30
- text: 'Our Food Menu',
31
- },
32
- body: {
33
- text: '*Terms and Conditions for Delivery* \n- Though we try our best to deliver your food in time, there might be delays\n- Prices might differ from the ones on the website \n- Packing charges will be added on the prices \n- Minimum delivery order TZS 13,000',
34
- },
35
- footer: {
36
- text: 'Powered by Beem',
37
- },
38
- sections: [],
39
- },
40
- });
41
- console.log(datsa);
25
+ // const datsa = JSON.stringify({
26
+ // dotgoV2: {
27
+ // type: 'product_details',
28
+ // subType: 'product_list',
29
+ // catalogId: '3987644271555185',
30
+ // header: {
31
+ // text: 'Our Food Menu',
32
+ // },
33
+ // body: {
34
+ // text: '*Terms and Conditions for Delivery* \n- Though we try our best to deliver your food in time, there might be delays\n- Prices might differ from the ones on the website \n- Packing charges will be added on the prices \n- Minimum delivery order TZS 13,000',
35
+ // },
36
+ // footer: {
37
+ // text: 'Powered by Beem',
38
+ // },
39
+ // sections: [],
40
+ // },
41
+ // });
42
+ // console.log(datsa);
42
43
  const Chat = () => {
43
44
  const message = {
44
45
  id: 75681,
45
46
  message:
46
- '{"dotgoV2":{"type":"product_details","subType":"product_list","catalogId":"3987644271555185","header":{"text":"Our Food Menu"},"body":{"text":"*Terms and Conditions for Delivery* \\n- Though we try our best to deliver your food in time, there might be delays\\n- Prices might differ from the ones on the website \\n- Packing charges will be added on the prices \\n- Minimum delivery order TZS 13,000"},"footer":{"text":"Powered by Beem"},"sections":[{"title":"South Indian","productList":[{"productId":95},{"productId":96},{"productId":97},{"productId":98},{"productId":99},{"productId":100},{"productId":101},{"productId":105}]},{"title":"Soups","productList":[{"productId":102},{"productId":103},{"productId":104}]},{"title":"Paratha","productList":[{"productId":106},{"productId":107},{"productId":108},{"productId":109}]},{"title":"Starters & Chaat","productList":[{"productId":110},{"productId":111}]},{"title":"Extras","productList":[{"productId":112},{"productId":113},{"productId":114}]},{"title":"Thali","productList":[{"productId":115},{"productId":116},{"productId":117},{"productId":118}]}]}}',
47
+ // '{"dotgoV2":{"type":"quick_reply","content":{"type":"text","header":"","text":"We value your opinion! Would you be willing to take a short survey to help us improve?","caption":""},"options":[{"type":"text","title":"Give Feedback","postbackText":"bm-feedback|0|181661e8-9209-4665-ad19-680981136ae8"},{"type":"text","title":"No Thank you","postbackText":"dev-defined-postback2"}]}}',
48
+ '{"dotgoV2":{"type":"order","catalog":{"id":"3987644271555185","order":{"items":[{"id":"107","currency":"TZS","amount":"8000","quantity":"1"},{"id":"109","currency":"TZS","amount":"12000","quantity":"1"},{"id":"111","currency":"TZS","amount":"7000","quantity":"1"}]}},"forwarded":false,"frequently_forwarded":false}}',
49
+ // '{"dotgoV2":{"type":"product_details","subType":"product_list","catalogId":"3987644271555185","header":{"text":"Our Food Menu"},"body":{"text":"*Terms and Conditions for Delivery* \\n- Though we try our best to deliver your food in time, there might be delays\\n- Prices might differ from the ones on the website \\n- Packing charges will be added on the prices \\n- Minimum delivery order TZS 13,000"},"footer":{"text":"Powered by Beem"},"sections":[{"title":"South Indian","productList":[{"productId":95},{"productId":96},{"productId":97},{"productId":98},{"productId":99},{"productId":100},{"productId":101},{"productId":105}]},{"title":"Soups","productList":[{"productId":102},{"productId":103},{"productId":104}]},{"title":"Paratha","productList":[{"productId":106},{"productId":107},{"productId":108},{"productId":109}]},{"title":"Starters & Chaat","productList":[{"productId":110},{"productId":111}]},{"title":"Extras","productList":[{"productId":112},{"productId":113},{"productId":114}]},{"title":"Thali","productList":[{"productId":115},{"productId":116},{"productId":117},{"productId":118}]}]}}',
47
50
  time: '2025-03-19T13:44:25.000Z',
48
51
  direction: 'outbound',
49
- message_type: 'interactive',
52
+ message_type: 'order',
50
53
  messageId: null,
51
54
  is_live_agent: 0,
52
55
  is_deleted: 0,
@@ -104,571 +107,642 @@ const Chat = () => {
104
107
  id: '6538d48e-1b17-45e8-8e44-be457d3695c0',
105
108
  prev_message:
106
109
  '{"dotgoV2":{"type":"product_details","subType":"product_list","catalogId":"3987644271555185","header":{"text":"Our Food Menu"},"body":{"text":"*Terms and Conditions for Delivery* \\n- Though we try our best to deliver your food in time, there might be delays\\n- Prices might differ from the ones on the website \\n- Packing charges will be added on the prices \\n- Minimum delivery order TZS 13,000"},"footer":{"text":"Powered by Beem"},"sections":[{"title":"South Indian","productList":[{"productId":95},{"productId":96},{"productId":97},{"productId":98},{"productId":99},{"productId":100},{"productId":101},{"productId":105}]},{"title":"Soups","productList":[{"productId":102},{"productId":103},{"productId":104}]},{"title":"Paratha","productList":[{"productId":106},{"productId":107},{"productId":108},{"productId":109}]},{"title":"Starters & Chaat","productList":[{"productId":110},{"productId":111}]},{"title":"Extras","productList":[{"productId":112},{"productId":113},{"productId":114}]},{"title":"Thali","productList":[{"productId":115},{"productId":116},{"productId":117},{"productId":118}]}]}}',
107
- // '{"dotgoV2":{"type":"quick_reply","content":{"type":"text","header":"","text":"We value your opinion! Would you be willing to take a short survey to help us improve?","caption":""},"options":[{"type":"text","title":"Give Feedback","postbackText":"bm-feedback|0|181661e8-9209-4665-ad19-680981136ae8"},{"type":"text","title":"No Thank you","postbackText":"dev-defined-postback2"}]}}',
110
+ // '{"dotgoV2":{"type":"quick_reply","content":{"type":"text","header":"HELOOOOOOOOOO", "url": "https://i.imgur.com/BZylAb1.jpeg","text":"We value your opinion! Would you be willing to take a short survey to help us improve?","caption":""},"options":[{"type":"text","title":"Give Feedback","postbackText":"bm-feedback|0|181661e8-9209-4665-ad19-680981136ae8"},{"type":"text","title":"No Thank you","postbackText":"dev-defined-postback2"}]}}',
108
111
  },
109
112
  };
110
- const msg = [
111
- {
112
- message: 'Me as user replying to the beem message',
113
- id: 20278,
114
- time: '2024-01-22T11:59:08.000Z',
115
- direction: 'inbound',
116
- message_type: 'text',
117
- messageId: null,
118
- is_live_agent: true,
119
- is_deleted: false,
120
- is_comment: false,
121
- channel: 'whatsapp',
122
- sent_to_vendor: true,
123
- replyMessageId: 'b0a6b554-0cc3-4e45-83b2-3cada229a82c',
124
- agent_name: null,
125
- df_agent_name: null,
126
- resolve_time: null,
127
- metadata: {
128
- id: 'b0a6b554-0cc3-4e45-83b2-3cada229a82c',
129
- prev_message: 'this is message from beem',
130
- },
131
- },
132
- {
133
- message: 'this is message from beem',
134
- id: 20277,
135
- time: '2024-01-22T11:56:41.000Z',
136
- direction: 'outbound',
137
- message_type: null,
138
- messageId: 'b0a6b554-0cc3-4e45-83b2-3cada229a82c',
139
- is_live_agent: true,
140
- is_deleted: false,
141
- is_comment: false,
142
- channel: 'whatsapp',
143
- sent_to_vendor: true,
144
- replyMessageId: null,
145
- agent_name: 'arl@beem.co.tz',
146
- df_agent_name: 'Dev arl',
147
- resolve_time: null,
148
- metadata: null,
149
- statusDetails: {
150
- statusCode: 3,
151
- },
152
- },
153
- {
154
- message: 'hi',
155
- id: 20276,
156
- time: '2024-01-22T11:20:21.000Z',
157
- direction: 'outbound',
158
- message_type: null,
159
- messageId: '86ffe4bd-145e-4f50-83ef-83248b05c43a',
160
- is_live_agent: true,
161
- is_deleted: false,
162
- is_comment: false,
163
- channel: 'whatsapp',
164
- sent_to_vendor: true,
165
- replyMessageId: null,
166
- agent_name: 'arl@beem.co.tz',
167
- df_agent_name: 'Dev arl',
168
- resolve_time: null,
169
- metadata: null,
170
- statusDetails: {
171
- statusCode: 3,
172
- },
173
- },
174
- {
175
- message: 'hi',
176
- id: 20270,
177
- time: '2024-01-22T10:19:57.000Z',
178
- direction: 'outbound',
179
- message_type: null,
180
- messageId: '0e165d59-8300-4cd2-883d-dcb076c6f235',
181
- is_live_agent: true,
182
- is_deleted: false,
183
- is_comment: false,
184
- channel: 'whatsapp',
185
- sent_to_vendor: true,
186
- replyMessageId: null,
187
- agent_name: 'arl@beem.co.tz',
188
- df_agent_name: 'Dev arl',
189
- resolve_time: null,
190
- metadata: null,
191
- statusDetails: {
192
- statusCode: 3,
193
- },
194
- },
195
- {
196
- message: 'oh i am good',
197
- id: 20269,
198
- time: '2024-01-22T10:04:05.000Z',
199
- direction: 'inbound',
200
- message_type: 'text',
201
- messageId: null,
202
- is_live_agent: true,
203
- is_deleted: false,
204
- is_comment: false,
205
- channel: 'whatsapp',
206
- sent_to_vendor: true,
207
- replyMessageId: null,
208
- agent_name: null,
209
- df_agent_name: null,
210
- resolve_time: null,
211
- metadata: {
212
- id: 'ABEGJVeCJwBSAhB3WfEzKswmhITnP0z8qo12',
213
- prev_message: 'how are you????????',
214
- },
215
- },
216
- {
217
- message: 'how are you????????',
218
- id: 20268,
219
- time: '2024-01-22T10:03:23.000Z',
220
- direction: 'inbound',
221
- message_type: 'text',
222
- messageId: null,
223
- is_live_agent: true,
224
- is_deleted: false,
225
- is_comment: false,
226
- channel: 'whatsapp',
227
- sent_to_vendor: true,
228
- replyMessageId: null,
229
- agent_name: null,
230
- df_agent_name: null,
231
- resolve_time: null,
232
- metadata: null,
233
- },
234
- {
235
- message: 'hi\n',
236
- id: 20267,
237
- time: '2024-01-22T10:03:01.000Z',
238
- direction: 'outbound',
239
- message_type: null,
240
- messageId: 'f38be83c-92b1-47a7-9e6a-0d209da0ad86',
241
- is_live_agent: false,
242
- is_deleted: false,
243
- is_comment: false,
244
- channel: 'whatsapp',
245
- sent_to_vendor: true,
246
- replyMessageId: null,
247
- agent_name: 'arl@beem.co.tz',
248
- df_agent_name: 'Dev arl',
249
- resolve_time: null,
250
- metadata: null,
251
- statusDetails: {
252
- statusCode: 3,
253
- },
254
- },
255
- {
256
- message: 'Sorry, what was that?',
257
- id: 20266,
258
- time: '2024-01-22T10:02:36.000Z',
259
- direction: 'outbound',
260
- message_type: 'text',
261
- messageId: null,
262
- is_live_agent: false,
263
- is_deleted: false,
264
- is_comment: false,
265
- channel: 'whatsapp',
266
- sent_to_vendor: true,
267
- replyMessageId: null,
268
- agent_name: null,
269
- df_agent_name: null,
270
- resolve_time: null,
271
- metadata: null,
272
- statusDetails: {
273
- statusCode: 3,
274
- },
275
- },
276
- {
277
- message: 'how are you?',
278
- id: 20265,
279
- time: '2024-01-22T10:02:17.000Z',
280
- direction: 'inbound',
281
- message_type: 'text',
282
- messageId: null,
283
- is_live_agent: false,
284
- is_deleted: false,
285
- is_comment: false,
286
- channel: 'whatsapp',
287
- sent_to_vendor: true,
288
- replyMessageId: null,
289
- agent_name: null,
290
- df_agent_name: null,
291
- resolve_time: null,
292
- metadata: null,
293
- },
294
- {
295
- message: 'thank you for chatting with us!!! -Dev',
296
- id: 20264,
297
- time: '2024-01-22T09:55:00.000Z',
298
- direction: 'outbound',
299
- message_type: null,
300
- messageId: null,
301
- is_live_agent: true,
302
- is_deleted: false,
303
- is_comment: false,
304
- channel: 'whatsapp',
305
- sent_to_vendor: true,
306
- replyMessageId: null,
307
- agent_name: null,
308
- df_agent_name: null,
309
- resolve_time: null,
310
- metadata: null,
311
- statusDetails: {
312
- statusCode: 3,
313
- },
314
- },
315
- {
316
- message: 'One more time?',
317
- id: 20223,
318
- time: '2024-01-19T11:00:59.000Z',
319
- direction: 'outbound',
320
- message_type: 'text',
321
- messageId: null,
322
- is_live_agent: false,
323
- is_deleted: false,
324
- is_comment: false,
325
- channel: 'whatsapp',
326
- sent_to_vendor: true,
327
- replyMessageId: null,
328
- agent_name: null,
329
- df_agent_name: null,
330
- resolve_time: null,
331
- metadata: null,
332
- statusDetails: {
333
- statusCode: 3,
334
- },
335
- },
336
- {
337
- message: 'i am good',
338
- id: 20222,
339
- time: '2024-01-19T11:00:55.000Z',
340
- direction: 'inbound',
341
- message_type: 'text',
342
- messageId: null,
343
- is_live_agent: false,
344
- is_deleted: false,
345
- is_comment: false,
346
- channel: 'whatsapp',
347
- sent_to_vendor: true,
348
- replyMessageId: null,
349
- agent_name: null,
350
- df_agent_name: null,
351
- resolve_time: null,
352
- metadata: {
353
- id: 'ABEGJVaCQwSAAhCt33VV1Zivq9-48AP8bs_t',
354
- prev_message: 'if it doesnt exists then to fetch',
355
- },
356
- },
357
- {
358
- message: 'how are you?',
359
- id: 20220,
360
- time: '2024-01-19T10:59:48.000Z',
361
- direction: 'inbound',
362
- message_type: 'text',
363
- messageId: null,
364
- is_live_agent: false,
365
- is_deleted: false,
366
- is_comment: false,
367
- channel: 'whatsapp',
368
- sent_to_vendor: true,
369
- replyMessageId: null,
370
- agent_name: null,
371
- df_agent_name: null,
372
- resolve_time: null,
373
- metadata: null,
374
- },
375
- {
376
- message: 'thank you for chatting with us!!! -Dev',
377
- id: 20217,
378
- time: '2024-01-19T09:55:00.000Z',
379
- direction: 'outbound',
380
- message_type: null,
381
- messageId: null,
382
- is_live_agent: true,
383
- is_deleted: false,
384
- is_comment: false,
385
- channel: 'whatsapp',
386
- sent_to_vendor: true,
387
- replyMessageId: null,
388
- agent_name: null,
389
- df_agent_name: null,
390
- resolve_time: null,
391
- metadata: null,
392
- statusDetails: {
393
- statusCode: 3,
394
- },
395
- },
396
- {
397
- message: 'if it doesnt exists then to fetch',
398
- id: 20208,
399
- time: '2024-01-19T08:54:12.000Z',
400
- direction: 'inbound',
401
- message_type: 'text',
402
- messageId: null,
403
- is_live_agent: true,
404
- is_deleted: false,
405
- is_comment: false,
406
- channel: 'whatsapp',
407
- sent_to_vendor: true,
408
- replyMessageId: null,
409
- agent_name: null,
410
- df_agent_name: null,
411
- resolve_time: null,
412
- metadata: null,
413
- },
414
- {
415
- message: 'hi',
416
- id: 20207,
417
- time: '2024-01-19T08:49:23.000Z',
418
- direction: 'inbound',
419
- message_type: 'text',
420
- messageId: null,
421
- is_live_agent: true,
422
- is_deleted: false,
423
- is_comment: false,
424
- channel: 'whatsapp',
425
- sent_to_vendor: true,
426
- replyMessageId: null,
427
- agent_name: null,
428
- df_agent_name: null,
429
- resolve_time: null,
430
- metadata: null,
431
- },
432
- {
433
- message: 'hi',
434
- id: 20206,
435
- time: '2024-01-19T08:46:09.000Z',
436
- direction: 'inbound',
437
- message_type: 'text',
438
- messageId: null,
439
- is_live_agent: true,
440
- is_deleted: false,
441
- is_comment: false,
442
- channel: 'whatsapp',
443
- sent_to_vendor: true,
444
- replyMessageId: null,
445
- agent_name: null,
446
- df_agent_name: null,
447
- resolve_time: null,
448
- metadata: null,
449
- },
450
- {
451
- message: 'hi',
452
- id: 20205,
453
- time: '2024-01-19T08:43:58.000Z',
454
- direction: 'inbound',
455
- message_type: 'text',
456
- messageId: null,
457
- is_live_agent: true,
458
- is_deleted: false,
459
- is_comment: false,
460
- channel: 'whatsapp',
461
- sent_to_vendor: true,
462
- replyMessageId: null,
463
- agent_name: null,
464
- df_agent_name: null,
465
- resolve_time: null,
466
- metadata: null,
467
- },
468
- {
469
- message: 'hi',
470
- id: 20204,
471
- time: '2024-01-19T08:41:43.000Z',
472
- direction: 'inbound',
473
- message_type: 'text',
474
- messageId: null,
475
- is_live_agent: true,
476
- is_deleted: false,
477
- is_comment: false,
478
- channel: 'whatsapp',
479
- sent_to_vendor: true,
480
- replyMessageId: null,
481
- agent_name: null,
482
- df_agent_name: null,
483
- resolve_time: null,
484
- metadata: null,
485
- },
486
- {
487
- message: 'hi',
488
- id: 20201,
489
- time: '2024-01-19T08:40:27.000Z',
490
- direction: 'inbound',
491
- message_type: 'text',
492
- messageId: null,
493
- is_live_agent: true,
494
- is_deleted: false,
495
- is_comment: false,
496
- channel: 'whatsapp',
497
- sent_to_vendor: true,
498
- replyMessageId: null,
499
- agent_name: null,
500
- df_agent_name: null,
501
- resolve_time: null,
502
- metadata: null,
503
- },
504
- {
505
- message: 'hi',
506
- id: 20200,
507
- time: '2024-01-19T08:39:19.000Z',
508
- direction: 'inbound',
509
- message_type: 'text',
510
- messageId: null,
511
- is_live_agent: true,
512
- is_deleted: false,
513
- is_comment: false,
514
- channel: 'whatsapp',
515
- sent_to_vendor: true,
516
- replyMessageId: null,
517
- agent_name: null,
518
- df_agent_name: null,
519
- resolve_time: null,
520
- metadata: null,
521
- },
522
- {
523
- message: 'hi',
524
- id: 20199,
525
- time: '2024-01-19T08:37:26.000Z',
526
- direction: 'inbound',
527
- message_type: 'text',
528
- messageId: null,
529
- is_live_agent: true,
530
- is_deleted: false,
531
- is_comment: false,
532
- channel: 'whatsapp',
533
- sent_to_vendor: true,
534
- replyMessageId: null,
535
- agent_name: null,
536
- df_agent_name: null,
537
- resolve_time: null,
538
- metadata: null,
539
- },
113
+
114
+ const messages = [
540
115
  {
541
- message: 'hi',
542
- id: 20198,
543
- time: '2024-01-19T08:36:57.000Z',
116
+ id: 78741,
117
+ message:
118
+ 'https://bm-chatbot-images.s3.eu-west-1.amazonaws.com/1b5a7bd9-a989-4963-8949-88aa748a2469.doc',
119
+ time: '2025-04-03T05:55:39.000Z',
544
120
  direction: 'inbound',
545
- message_type: 'text',
121
+ message_type: 'application/msword',
546
122
  messageId: null,
547
- is_live_agent: true,
548
- is_deleted: false,
549
- is_comment: false,
123
+ is_live_agent: 0,
124
+ is_deleted: 0,
125
+ is_comment: 0,
550
126
  channel: 'whatsapp',
551
- sent_to_vendor: true,
127
+ sent_to_vendor: 1,
552
128
  replyMessageId: null,
553
129
  agent_name: null,
554
130
  df_agent_name: null,
555
131
  resolve_time: null,
556
132
  metadata: null,
557
133
  },
134
+
558
135
  {
559
- message: 'hi',
560
- id: 20150,
561
- time: '2024-01-18T12:47:26.000Z',
136
+ id: 78739,
137
+ message:
138
+ 'https://bm-chatbot-images.s3.eu-west-1.amazonaws.com/5f0c7de7-c42b-4a94-b1cd-9fe3554da93d.pdf',
139
+ time: '2025-04-03T05:50:02.000Z',
562
140
  direction: 'inbound',
563
- message_type: 'text',
141
+ message_type: 'application/pdf',
564
142
  messageId: null,
565
- is_live_agent: true,
566
- is_deleted: false,
567
- is_comment: false,
143
+ is_live_agent: 0,
144
+ is_deleted: 0,
145
+ is_comment: 0,
568
146
  channel: 'whatsapp',
569
- sent_to_vendor: true,
147
+ sent_to_vendor: 1,
570
148
  replyMessageId: null,
571
149
  agent_name: null,
572
150
  df_agent_name: null,
573
151
  resolve_time: null,
574
152
  metadata: null,
575
153
  },
576
- {
577
- message: 'https://bm-chatbot-images.s3.eu-west-1.amazonaws.com/short.jpg',
578
- id: 20147,
579
- time: '2024-01-18T09:57:52.000Z',
580
- direction: 'outbound',
581
- message_type: 'image/png',
582
- messageId: 'ea15131f-2c55-43a3-b166-c38a2c4314b1',
583
- is_live_agent: true,
584
- is_deleted: false,
585
- is_comment: false,
586
- channel: 'whatsapp',
587
- sent_to_vendor: true,
588
- replyMessageId: null,
589
- agent_name: 'arl@beem.co.tz',
590
- df_agent_name: 'Dev arl',
591
- resolve_time: null,
592
- metadata: null,
593
- statusDetails: {
594
- statusCode: 3,
595
- },
596
- },
597
154
  ];
155
+ // const msg = [
156
+ // {
157
+ // message: 'Me as user replying to the beem message',
158
+ // id: 20278,
159
+ // time: '2024-01-22T11:59:08.000Z',
160
+ // direction: 'inbound',
161
+ // message_type: 'text',
162
+ // messageId: null,
163
+ // is_live_agent: true,
164
+ // is_deleted: false,
165
+ // is_comment: false,
166
+ // channel: 'whatsapp',
167
+ // sent_to_vendor: true,
168
+ // replyMessageId: 'b0a6b554-0cc3-4e45-83b2-3cada229a82c',
169
+ // agent_name: null,
170
+ // df_agent_name: null,
171
+ // resolve_time: null,
172
+ // metadata: {
173
+ // id: 'b0a6b554-0cc3-4e45-83b2-3cada229a82c',
174
+ // prev_message: 'this is message from beem',
175
+ // },
176
+ // },
177
+ // {
178
+ // message: 'this is message from beem',
179
+ // id: 20277,
180
+ // time: '2024-01-22T11:56:41.000Z',
181
+ // direction: 'outbound',
182
+ // message_type: null,
183
+ // messageId: 'b0a6b554-0cc3-4e45-83b2-3cada229a82c',
184
+ // is_live_agent: true,
185
+ // is_deleted: false,
186
+ // is_comment: false,
187
+ // channel: 'whatsapp',
188
+ // sent_to_vendor: true,
189
+ // replyMessageId: null,
190
+ // agent_name: 'arl@beem.co.tz',
191
+ // df_agent_name: 'Dev arl',
192
+ // resolve_time: null,
193
+ // metadata: null,
194
+ // statusDetails: {
195
+ // statusCode: 3,
196
+ // },
197
+ // },
198
+ // {
199
+ // message: 'hi',
200
+ // id: 20276,
201
+ // time: '2024-01-22T11:20:21.000Z',
202
+ // direction: 'outbound',
203
+ // message_type: null,
204
+ // messageId: '86ffe4bd-145e-4f50-83ef-83248b05c43a',
205
+ // is_live_agent: true,
206
+ // is_deleted: false,
207
+ // is_comment: false,
208
+ // channel: 'whatsapp',
209
+ // sent_to_vendor: true,
210
+ // replyMessageId: null,
211
+ // agent_name: 'arl@beem.co.tz',
212
+ // df_agent_name: 'Dev arl',
213
+ // resolve_time: null,
214
+ // metadata: null,
215
+ // statusDetails: {
216
+ // statusCode: 3,
217
+ // },
218
+ // },
219
+ // {
220
+ // message: 'hi',
221
+ // id: 20270,
222
+ // time: '2024-01-22T10:19:57.000Z',
223
+ // direction: 'outbound',
224
+ // message_type: null,
225
+ // messageId: '0e165d59-8300-4cd2-883d-dcb076c6f235',
226
+ // is_live_agent: true,
227
+ // is_deleted: false,
228
+ // is_comment: false,
229
+ // channel: 'whatsapp',
230
+ // sent_to_vendor: true,
231
+ // replyMessageId: null,
232
+ // agent_name: 'arl@beem.co.tz',
233
+ // df_agent_name: 'Dev arl',
234
+ // resolve_time: null,
235
+ // metadata: null,
236
+ // statusDetails: {
237
+ // statusCode: 3,
238
+ // },
239
+ // },
240
+ // {
241
+ // message: 'oh i am good',
242
+ // id: 20269,
243
+ // time: '2024-01-22T10:04:05.000Z',
244
+ // direction: 'inbound',
245
+ // message_type: 'text',
246
+ // messageId: null,
247
+ // is_live_agent: true,
248
+ // is_deleted: false,
249
+ // is_comment: false,
250
+ // channel: 'whatsapp',
251
+ // sent_to_vendor: true,
252
+ // replyMessageId: null,
253
+ // agent_name: null,
254
+ // df_agent_name: null,
255
+ // resolve_time: null,
256
+ // metadata: {
257
+ // id: 'ABEGJVeCJwBSAhB3WfEzKswmhITnP0z8qo12',
258
+ // prev_message: 'how are you????????',
259
+ // },
260
+ // },
261
+ // {
262
+ // message: 'how are you????????',
263
+ // id: 20268,
264
+ // time: '2024-01-22T10:03:23.000Z',
265
+ // direction: 'inbound',
266
+ // message_type: 'text',
267
+ // messageId: null,
268
+ // is_live_agent: true,
269
+ // is_deleted: false,
270
+ // is_comment: false,
271
+ // channel: 'whatsapp',
272
+ // sent_to_vendor: true,
273
+ // replyMessageId: null,
274
+ // agent_name: null,
275
+ // df_agent_name: null,
276
+ // resolve_time: null,
277
+ // metadata: null,
278
+ // },
279
+ // {
280
+ // message: 'hi\n',
281
+ // id: 20267,
282
+ // time: '2024-01-22T10:03:01.000Z',
283
+ // direction: 'outbound',
284
+ // message_type: null,
285
+ // messageId: 'f38be83c-92b1-47a7-9e6a-0d209da0ad86',
286
+ // is_live_agent: false,
287
+ // is_deleted: false,
288
+ // is_comment: false,
289
+ // channel: 'whatsapp',
290
+ // sent_to_vendor: true,
291
+ // replyMessageId: null,
292
+ // agent_name: 'arl@beem.co.tz',
293
+ // df_agent_name: 'Dev arl',
294
+ // resolve_time: null,
295
+ // metadata: null,
296
+ // statusDetails: {
297
+ // statusCode: 3,
298
+ // },
299
+ // },
300
+ // {
301
+ // message: 'Sorry, what was that?',
302
+ // id: 20266,
303
+ // time: '2024-01-22T10:02:36.000Z',
304
+ // direction: 'outbound',
305
+ // message_type: 'text',
306
+ // messageId: null,
307
+ // is_live_agent: false,
308
+ // is_deleted: false,
309
+ // is_comment: false,
310
+ // channel: 'whatsapp',
311
+ // sent_to_vendor: true,
312
+ // replyMessageId: null,
313
+ // agent_name: null,
314
+ // df_agent_name: null,
315
+ // resolve_time: null,
316
+ // metadata: null,
317
+ // statusDetails: {
318
+ // statusCode: 3,
319
+ // },
320
+ // },
321
+ // {
322
+ // message: 'how are you?',
323
+ // id: 20265,
324
+ // time: '2024-01-22T10:02:17.000Z',
325
+ // direction: 'inbound',
326
+ // message_type: 'text',
327
+ // messageId: null,
328
+ // is_live_agent: false,
329
+ // is_deleted: false,
330
+ // is_comment: false,
331
+ // channel: 'whatsapp',
332
+ // sent_to_vendor: true,
333
+ // replyMessageId: null,
334
+ // agent_name: null,
335
+ // df_agent_name: null,
336
+ // resolve_time: null,
337
+ // metadata: null,
338
+ // },
339
+ // {
340
+ // message: 'thank you for chatting with us!!! -Dev',
341
+ // id: 20264,
342
+ // time: '2024-01-22T09:55:00.000Z',
343
+ // direction: 'outbound',
344
+ // message_type: null,
345
+ // messageId: null,
346
+ // is_live_agent: true,
347
+ // is_deleted: false,
348
+ // is_comment: false,
349
+ // channel: 'whatsapp',
350
+ // sent_to_vendor: true,
351
+ // replyMessageId: null,
352
+ // agent_name: null,
353
+ // df_agent_name: null,
354
+ // resolve_time: null,
355
+ // metadata: null,
356
+ // statusDetails: {
357
+ // statusCode: 3,
358
+ // },
359
+ // },
360
+ // {
361
+ // message: 'One more time?',
362
+ // id: 20223,
363
+ // time: '2024-01-19T11:00:59.000Z',
364
+ // direction: 'outbound',
365
+ // message_type: 'text',
366
+ // messageId: null,
367
+ // is_live_agent: false,
368
+ // is_deleted: false,
369
+ // is_comment: false,
370
+ // channel: 'whatsapp',
371
+ // sent_to_vendor: true,
372
+ // replyMessageId: null,
373
+ // agent_name: null,
374
+ // df_agent_name: null,
375
+ // resolve_time: null,
376
+ // metadata: null,
377
+ // statusDetails: {
378
+ // statusCode: 3,
379
+ // },
380
+ // },
381
+ // {
382
+ // message: 'i am good',
383
+ // id: 20222,
384
+ // time: '2024-01-19T11:00:55.000Z',
385
+ // direction: 'inbound',
386
+ // message_type: 'text',
387
+ // messageId: null,
388
+ // is_live_agent: false,
389
+ // is_deleted: false,
390
+ // is_comment: false,
391
+ // channel: 'whatsapp',
392
+ // sent_to_vendor: true,
393
+ // replyMessageId: null,
394
+ // agent_name: null,
395
+ // df_agent_name: null,
396
+ // resolve_time: null,
397
+ // metadata: {
398
+ // id: 'ABEGJVaCQwSAAhCt33VV1Zivq9-48AP8bs_t',
399
+ // prev_message: 'if it doesnt exists then to fetch',
400
+ // },
401
+ // },
402
+ // {
403
+ // message: 'how are you?',
404
+ // id: 20220,
405
+ // time: '2024-01-19T10:59:48.000Z',
406
+ // direction: 'inbound',
407
+ // message_type: 'text',
408
+ // messageId: null,
409
+ // is_live_agent: false,
410
+ // is_deleted: false,
411
+ // is_comment: false,
412
+ // channel: 'whatsapp',
413
+ // sent_to_vendor: true,
414
+ // replyMessageId: null,
415
+ // agent_name: null,
416
+ // df_agent_name: null,
417
+ // resolve_time: null,
418
+ // metadata: null,
419
+ // },
420
+ // {
421
+ // message: 'thank you for chatting with us!!! -Dev',
422
+ // id: 20217,
423
+ // time: '2024-01-19T09:55:00.000Z',
424
+ // direction: 'outbound',
425
+ // message_type: null,
426
+ // messageId: null,
427
+ // is_live_agent: true,
428
+ // is_deleted: false,
429
+ // is_comment: false,
430
+ // channel: 'whatsapp',
431
+ // sent_to_vendor: true,
432
+ // replyMessageId: null,
433
+ // agent_name: null,
434
+ // df_agent_name: null,
435
+ // resolve_time: null,
436
+ // metadata: null,
437
+ // statusDetails: {
438
+ // statusCode: 3,
439
+ // },
440
+ // },
441
+ // {
442
+ // message: 'if it doesnt exists then to fetch',
443
+ // id: 20208,
444
+ // time: '2024-01-19T08:54:12.000Z',
445
+ // direction: 'inbound',
446
+ // message_type: 'text',
447
+ // messageId: null,
448
+ // is_live_agent: true,
449
+ // is_deleted: false,
450
+ // is_comment: false,
451
+ // channel: 'whatsapp',
452
+ // sent_to_vendor: true,
453
+ // replyMessageId: null,
454
+ // agent_name: null,
455
+ // df_agent_name: null,
456
+ // resolve_time: null,
457
+ // metadata: null,
458
+ // },
459
+ // {
460
+ // message: 'hi',
461
+ // id: 20207,
462
+ // time: '2024-01-19T08:49:23.000Z',
463
+ // direction: 'inbound',
464
+ // message_type: 'text',
465
+ // messageId: null,
466
+ // is_live_agent: true,
467
+ // is_deleted: false,
468
+ // is_comment: false,
469
+ // channel: 'whatsapp',
470
+ // sent_to_vendor: true,
471
+ // replyMessageId: null,
472
+ // agent_name: null,
473
+ // df_agent_name: null,
474
+ // resolve_time: null,
475
+ // metadata: null,
476
+ // },
477
+ // {
478
+ // message: 'hi',
479
+ // id: 20206,
480
+ // time: '2024-01-19T08:46:09.000Z',
481
+ // direction: 'inbound',
482
+ // message_type: 'text',
483
+ // messageId: null,
484
+ // is_live_agent: true,
485
+ // is_deleted: false,
486
+ // is_comment: false,
487
+ // channel: 'whatsapp',
488
+ // sent_to_vendor: true,
489
+ // replyMessageId: null,
490
+ // agent_name: null,
491
+ // df_agent_name: null,
492
+ // resolve_time: null,
493
+ // metadata: null,
494
+ // },
495
+ // {
496
+ // message: 'hi',
497
+ // id: 20205,
498
+ // time: '2024-01-19T08:43:58.000Z',
499
+ // direction: 'inbound',
500
+ // message_type: 'text',
501
+ // messageId: null,
502
+ // is_live_agent: true,
503
+ // is_deleted: false,
504
+ // is_comment: false,
505
+ // channel: 'whatsapp',
506
+ // sent_to_vendor: true,
507
+ // replyMessageId: null,
508
+ // agent_name: null,
509
+ // df_agent_name: null,
510
+ // resolve_time: null,
511
+ // metadata: null,
512
+ // },
513
+ // {
514
+ // message: 'hi',
515
+ // id: 20204,
516
+ // time: '2024-01-19T08:41:43.000Z',
517
+ // direction: 'inbound',
518
+ // message_type: 'text',
519
+ // messageId: null,
520
+ // is_live_agent: true,
521
+ // is_deleted: false,
522
+ // is_comment: false,
523
+ // channel: 'whatsapp',
524
+ // sent_to_vendor: true,
525
+ // replyMessageId: null,
526
+ // agent_name: null,
527
+ // df_agent_name: null,
528
+ // resolve_time: null,
529
+ // metadata: null,
530
+ // },
531
+ // {
532
+ // message: 'hi',
533
+ // id: 20201,
534
+ // time: '2024-01-19T08:40:27.000Z',
535
+ // direction: 'inbound',
536
+ // message_type: 'text',
537
+ // messageId: null,
538
+ // is_live_agent: true,
539
+ // is_deleted: false,
540
+ // is_comment: false,
541
+ // channel: 'whatsapp',
542
+ // sent_to_vendor: true,
543
+ // replyMessageId: null,
544
+ // agent_name: null,
545
+ // df_agent_name: null,
546
+ // resolve_time: null,
547
+ // metadata: null,
548
+ // },
549
+ // {
550
+ // message: 'hi',
551
+ // id: 20200,
552
+ // time: '2024-01-19T08:39:19.000Z',
553
+ // direction: 'inbound',
554
+ // message_type: 'text',
555
+ // messageId: null,
556
+ // is_live_agent: true,
557
+ // is_deleted: false,
558
+ // is_comment: false,
559
+ // channel: 'whatsapp',
560
+ // sent_to_vendor: true,
561
+ // replyMessageId: null,
562
+ // agent_name: null,
563
+ // df_agent_name: null,
564
+ // resolve_time: null,
565
+ // metadata: null,
566
+ // },
567
+ // {
568
+ // message: 'hi',
569
+ // id: 20199,
570
+ // time: '2024-01-19T08:37:26.000Z',
571
+ // direction: 'inbound',
572
+ // message_type: 'text',
573
+ // messageId: null,
574
+ // is_live_agent: true,
575
+ // is_deleted: false,
576
+ // is_comment: false,
577
+ // channel: 'whatsapp',
578
+ // sent_to_vendor: true,
579
+ // replyMessageId: null,
580
+ // agent_name: null,
581
+ // df_agent_name: null,
582
+ // resolve_time: null,
583
+ // metadata: null,
584
+ // },
585
+ // {
586
+ // message: 'hi',
587
+ // id: 20198,
588
+ // time: '2024-01-19T08:36:57.000Z',
589
+ // direction: 'inbound',
590
+ // message_type: 'text',
591
+ // messageId: null,
592
+ // is_live_agent: true,
593
+ // is_deleted: false,
594
+ // is_comment: false,
595
+ // channel: 'whatsapp',
596
+ // sent_to_vendor: true,
597
+ // replyMessageId: null,
598
+ // agent_name: null,
599
+ // df_agent_name: null,
600
+ // resolve_time: null,
601
+ // metadata: null,
602
+ // },
603
+ // {
604
+ // message: 'hi',
605
+ // id: 20150,
606
+ // time: '2024-01-18T12:47:26.000Z',
607
+ // direction: 'inbound',
608
+ // message_type: 'text',
609
+ // messageId: null,
610
+ // is_live_agent: true,
611
+ // is_deleted: false,
612
+ // is_comment: false,
613
+ // channel: 'whatsapp',
614
+ // sent_to_vendor: true,
615
+ // replyMessageId: null,
616
+ // agent_name: null,
617
+ // df_agent_name: null,
618
+ // resolve_time: null,
619
+ // metadata: null,
620
+ // },
621
+ // {
622
+ // message: 'https://bm-chatbot-images.s3.eu-west-1.amazonaws.com/short.jpg',
623
+ // id: 20147,
624
+ // time: '2024-01-18T09:57:52.000Z',
625
+ // direction: 'outbound',
626
+ // message_type: 'image/png',
627
+ // messageId: 'ea15131f-2c55-43a3-b166-c38a2c4314b1',
628
+ // is_live_agent: true,
629
+ // is_deleted: false,
630
+ // is_comment: false,
631
+ // channel: 'whatsapp',
632
+ // sent_to_vendor: true,
633
+ // replyMessageId: null,
634
+ // agent_name: 'arl@beem.co.tz',
635
+ // df_agent_name: 'Dev arl',
636
+ // resolve_time: null,
637
+ // metadata: null,
638
+ // statusDetails: {
639
+ // statusCode: 3,
640
+ // },
641
+ // },
642
+ // ];
598
643
 
599
644
  // const parsed = JSON.stringify(message.message);
600
645
  // const dotGoV2Content = parsed?.dotgoV2;
601
- const data = {
602
- type: 'list',
603
- title: 'Our services',
604
- body: 'Need to schedule an appointment or request a home service? We’ve got you covered! tap to check out the menu below \n \n👇🏼👇🏼👇🏼👇🏼👇🏼👇🏼👇🏼',
605
- msgid: 'services',
606
- globalButtons: [
607
- {
608
- type: 'text',
609
- title: 'Services',
610
- },
611
- ],
612
- items: [
613
- {
614
- title: 'Services menu',
615
- subtitle: '',
616
- options: [
617
- {
618
- type: 'text',
619
- title: 'Announcements',
620
- description: 'Incoming doctors',
621
- postbackText: 'section 1 row 1 postback payload',
622
- },
623
- {
624
- type: 'text',
625
- title: 'Appointments',
626
- description: 'Bookings',
627
- postbackText: 'section 1 row 2 postback payload',
628
- },
629
- {
630
- type: 'text',
631
- title: 'Home Services',
632
- description: '',
633
- postbackText: 'section 1 row 3 postback payload',
634
- },
635
- {
636
- type: 'text',
637
- title: 'FAQ’s',
638
- description: 'Frequently Asked Questions',
639
- postbackText: 'section 1 row 4 postback payload',
640
- },
641
- {
642
- type: 'text',
643
- title: 'Speak to agent',
644
- description: '',
645
- postbackText: 'section 1 row 5 postback payload',
646
- },
647
- {
648
- type: 'text',
649
- title: 'Go back',
650
- description: '',
651
- postbackText: 'section 1 row 6 postback payload',
652
- },
653
- ],
654
- },
655
- ],
656
- };
646
+
647
+ // const data = {
648
+ // type: 'list',
649
+ // title: 'Our services',
650
+ // body: 'Need to schedule an appointment or request a home service? We’ve got you covered! tap to check out the menu below \n \n👇🏼👇🏼👇🏼👇🏼👇🏼👇🏼👇🏼',
651
+ // msgid: 'services',
652
+ // globalButtons: [
653
+ // {
654
+ // type: 'text',
655
+ // title: 'Services',
656
+ // },
657
+ // ],
658
+ // items: [
659
+ // {
660
+ // title: 'Services menu',
661
+ // subtitle: '',
662
+ // options: [
663
+ // {
664
+ // type: 'text',
665
+ // title: 'Announcements',
666
+ // description: 'Incoming doctors',
667
+ // postbackText: 'section 1 row 1 postback payload',
668
+ // },
669
+ // {
670
+ // type: 'text',
671
+ // title: 'Appointments',
672
+ // description: 'Bookings',
673
+ // postbackText: 'section 1 row 2 postback payload',
674
+ // },
675
+ // {
676
+ // type: 'text',
677
+ // title: 'Home Services',
678
+ // description: '',
679
+ // postbackText: 'section 1 row 3 postback payload',
680
+ // },
681
+ // {
682
+ // type: 'text',
683
+ // title: 'FAQ’s',
684
+ // description: 'Frequently Asked Questions',
685
+ // postbackText: 'section 1 row 4 postback payload',
686
+ // },
687
+ // {
688
+ // type: 'text',
689
+ // title: 'Speak to agent',
690
+ // description: '',
691
+ // postbackText: 'section 1 row 5 postback payload',
692
+ // },
693
+ // {
694
+ // type: 'text',
695
+ // title: 'Go back',
696
+ // description: '',
697
+ // postbackText: 'section 1 row 6 postback payload',
698
+ // },
699
+ // ],
700
+ // },
701
+ // ],
702
+ // };
703
+
657
704
  const renderJsonMessage = () => {
658
- const parsedMessage = JSON.parse(message.message);
705
+ let parsedMessage;
706
+ try {
707
+ parsedMessage = JSON.parse(message.message);
708
+ } catch (error) {
709
+ console.error('Error parsing JSON:', error);
710
+ return null;
711
+ }
712
+
713
+ console.log(message.message_type);
659
714
  const dotGoV2Content = parsedMessage?.dotgoV2;
715
+
716
+ if (message.message_type === 'order' && dotGoV2Content?.type === 'order') {
717
+ const items = dotGoV2Content?.catalog?.order?.items || [];
718
+ if (items.length === 0) {
719
+ return 0;
720
+ }
721
+
722
+ // Use reduce to calculate total
723
+ const totalValue = items.reduce((total, item) => {
724
+ return total + item.amount * item.quantity;
725
+ }, 0);
726
+
727
+ const currency = items[0]?.currency || '';
728
+ const count = items.length;
729
+ const formattedTotal = totalValue.toLocaleString('en-US');
730
+
731
+ return { amount: `${currency} ${formattedTotal}`, type: 'order', count };
732
+ }
733
+
660
734
  console.log({ parsedMessage });
661
735
  console.log({ dotGoV2Content });
662
736
  return dotGoV2Content;
663
737
  };
664
- const [checkboxVisibility, setCheckboxVisibility] = useState([]);
738
+ // const [checkboxVisibility, setCheckboxVisibility] = useState([]);
665
739
 
666
740
  // Handler function for the checkbox change event
667
- const handleCheckboxChange = (index, checked) => {
668
- const updatedVisibility = [...checkboxVisibility]; // Create a copy of the visibility state array
669
- updatedVisibility[index] = checked; // Update the visibility state for the corresponding checkbox
670
- setCheckboxVisibility(updatedVisibility); // Update the state
671
- };
741
+ // const handleCheckboxChange = (index, checked) => {
742
+ // const updatedVisibility = [...checkboxVisibility]; // Create a copy of the visibility state array
743
+ // updatedVisibility[index] = checked; // Update the visibility state for the corresponding checkbox
744
+ // setCheckboxVisibility(updatedVisibility); // Update the state
745
+ // };
672
746
 
673
747
  const renderJsonMessagex = () => {
674
748
  const parsedMessage = JSON.parse(x.metadata.prev_message);
@@ -677,7 +751,7 @@ const Chat = () => {
677
751
  console.log({ dotGoV2Content });
678
752
  return dotGoV2Content;
679
753
  };
680
- console.log(data);
754
+ // console.log(data);
681
755
  const image =
682
756
  'https://media4.giphy.com/media/v1.Y2lkPTc5MGI3NjExc2w1ZnI0OW5xdHk4eXU3bXg3ODFmMmxpZThnYmF2bnNudDN4dXlmaiZlcD12MV9naWZzX3NlYXJjaCZjdD1n/sGsoN9tI8a1k04pNcf/giphy.webp';
683
757
 
@@ -690,6 +764,18 @@ const Chat = () => {
690
764
  <GlobalStyle />
691
765
 
692
766
  <div>
767
+ <BmChat.Details
768
+ state="outbound"
769
+ session="bot"
770
+ sessionTimeline={{ message: <p>12:00pm</p> }}
771
+ displayTime={<p>12:00pm</p>}
772
+ status="sent"
773
+ // type="interactive"
774
+ metadata={renderJsonMessagex()}
775
+ isInteractive="true"
776
+ >
777
+ <p>{x.message}</p>
778
+ </BmChat.Details>
693
779
  <BmChatAccordion Open expandIconPosition="left">
694
780
  <BmChatAccordion.Title
695
781
  // trailingIcon={<AbcIcon />}
@@ -834,7 +920,7 @@ const Chat = () => {
834
920
  <BmIcons icon={<SendIcon />} size="xlarge" />
835
921
  </div>
836
922
  </BmChat.Footer> */}
837
- <div className="w-20">
923
+ {/* <div className="w-20">
838
924
  <BmButton size="xsmall" variant="neutral">
839
925
  Hello
840
926
  </BmButton>
@@ -874,7 +960,7 @@ const Chat = () => {
874
960
  <BmButton variant="success">Hello</BmButton>
875
961
  <BmButton size="large" variant="destructive">
876
962
  Hello
877
- </BmButton>
963
+ </BmButton> */}
878
964
  {/* <BmButton size="small" variant="tertiary">
879
965
  Hello
880
966
  </BmButton>
@@ -882,7 +968,7 @@ const Chat = () => {
882
968
  Hello
883
969
  </BmButton> */}
884
970
  <BmChat.Details
885
- state="inbound"
971
+ state="outbound"
886
972
  session="bot"
887
973
  sessionTimeline={{ message: <p>12:00pm</p> }}
888
974
  displayTime={<p>12:00pm</p>}
@@ -1024,33 +1110,20 @@ const Chat = () => {
1024
1110
  goes this wide mhhhhhh interesting
1025
1111
  </p> */}
1026
1112
  </BmChat.Details>
1027
- <BmChat.Details
1028
- state="inbound"
1029
- session="bot"
1030
- sessionTimeline={{ message: <p>12:00pm</p> }}
1031
- displayTime={<p>12:00pm</p>}
1032
- status="sent"
1033
- // type="interactive"
1034
- metadata={renderJsonMessagex()}
1035
- isInteractive="true"
1036
- >
1037
- <p>{x.message}</p>
1038
- </BmChat.Details>
1113
+
1039
1114
  <BmContactCard />
1040
1115
  </BmChat>
1041
- <BmChat>
1116
+ {/* <BmChat>
1042
1117
  <BmChat.Body>
1043
1118
  {msg.map((ms, index) => (
1044
1119
  <BmContactCard isVisible={checkboxVisibility[index]}>
1045
1120
  <BmContactCard.Profile>
1046
- {/* <Tooltip title="yoooo"> */}
1047
1121
  <BmProfileIcon
1048
1122
  hoverEnabled
1049
1123
  hoverText="dfk dsflksd;"
1050
1124
  size="medium"
1051
1125
  multiChannel="#b6fc03"
1052
1126
  />
1053
- {/* </Tooltip> */}
1054
1127
  </BmContactCard.Profile>
1055
1128
  <BmContactCard.Details>
1056
1129
  <BmContactCard.SubDetails>
@@ -1075,6 +1148,71 @@ const Chat = () => {
1075
1148
  </BmContactCard>
1076
1149
  ))}
1077
1150
  </BmChat.Body>
1151
+ </BmChat> */}
1152
+
1153
+ <BmChat>
1154
+ <BmChat.Body>
1155
+ {messages.map((ms) => {
1156
+ console.log(ms);
1157
+ return (
1158
+ <BmChat.Details
1159
+ key={ms.id}
1160
+ state={ms.direction}
1161
+ session="bot"
1162
+ sessionTimeline={{ message: <p>12:00pm</p> }}
1163
+ displayTime={<p>12:00pm</p>}
1164
+ status="sent"
1165
+ file={ms.message}
1166
+ link={ms.message}
1167
+ fileName={<p>File</p>}
1168
+ type="pdf"
1169
+ style={{ margin: '-0.6% 0 0 0' }}
1170
+ >
1171
+ <p>
1172
+ <a href={ms.message}> </a>
1173
+ </p>
1174
+ </BmChat.Details>
1175
+ );
1176
+ })}
1177
+ </BmChat.Body>
1178
+ </BmChat>
1179
+ <BmChat>
1180
+ <BmChat.Body>
1181
+ {messages.map((ms) => {
1182
+ console.log(ms);
1183
+ return (
1184
+ <BmChat.Details
1185
+ key={ms.id}
1186
+ state={ms.direction}
1187
+ session="bot"
1188
+ sessionTimeline={{ message: <p>12:00pm</p> }}
1189
+ displayTime={<p>12:00pm</p>}
1190
+ status="sent"
1191
+ file={ms.message}
1192
+ link={ms.message}
1193
+ fileName={<p>File</p>}
1194
+ style={{ margin: '-0.6% 0 0 0' }}
1195
+ // state="inbound"
1196
+ // session="live"
1197
+ // displayTime={<p>10:00am</p>}
1198
+ // status="failed"
1199
+ // fileName={<p>file.csv</p>}
1200
+ // file={image}
1201
+ >
1202
+ {' '}
1203
+ <div>
1204
+ {/* <FileViewer
1205
+ fileType="docx"
1206
+ filePath={ms.message}
1207
+ onError={onError}
1208
+ // errorComponent={CustomErrorComponent}
1209
+ // onError={this.onError}
1210
+ /> */}
1211
+ </div>
1212
+ </BmChat.Details>
1213
+ );
1214
+ })}
1215
+ </BmChat.Body>
1078
1216
  </BmChat>
1079
1217
  </>
1080
1218
  );