stream-chat-react-native-core 9.3.1-beta.1 → 9.3.1-beta.2

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 (22) hide show
  1. package/lib/commonjs/components/Message/MessageItemView/MessageAuthor.js.map +1 -1
  2. package/lib/commonjs/components/Message/MessageItemView/MessageItemView.js +8 -5
  3. package/lib/commonjs/components/Message/MessageItemView/MessageItemView.js.map +1 -1
  4. package/lib/commonjs/components/Message/MessageItemView/MessageWrapper.js +3 -7
  5. package/lib/commonjs/components/Message/MessageItemView/MessageWrapper.js.map +1 -1
  6. package/lib/commonjs/version.json +1 -1
  7. package/lib/module/components/Message/MessageItemView/MessageAuthor.js.map +1 -1
  8. package/lib/module/components/Message/MessageItemView/MessageItemView.js +8 -5
  9. package/lib/module/components/Message/MessageItemView/MessageItemView.js.map +1 -1
  10. package/lib/module/components/Message/MessageItemView/MessageWrapper.js +3 -7
  11. package/lib/module/components/Message/MessageItemView/MessageWrapper.js.map +1 -1
  12. package/lib/module/version.json +1 -1
  13. package/lib/typescript/components/Message/MessageItemView/MessageAuthor.d.ts.map +1 -1
  14. package/lib/typescript/components/Message/MessageItemView/MessageItemView.d.ts +1 -1
  15. package/lib/typescript/components/Message/MessageItemView/MessageItemView.d.ts.map +1 -1
  16. package/lib/typescript/components/Message/MessageItemView/MessageWrapper.d.ts.map +1 -1
  17. package/package.json +1 -1
  18. package/src/components/Message/MessageItemView/MessageAuthor.tsx +7 -0
  19. package/src/components/Message/MessageItemView/MessageItemView.tsx +9 -3
  20. package/src/components/Message/MessageItemView/MessageWrapper.tsx +4 -6
  21. package/src/components/Thread/__tests__/__snapshots__/Thread.test.tsx.snap +632 -676
  22. package/src/version.json +1 -1
@@ -330,325 +330,313 @@ exports[`Thread should match thread snapshot 1`] = `
330
330
  testID="message-list-item-38ef6f7c-3090-5759-a37f-ab0053aadb96"
331
331
  >
332
332
  <View
333
- testID="message-list-item-38ef6f7c-3090-5759-a37f-ab0053aadb96"
334
- >
335
- <View
336
- style={
333
+ style={
334
+ [
337
335
  [
338
- [
339
- {},
340
- ],
341
- {
342
- "paddingHorizontal": 16,
343
- },
344
- ]
345
- }
346
- testID="message-wrapper"
347
- >
348
- <View />
349
- <View>
336
+ {},
337
+ ],
338
+ {
339
+ "paddingHorizontal": 16,
340
+ },
341
+ ]
342
+ }
343
+ testID="message-wrapper"
344
+ >
345
+ <View />
346
+ <View>
347
+ <View
348
+ collapsable={false}
349
+ >
350
350
  <View
351
351
  collapsable={false}
352
+ hitSlop={
353
+ {
354
+ "left": 750,
355
+ "right": 750,
356
+ }
357
+ }
358
+ style={
359
+ {
360
+ "alignItems": "center",
361
+ "flexDirection": "row",
362
+ "zIndex": 1,
363
+ }
364
+ }
352
365
  >
353
366
  <View
354
- collapsable={false}
355
- hitSlop={
356
- {
357
- "left": 750,
358
- "right": 750,
359
- }
360
- }
367
+ pointerEvents="box-none"
361
368
  style={
362
369
  {
363
- "alignItems": "center",
370
+ "alignItems": "flex-end",
364
371
  "flexDirection": "row",
365
- "zIndex": 1,
372
+ "gap": 8,
373
+ "paddingVertical": 8,
374
+ "width": "100%",
366
375
  }
367
376
  }
377
+ testID="message-item-view-wrapper"
368
378
  >
369
379
  <View
370
- pointerEvents="box-none"
371
- style={
372
- {
373
- "alignItems": "flex-end",
374
- "flexDirection": "row",
375
- "gap": 8,
376
- "paddingVertical": 8,
377
- "width": "100%",
378
- }
379
- }
380
- testID="message-item-view-wrapper"
380
+ style={{}}
381
+ testID="message-author"
381
382
  >
382
383
  <View
383
- style={{}}
384
- testID="message-author"
384
+ testID="user-avatar"
385
385
  >
386
386
  <View
387
- testID="user-avatar"
387
+ style={
388
+ [
389
+ {
390
+ "alignItems": "center",
391
+ "borderRadius": 9999,
392
+ "justifyContent": "center",
393
+ "overflow": "hidden",
394
+ },
395
+ {
396
+ "height": 32,
397
+ "width": 32,
398
+ },
399
+ {
400
+ "backgroundColor": "#fcd579",
401
+ },
402
+ {
403
+ "borderColor": "rgba(26, 27, 37, 0.1)",
404
+ "borderWidth": 1,
405
+ },
406
+ undefined,
407
+ ]
408
+ }
409
+ testID="avatar-image"
388
410
  >
389
- <View
411
+ <Image
412
+ accessibilityElementsHidden={true}
413
+ importantForAccessibility="no"
414
+ onError={[Function]}
415
+ source={
416
+ {
417
+ "uri": "https://i.imgur.com/LuuGvh0.png",
418
+ }
419
+ }
390
420
  style={
391
421
  [
392
- {
393
- "alignItems": "center",
394
- "borderRadius": 9999,
395
- "justifyContent": "center",
396
- "overflow": "hidden",
397
- },
422
+ {},
398
423
  {
399
424
  "height": 32,
400
425
  "width": 32,
401
426
  },
402
- {
403
- "backgroundColor": "#fcd579",
404
- },
405
- {
406
- "borderColor": "rgba(26, 27, 37, 0.1)",
407
- "borderWidth": 1,
408
- },
409
- undefined,
410
427
  ]
411
428
  }
412
- testID="avatar-image"
413
- >
414
- <Image
415
- accessibilityElementsHidden={true}
416
- importantForAccessibility="no"
417
- onError={[Function]}
418
- source={
419
- {
420
- "uri": "https://i.imgur.com/LuuGvh0.png",
421
- }
422
- }
423
- style={
424
- [
425
- {},
426
- {
427
- "height": 32,
428
- "width": 32,
429
- },
430
- ]
431
- }
432
- />
433
- </View>
429
+ />
434
430
  </View>
435
431
  </View>
432
+ </View>
433
+ <View
434
+ style={
435
+ [
436
+ {
437
+ "gap": 4,
438
+ },
439
+ {
440
+ "alignItems": "flex-start",
441
+ },
442
+ {},
443
+ ]
444
+ }
445
+ testID="message-components"
446
+ >
436
447
  <View
437
448
  style={
438
- [
439
- {
440
- "gap": 4,
441
- },
442
- {
443
- "alignItems": "flex-start",
444
- },
445
- {},
446
- ]
449
+ {
450
+ "zIndex": 1,
451
+ }
447
452
  }
448
- testID="message-components"
449
453
  >
450
454
  <View
451
455
  style={
452
456
  {
453
- "zIndex": 1,
457
+ "alignSelf": "flex-end",
458
+ }
459
+ }
460
+ />
461
+ <View
462
+ style={
463
+ {
464
+ "alignSelf": "flex-start",
454
465
  }
455
466
  }
456
467
  >
457
468
  <View
458
- style={
469
+ accessibilityState={
459
470
  {
460
- "alignSelf": "flex-end",
471
+ "busy": undefined,
472
+ "checked": undefined,
473
+ "disabled": undefined,
474
+ "expanded": undefined,
475
+ "selected": undefined,
461
476
  }
462
477
  }
463
- />
464
- <View
465
- style={
478
+ accessibilityValue={
466
479
  {
467
- "alignSelf": "flex-start",
480
+ "max": undefined,
481
+ "min": undefined,
482
+ "now": undefined,
483
+ "text": undefined,
468
484
  }
469
485
  }
486
+ accessible={true}
487
+ collapsable={false}
488
+ focusable={true}
489
+ onBlur={[Function]}
490
+ onClick={[Function]}
491
+ onFocus={[Function]}
492
+ onResponderGrant={[Function]}
493
+ onResponderMove={[Function]}
494
+ onResponderRelease={[Function]}
495
+ onResponderTerminate={[Function]}
496
+ onResponderTerminationRequest={[Function]}
497
+ onStartShouldSetResponder={[Function]}
498
+ style={{}}
470
499
  >
471
500
  <View
472
- accessibilityState={
473
- {
474
- "busy": undefined,
475
- "checked": undefined,
476
- "disabled": undefined,
477
- "expanded": undefined,
478
- "selected": undefined,
479
- }
480
- }
481
- accessibilityValue={
482
- {
483
- "max": undefined,
484
- "min": undefined,
485
- "now": undefined,
486
- "text": undefined,
487
- }
501
+ style={
502
+ [
503
+ {
504
+ "borderTopLeftRadius": 20,
505
+ "borderTopRightRadius": 20,
506
+ "borderWidth": 0,
507
+ "overflow": "hidden",
508
+ },
509
+ {
510
+ "backgroundColor": "#ebeef1",
511
+ "borderBottomLeftRadius": 0,
512
+ "borderBottomRightRadius": 20,
513
+ },
514
+ {},
515
+ {},
516
+ {},
517
+ ]
488
518
  }
489
- accessible={true}
490
- collapsable={false}
491
- focusable={true}
492
- onBlur={[Function]}
493
- onClick={[Function]}
494
- onFocus={[Function]}
495
- onResponderGrant={[Function]}
496
- onResponderMove={[Function]}
497
- onResponderRelease={[Function]}
498
- onResponderTerminate={[Function]}
499
- onResponderTerminationRequest={[Function]}
500
- onStartShouldSetResponder={[Function]}
501
- style={{}}
519
+ testID="message-content-wrapper"
502
520
  >
503
521
  <View
504
522
  style={
505
523
  [
506
524
  {
507
- "borderTopLeftRadius": 20,
508
- "borderTopRightRadius": 20,
509
- "borderWidth": 0,
510
- "overflow": "hidden",
525
+ "gap": 8,
526
+ "paddingBottom": 0,
527
+ "paddingHorizontal": 8,
528
+ "paddingTop": 0,
511
529
  },
530
+ {},
531
+ ]
532
+ }
533
+ />
534
+ <View
535
+ style={
536
+ [
512
537
  {
513
- "backgroundColor": "#ebeef1",
514
- "borderBottomLeftRadius": 0,
515
- "borderBottomRightRadius": 20,
538
+ "maxWidth": 256,
539
+ "paddingHorizontal": 12,
516
540
  },
517
541
  {},
518
- {},
519
- {},
542
+ undefined,
520
543
  ]
521
544
  }
522
- testID="message-content-wrapper"
545
+ testID="message-text-container"
523
546
  >
524
547
  <View
525
548
  style={
526
549
  [
527
550
  {
528
- "gap": 8,
529
- "paddingBottom": 0,
530
- "paddingHorizontal": 8,
531
- "paddingTop": 0,
532
- },
533
- {},
534
- ]
535
- }
536
- />
537
- <View
538
- style={
539
- [
540
- {
541
- "maxWidth": 256,
542
- "paddingHorizontal": 12,
551
+ "alignSelf": "stretch",
543
552
  },
544
- {},
545
553
  undefined,
546
554
  ]
547
555
  }
548
- testID="message-text-container"
549
556
  >
550
- <View
557
+ <Text
551
558
  style={
552
- [
553
- {
554
- "alignSelf": "stretch",
555
- },
556
- undefined,
557
- ]
559
+ {
560
+ "alignItems": "flex-start",
561
+ "flexDirection": "row",
562
+ "flexWrap": "wrap",
563
+ "fontSize": 17,
564
+ "justifyContent": "flex-start",
565
+ "lineHeight": 20,
566
+ "marginBottom": 8,
567
+ "marginTop": 8,
568
+ }
558
569
  }
559
570
  >
560
571
  <Text
561
572
  style={
562
573
  {
563
- "alignItems": "flex-start",
564
- "flexDirection": "row",
565
- "flexWrap": "wrap",
574
+ "color": "#1a1b25",
566
575
  "fontSize": 17,
567
- "justifyContent": "flex-start",
568
576
  "lineHeight": 20,
569
- "marginBottom": 8,
570
- "marginTop": 8,
577
+ "writingDirection": "ltr",
571
578
  }
572
579
  }
573
580
  >
574
- <Text
575
- style={
576
- {
577
- "color": "#1a1b25",
578
- "fontSize": 17,
579
- "lineHeight": 20,
580
- "writingDirection": "ltr",
581
- }
582
- }
583
- >
584
- Message6
585
- </Text>
581
+ Message6
586
582
  </Text>
587
- </View>
583
+ </Text>
588
584
  </View>
589
585
  </View>
590
586
  </View>
591
587
  </View>
592
588
  </View>
593
- <View
589
+ </View>
590
+ <View
591
+ style={
592
+ [
593
+ {
594
+ "alignItems": "center",
595
+ "flexDirection": "row",
596
+ "gap": 4,
597
+ "justifyContent": "center",
598
+ "maxWidth": "100%",
599
+ "paddingVertical": 4,
600
+ },
601
+ {},
602
+ ]
603
+ }
604
+ testID="message-status-time"
605
+ >
606
+ <Text
594
607
  style={
595
608
  {
596
- "marginTop": -4,
597
- "zIndex": 0,
609
+ "color": "#687385",
610
+ "fontSize": 13,
611
+ "fontWeight": 400,
612
+ "lineHeight": 16,
598
613
  }
599
614
  }
600
- />
601
- <View
615
+ >
616
+ 2:50 PM
617
+ </Text>
618
+ <Text
602
619
  style={
603
620
  [
604
621
  {
605
- "alignItems": "center",
606
- "flexDirection": "row",
607
- "gap": 4,
608
- "justifyContent": "center",
609
- "maxWidth": "100%",
610
- "paddingVertical": 4,
622
+ "color": "#687385",
623
+ "fontSize": 13,
624
+ "fontWeight": 400,
625
+ "lineHeight": 16,
611
626
  },
612
627
  {},
613
628
  ]
614
629
  }
615
- testID="message-status-time"
616
630
  >
617
- <Text
618
- style={
619
- {
620
- "color": "#687385",
621
- "fontSize": 13,
622
- "fontWeight": 400,
623
- "lineHeight": 16,
624
- }
625
- }
626
- >
627
- 2:50 PM
628
- </Text>
629
- <Text
630
- style={
631
- [
632
- {
633
- "color": "#687385",
634
- "fontSize": 13,
635
- "fontWeight": 400,
636
- "lineHeight": 16,
637
- },
638
- {},
639
- ]
640
- }
641
- >
642
- Edited
643
- </Text>
644
- </View>
631
+ Edited
632
+ </Text>
645
633
  </View>
646
634
  </View>
647
635
  </View>
648
636
  </View>
649
637
  </View>
650
- <View />
651
638
  </View>
639
+ <View />
652
640
  </View>
653
641
  </View>
654
642
  </View>
@@ -674,325 +662,313 @@ exports[`Thread should match thread snapshot 1`] = `
674
662
  testID="message-list-item-516efa25-5d29-5c9a-ad2d-4cc183e785bd"
675
663
  >
676
664
  <View
677
- testID="message-list-item-516efa25-5d29-5c9a-ad2d-4cc183e785bd"
678
- >
679
- <View
680
- style={
665
+ style={
666
+ [
681
667
  [
682
- [
683
- {},
684
- ],
685
- {
686
- "paddingHorizontal": 16,
687
- },
688
- ]
689
- }
690
- testID="message-wrapper"
691
- >
692
- <View />
693
- <View>
668
+ {},
669
+ ],
670
+ {
671
+ "paddingHorizontal": 16,
672
+ },
673
+ ]
674
+ }
675
+ testID="message-wrapper"
676
+ >
677
+ <View />
678
+ <View>
679
+ <View
680
+ collapsable={false}
681
+ >
694
682
  <View
695
683
  collapsable={false}
684
+ hitSlop={
685
+ {
686
+ "left": 750,
687
+ "right": 750,
688
+ }
689
+ }
690
+ style={
691
+ {
692
+ "alignItems": "center",
693
+ "flexDirection": "row",
694
+ "zIndex": 1,
695
+ }
696
+ }
696
697
  >
697
698
  <View
698
- collapsable={false}
699
- hitSlop={
700
- {
701
- "left": 750,
702
- "right": 750,
703
- }
704
- }
699
+ pointerEvents="box-none"
705
700
  style={
706
701
  {
707
- "alignItems": "center",
702
+ "alignItems": "flex-end",
708
703
  "flexDirection": "row",
709
- "zIndex": 1,
704
+ "gap": 8,
705
+ "paddingVertical": 8,
706
+ "width": "100%",
710
707
  }
711
708
  }
709
+ testID="message-item-view-wrapper"
712
710
  >
713
711
  <View
714
- pointerEvents="box-none"
715
- style={
716
- {
717
- "alignItems": "flex-end",
718
- "flexDirection": "row",
719
- "gap": 8,
720
- "paddingVertical": 8,
721
- "width": "100%",
722
- }
723
- }
724
- testID="message-item-view-wrapper"
712
+ style={{}}
713
+ testID="message-author"
725
714
  >
726
715
  <View
727
- style={{}}
728
- testID="message-author"
716
+ testID="user-avatar"
729
717
  >
730
718
  <View
731
- testID="user-avatar"
719
+ style={
720
+ [
721
+ {
722
+ "alignItems": "center",
723
+ "borderRadius": 9999,
724
+ "justifyContent": "center",
725
+ "overflow": "hidden",
726
+ },
727
+ {
728
+ "height": 32,
729
+ "width": 32,
730
+ },
731
+ {
732
+ "backgroundColor": "#8febbd",
733
+ },
734
+ {
735
+ "borderColor": "rgba(26, 27, 37, 0.1)",
736
+ "borderWidth": 1,
737
+ },
738
+ undefined,
739
+ ]
740
+ }
741
+ testID="avatar-image"
732
742
  >
733
- <View
743
+ <Image
744
+ accessibilityElementsHidden={true}
745
+ importantForAccessibility="no"
746
+ onError={[Function]}
747
+ source={
748
+ {
749
+ "uri": "https://i.imgur.com/spueyAP.png",
750
+ }
751
+ }
734
752
  style={
735
753
  [
736
- {
737
- "alignItems": "center",
738
- "borderRadius": 9999,
739
- "justifyContent": "center",
740
- "overflow": "hidden",
741
- },
754
+ {},
742
755
  {
743
756
  "height": 32,
744
757
  "width": 32,
745
758
  },
746
- {
747
- "backgroundColor": "#8febbd",
748
- },
749
- {
750
- "borderColor": "rgba(26, 27, 37, 0.1)",
751
- "borderWidth": 1,
752
- },
753
- undefined,
754
759
  ]
755
760
  }
756
- testID="avatar-image"
757
- >
758
- <Image
759
- accessibilityElementsHidden={true}
760
- importantForAccessibility="no"
761
- onError={[Function]}
762
- source={
763
- {
764
- "uri": "https://i.imgur.com/spueyAP.png",
765
- }
766
- }
767
- style={
768
- [
769
- {},
770
- {
771
- "height": 32,
772
- "width": 32,
773
- },
774
- ]
775
- }
776
- />
777
- </View>
761
+ />
778
762
  </View>
779
763
  </View>
764
+ </View>
765
+ <View
766
+ style={
767
+ [
768
+ {
769
+ "gap": 4,
770
+ },
771
+ {
772
+ "alignItems": "flex-start",
773
+ },
774
+ {},
775
+ ]
776
+ }
777
+ testID="message-components"
778
+ >
780
779
  <View
781
780
  style={
782
- [
783
- {
784
- "gap": 4,
785
- },
786
- {
787
- "alignItems": "flex-start",
788
- },
789
- {},
790
- ]
781
+ {
782
+ "zIndex": 1,
783
+ }
791
784
  }
792
- testID="message-components"
793
785
  >
794
786
  <View
795
787
  style={
796
788
  {
797
- "zIndex": 1,
789
+ "alignSelf": "flex-end",
790
+ }
791
+ }
792
+ />
793
+ <View
794
+ style={
795
+ {
796
+ "alignSelf": "flex-start",
798
797
  }
799
798
  }
800
799
  >
801
800
  <View
802
- style={
801
+ accessibilityState={
803
802
  {
804
- "alignSelf": "flex-end",
803
+ "busy": undefined,
804
+ "checked": undefined,
805
+ "disabled": undefined,
806
+ "expanded": undefined,
807
+ "selected": undefined,
805
808
  }
806
809
  }
807
- />
808
- <View
809
- style={
810
+ accessibilityValue={
810
811
  {
811
- "alignSelf": "flex-start",
812
+ "max": undefined,
813
+ "min": undefined,
814
+ "now": undefined,
815
+ "text": undefined,
812
816
  }
813
817
  }
818
+ accessible={true}
819
+ collapsable={false}
820
+ focusable={true}
821
+ onBlur={[Function]}
822
+ onClick={[Function]}
823
+ onFocus={[Function]}
824
+ onResponderGrant={[Function]}
825
+ onResponderMove={[Function]}
826
+ onResponderRelease={[Function]}
827
+ onResponderTerminate={[Function]}
828
+ onResponderTerminationRequest={[Function]}
829
+ onStartShouldSetResponder={[Function]}
830
+ style={{}}
814
831
  >
815
832
  <View
816
- accessibilityState={
817
- {
818
- "busy": undefined,
819
- "checked": undefined,
820
- "disabled": undefined,
821
- "expanded": undefined,
822
- "selected": undefined,
823
- }
824
- }
825
- accessibilityValue={
826
- {
827
- "max": undefined,
828
- "min": undefined,
829
- "now": undefined,
830
- "text": undefined,
831
- }
833
+ style={
834
+ [
835
+ {
836
+ "borderTopLeftRadius": 20,
837
+ "borderTopRightRadius": 20,
838
+ "borderWidth": 0,
839
+ "overflow": "hidden",
840
+ },
841
+ {
842
+ "backgroundColor": "#ebeef1",
843
+ "borderBottomLeftRadius": 0,
844
+ "borderBottomRightRadius": 20,
845
+ },
846
+ {},
847
+ {},
848
+ {},
849
+ ]
832
850
  }
833
- accessible={true}
834
- collapsable={false}
835
- focusable={true}
836
- onBlur={[Function]}
837
- onClick={[Function]}
838
- onFocus={[Function]}
839
- onResponderGrant={[Function]}
840
- onResponderMove={[Function]}
841
- onResponderRelease={[Function]}
842
- onResponderTerminate={[Function]}
843
- onResponderTerminationRequest={[Function]}
844
- onStartShouldSetResponder={[Function]}
845
- style={{}}
851
+ testID="message-content-wrapper"
846
852
  >
847
853
  <View
848
854
  style={
849
855
  [
850
856
  {
851
- "borderTopLeftRadius": 20,
852
- "borderTopRightRadius": 20,
853
- "borderWidth": 0,
854
- "overflow": "hidden",
857
+ "gap": 8,
858
+ "paddingBottom": 0,
859
+ "paddingHorizontal": 8,
860
+ "paddingTop": 0,
855
861
  },
862
+ {},
863
+ ]
864
+ }
865
+ />
866
+ <View
867
+ style={
868
+ [
856
869
  {
857
- "backgroundColor": "#ebeef1",
858
- "borderBottomLeftRadius": 0,
859
- "borderBottomRightRadius": 20,
870
+ "maxWidth": 256,
871
+ "paddingHorizontal": 12,
860
872
  },
861
873
  {},
862
- {},
863
- {},
874
+ undefined,
864
875
  ]
865
876
  }
866
- testID="message-content-wrapper"
877
+ testID="message-text-container"
867
878
  >
868
879
  <View
869
880
  style={
870
881
  [
871
882
  {
872
- "gap": 8,
873
- "paddingBottom": 0,
874
- "paddingHorizontal": 8,
875
- "paddingTop": 0,
876
- },
877
- {},
878
- ]
879
- }
880
- />
881
- <View
882
- style={
883
- [
884
- {
885
- "maxWidth": 256,
886
- "paddingHorizontal": 12,
883
+ "alignSelf": "stretch",
887
884
  },
888
- {},
889
885
  undefined,
890
886
  ]
891
887
  }
892
- testID="message-text-container"
893
888
  >
894
- <View
889
+ <Text
895
890
  style={
896
- [
897
- {
898
- "alignSelf": "stretch",
899
- },
900
- undefined,
901
- ]
891
+ {
892
+ "alignItems": "flex-start",
893
+ "flexDirection": "row",
894
+ "flexWrap": "wrap",
895
+ "fontSize": 17,
896
+ "justifyContent": "flex-start",
897
+ "lineHeight": 20,
898
+ "marginBottom": 8,
899
+ "marginTop": 8,
900
+ }
902
901
  }
903
902
  >
904
903
  <Text
905
904
  style={
906
905
  {
907
- "alignItems": "flex-start",
908
- "flexDirection": "row",
909
- "flexWrap": "wrap",
906
+ "color": "#1a1b25",
910
907
  "fontSize": 17,
911
- "justifyContent": "flex-start",
912
908
  "lineHeight": 20,
913
- "marginBottom": 8,
914
- "marginTop": 8,
909
+ "writingDirection": "ltr",
915
910
  }
916
911
  }
917
912
  >
918
- <Text
919
- style={
920
- {
921
- "color": "#1a1b25",
922
- "fontSize": 17,
923
- "lineHeight": 20,
924
- "writingDirection": "ltr",
925
- }
926
- }
927
- >
928
- Message5
929
- </Text>
913
+ Message5
930
914
  </Text>
931
- </View>
915
+ </Text>
932
916
  </View>
933
917
  </View>
934
918
  </View>
935
919
  </View>
936
920
  </View>
937
- <View
921
+ </View>
922
+ <View
923
+ style={
924
+ [
925
+ {
926
+ "alignItems": "center",
927
+ "flexDirection": "row",
928
+ "gap": 4,
929
+ "justifyContent": "center",
930
+ "maxWidth": "100%",
931
+ "paddingVertical": 4,
932
+ },
933
+ {},
934
+ ]
935
+ }
936
+ testID="message-status-time"
937
+ >
938
+ <Text
938
939
  style={
939
940
  {
940
- "marginTop": -4,
941
- "zIndex": 0,
941
+ "color": "#687385",
942
+ "fontSize": 13,
943
+ "fontWeight": 400,
944
+ "lineHeight": 16,
942
945
  }
943
946
  }
944
- />
945
- <View
947
+ >
948
+ 2:50 PM
949
+ </Text>
950
+ <Text
946
951
  style={
947
952
  [
948
953
  {
949
- "alignItems": "center",
950
- "flexDirection": "row",
951
- "gap": 4,
952
- "justifyContent": "center",
953
- "maxWidth": "100%",
954
- "paddingVertical": 4,
954
+ "color": "#687385",
955
+ "fontSize": 13,
956
+ "fontWeight": 400,
957
+ "lineHeight": 16,
955
958
  },
956
959
  {},
957
960
  ]
958
961
  }
959
- testID="message-status-time"
960
962
  >
961
- <Text
962
- style={
963
- {
964
- "color": "#687385",
965
- "fontSize": 13,
966
- "fontWeight": 400,
967
- "lineHeight": 16,
968
- }
969
- }
970
- >
971
- 2:50 PM
972
- </Text>
973
- <Text
974
- style={
975
- [
976
- {
977
- "color": "#687385",
978
- "fontSize": 13,
979
- "fontWeight": 400,
980
- "lineHeight": 16,
981
- },
982
- {},
983
- ]
984
- }
985
- >
986
- Edited
987
- </Text>
988
- </View>
963
+ Edited
964
+ </Text>
989
965
  </View>
990
966
  </View>
991
967
  </View>
992
968
  </View>
993
969
  </View>
994
- <View />
995
970
  </View>
971
+ <View />
996
972
  </View>
997
973
  </View>
998
974
  </View>
@@ -1018,358 +994,346 @@ exports[`Thread should match thread snapshot 1`] = `
1018
994
  testID="message-list-item-82a83b16-b611-527c-b3ac-765ef6220490"
1019
995
  >
1020
996
  <View
1021
- testID="message-list-item-82a83b16-b611-527c-b3ac-765ef6220490"
997
+ style={
998
+ {
999
+ "paddingVertical": 8,
1000
+ }
1001
+ }
1022
1002
  >
1023
1003
  <View
1024
1004
  style={
1025
1005
  {
1026
- "paddingVertical": 8,
1006
+ "alignSelf": "center",
1007
+ "backgroundColor": "#f6f8fa",
1008
+ "borderRadius": 9999,
1009
+ "paddingHorizontal": 12,
1010
+ "paddingVertical": 4,
1027
1011
  }
1028
1012
  }
1013
+ testID="date-separator"
1029
1014
  >
1030
- <View
1015
+ <Text
1031
1016
  style={
1032
1017
  {
1033
- "alignSelf": "center",
1034
- "backgroundColor": "#f6f8fa",
1035
- "borderRadius": 9999,
1036
- "paddingHorizontal": 12,
1037
- "paddingVertical": 4,
1018
+ "color": "#414552",
1019
+ "fontSize": 13,
1020
+ "fontWeight": 600,
1021
+ "lineHeight": 16,
1038
1022
  }
1039
1023
  }
1040
- testID="date-separator"
1041
1024
  >
1042
- <Text
1043
- style={
1044
- {
1045
- "color": "#414552",
1046
- "fontSize": 13,
1047
- "fontWeight": 600,
1048
- "lineHeight": 16,
1049
- }
1050
- }
1051
- >
1052
- 05/05/2020
1053
- </Text>
1054
- </View>
1025
+ 05/05/2020
1026
+ </Text>
1055
1027
  </View>
1056
- <View
1057
- style={
1028
+ </View>
1029
+ <View
1030
+ style={
1031
+ [
1058
1032
  [
1059
- [
1060
- {},
1061
- ],
1062
- {
1063
- "paddingHorizontal": 16,
1064
- },
1065
- ]
1066
- }
1067
- testID="message-wrapper"
1068
- >
1069
- <View />
1070
- <View>
1033
+ {},
1034
+ ],
1035
+ {
1036
+ "paddingHorizontal": 16,
1037
+ },
1038
+ ]
1039
+ }
1040
+ testID="message-wrapper"
1041
+ >
1042
+ <View />
1043
+ <View>
1044
+ <View
1045
+ collapsable={false}
1046
+ >
1071
1047
  <View
1072
1048
  collapsable={false}
1049
+ hitSlop={
1050
+ {
1051
+ "left": 750,
1052
+ "right": 750,
1053
+ }
1054
+ }
1055
+ style={
1056
+ {
1057
+ "alignItems": "center",
1058
+ "flexDirection": "row",
1059
+ "zIndex": 1,
1060
+ }
1061
+ }
1073
1062
  >
1074
1063
  <View
1075
- collapsable={false}
1076
- hitSlop={
1077
- {
1078
- "left": 750,
1079
- "right": 750,
1080
- }
1081
- }
1064
+ pointerEvents="box-none"
1082
1065
  style={
1083
1066
  {
1084
- "alignItems": "center",
1067
+ "alignItems": "flex-end",
1085
1068
  "flexDirection": "row",
1086
- "zIndex": 1,
1069
+ "gap": 8,
1070
+ "paddingVertical": 8,
1071
+ "width": "100%",
1087
1072
  }
1088
1073
  }
1074
+ testID="message-item-view-wrapper"
1089
1075
  >
1090
1076
  <View
1091
- pointerEvents="box-none"
1092
- style={
1093
- {
1094
- "alignItems": "flex-end",
1095
- "flexDirection": "row",
1096
- "gap": 8,
1097
- "paddingVertical": 8,
1098
- "width": "100%",
1099
- }
1100
- }
1101
- testID="message-item-view-wrapper"
1077
+ style={{}}
1078
+ testID="message-author"
1102
1079
  >
1103
1080
  <View
1104
- style={{}}
1105
- testID="message-author"
1081
+ testID="user-avatar"
1106
1082
  >
1107
1083
  <View
1108
- testID="user-avatar"
1084
+ style={
1085
+ [
1086
+ {
1087
+ "alignItems": "center",
1088
+ "borderRadius": 9999,
1089
+ "justifyContent": "center",
1090
+ "overflow": "hidden",
1091
+ },
1092
+ {
1093
+ "height": 32,
1094
+ "width": 32,
1095
+ },
1096
+ {
1097
+ "backgroundColor": "#fcd579",
1098
+ },
1099
+ {
1100
+ "borderColor": "rgba(26, 27, 37, 0.1)",
1101
+ "borderWidth": 1,
1102
+ },
1103
+ undefined,
1104
+ ]
1105
+ }
1106
+ testID="avatar-image"
1109
1107
  >
1110
- <View
1108
+ <Image
1109
+ accessibilityElementsHidden={true}
1110
+ importantForAccessibility="no"
1111
+ onError={[Function]}
1112
+ source={
1113
+ {
1114
+ "uri": "https://i.imgur.com/LuuGvh0.png",
1115
+ }
1116
+ }
1111
1117
  style={
1112
1118
  [
1113
- {
1114
- "alignItems": "center",
1115
- "borderRadius": 9999,
1116
- "justifyContent": "center",
1117
- "overflow": "hidden",
1118
- },
1119
+ {},
1119
1120
  {
1120
1121
  "height": 32,
1121
1122
  "width": 32,
1122
1123
  },
1123
- {
1124
- "backgroundColor": "#fcd579",
1125
- },
1126
- {
1127
- "borderColor": "rgba(26, 27, 37, 0.1)",
1128
- "borderWidth": 1,
1129
- },
1130
- undefined,
1131
1124
  ]
1132
1125
  }
1133
- testID="avatar-image"
1134
- >
1135
- <Image
1136
- accessibilityElementsHidden={true}
1137
- importantForAccessibility="no"
1138
- onError={[Function]}
1139
- source={
1140
- {
1141
- "uri": "https://i.imgur.com/LuuGvh0.png",
1142
- }
1143
- }
1144
- style={
1145
- [
1146
- {},
1147
- {
1148
- "height": 32,
1149
- "width": 32,
1150
- },
1151
- ]
1152
- }
1153
- />
1154
- </View>
1126
+ />
1155
1127
  </View>
1156
1128
  </View>
1129
+ </View>
1130
+ <View
1131
+ style={
1132
+ [
1133
+ {
1134
+ "gap": 4,
1135
+ },
1136
+ {
1137
+ "alignItems": "flex-start",
1138
+ },
1139
+ {},
1140
+ ]
1141
+ }
1142
+ testID="message-components"
1143
+ >
1157
1144
  <View
1158
1145
  style={
1159
- [
1160
- {
1161
- "gap": 4,
1162
- },
1163
- {
1164
- "alignItems": "flex-start",
1165
- },
1166
- {},
1167
- ]
1146
+ {
1147
+ "zIndex": 1,
1148
+ }
1168
1149
  }
1169
- testID="message-components"
1170
1150
  >
1171
1151
  <View
1172
1152
  style={
1173
1153
  {
1174
- "zIndex": 1,
1154
+ "alignSelf": "flex-end",
1155
+ }
1156
+ }
1157
+ />
1158
+ <View
1159
+ style={
1160
+ {
1161
+ "alignSelf": "flex-start",
1175
1162
  }
1176
1163
  }
1177
1164
  >
1178
1165
  <View
1179
- style={
1166
+ accessibilityState={
1180
1167
  {
1181
- "alignSelf": "flex-end",
1168
+ "busy": undefined,
1169
+ "checked": undefined,
1170
+ "disabled": undefined,
1171
+ "expanded": undefined,
1172
+ "selected": undefined,
1182
1173
  }
1183
1174
  }
1184
- />
1185
- <View
1186
- style={
1175
+ accessibilityValue={
1187
1176
  {
1188
- "alignSelf": "flex-start",
1177
+ "max": undefined,
1178
+ "min": undefined,
1179
+ "now": undefined,
1180
+ "text": undefined,
1189
1181
  }
1190
1182
  }
1183
+ accessible={true}
1184
+ collapsable={false}
1185
+ focusable={true}
1186
+ onBlur={[Function]}
1187
+ onClick={[Function]}
1188
+ onFocus={[Function]}
1189
+ onResponderGrant={[Function]}
1190
+ onResponderMove={[Function]}
1191
+ onResponderRelease={[Function]}
1192
+ onResponderTerminate={[Function]}
1193
+ onResponderTerminationRequest={[Function]}
1194
+ onStartShouldSetResponder={[Function]}
1195
+ style={{}}
1191
1196
  >
1192
1197
  <View
1193
- accessibilityState={
1194
- {
1195
- "busy": undefined,
1196
- "checked": undefined,
1197
- "disabled": undefined,
1198
- "expanded": undefined,
1199
- "selected": undefined,
1200
- }
1201
- }
1202
- accessibilityValue={
1203
- {
1204
- "max": undefined,
1205
- "min": undefined,
1206
- "now": undefined,
1207
- "text": undefined,
1208
- }
1198
+ style={
1199
+ [
1200
+ {
1201
+ "borderTopLeftRadius": 20,
1202
+ "borderTopRightRadius": 20,
1203
+ "borderWidth": 0,
1204
+ "overflow": "hidden",
1205
+ },
1206
+ {
1207
+ "backgroundColor": "#ebeef1",
1208
+ "borderBottomLeftRadius": 0,
1209
+ "borderBottomRightRadius": 20,
1210
+ },
1211
+ {},
1212
+ {},
1213
+ {},
1214
+ ]
1209
1215
  }
1210
- accessible={true}
1211
- collapsable={false}
1212
- focusable={true}
1213
- onBlur={[Function]}
1214
- onClick={[Function]}
1215
- onFocus={[Function]}
1216
- onResponderGrant={[Function]}
1217
- onResponderMove={[Function]}
1218
- onResponderRelease={[Function]}
1219
- onResponderTerminate={[Function]}
1220
- onResponderTerminationRequest={[Function]}
1221
- onStartShouldSetResponder={[Function]}
1222
- style={{}}
1216
+ testID="message-content-wrapper"
1223
1217
  >
1224
1218
  <View
1225
1219
  style={
1226
1220
  [
1227
1221
  {
1228
- "borderTopLeftRadius": 20,
1229
- "borderTopRightRadius": 20,
1230
- "borderWidth": 0,
1231
- "overflow": "hidden",
1222
+ "gap": 8,
1223
+ "paddingBottom": 0,
1224
+ "paddingHorizontal": 8,
1225
+ "paddingTop": 0,
1232
1226
  },
1227
+ {},
1228
+ ]
1229
+ }
1230
+ />
1231
+ <View
1232
+ style={
1233
+ [
1233
1234
  {
1234
- "backgroundColor": "#ebeef1",
1235
- "borderBottomLeftRadius": 0,
1236
- "borderBottomRightRadius": 20,
1235
+ "maxWidth": 256,
1236
+ "paddingHorizontal": 12,
1237
1237
  },
1238
1238
  {},
1239
- {},
1240
- {},
1239
+ undefined,
1241
1240
  ]
1242
1241
  }
1243
- testID="message-content-wrapper"
1242
+ testID="message-text-container"
1244
1243
  >
1245
1244
  <View
1246
1245
  style={
1247
1246
  [
1248
1247
  {
1249
- "gap": 8,
1250
- "paddingBottom": 0,
1251
- "paddingHorizontal": 8,
1252
- "paddingTop": 0,
1253
- },
1254
- {},
1255
- ]
1256
- }
1257
- />
1258
- <View
1259
- style={
1260
- [
1261
- {
1262
- "maxWidth": 256,
1263
- "paddingHorizontal": 12,
1248
+ "alignSelf": "stretch",
1264
1249
  },
1265
- {},
1266
1250
  undefined,
1267
1251
  ]
1268
1252
  }
1269
- testID="message-text-container"
1270
1253
  >
1271
- <View
1254
+ <Text
1272
1255
  style={
1273
- [
1274
- {
1275
- "alignSelf": "stretch",
1276
- },
1277
- undefined,
1278
- ]
1256
+ {
1257
+ "alignItems": "flex-start",
1258
+ "flexDirection": "row",
1259
+ "flexWrap": "wrap",
1260
+ "fontSize": 17,
1261
+ "justifyContent": "flex-start",
1262
+ "lineHeight": 20,
1263
+ "marginBottom": 8,
1264
+ "marginTop": 8,
1265
+ }
1279
1266
  }
1280
1267
  >
1281
1268
  <Text
1282
1269
  style={
1283
1270
  {
1284
- "alignItems": "flex-start",
1285
- "flexDirection": "row",
1286
- "flexWrap": "wrap",
1271
+ "color": "#1a1b25",
1287
1272
  "fontSize": 17,
1288
- "justifyContent": "flex-start",
1289
1273
  "lineHeight": 20,
1290
- "marginBottom": 8,
1291
- "marginTop": 8,
1274
+ "writingDirection": "ltr",
1292
1275
  }
1293
1276
  }
1294
1277
  >
1295
- <Text
1296
- style={
1297
- {
1298
- "color": "#1a1b25",
1299
- "fontSize": 17,
1300
- "lineHeight": 20,
1301
- "writingDirection": "ltr",
1302
- }
1303
- }
1304
- >
1305
- Message4
1306
- </Text>
1278
+ Message4
1307
1279
  </Text>
1308
- </View>
1280
+ </Text>
1309
1281
  </View>
1310
1282
  </View>
1311
1283
  </View>
1312
1284
  </View>
1313
1285
  </View>
1314
- <View
1286
+ </View>
1287
+ <View
1288
+ style={
1289
+ [
1290
+ {
1291
+ "alignItems": "center",
1292
+ "flexDirection": "row",
1293
+ "gap": 4,
1294
+ "justifyContent": "center",
1295
+ "maxWidth": "100%",
1296
+ "paddingVertical": 4,
1297
+ },
1298
+ {},
1299
+ ]
1300
+ }
1301
+ testID="message-status-time"
1302
+ >
1303
+ <Text
1315
1304
  style={
1316
1305
  {
1317
- "marginTop": -4,
1318
- "zIndex": 0,
1306
+ "color": "#687385",
1307
+ "fontSize": 13,
1308
+ "fontWeight": 400,
1309
+ "lineHeight": 16,
1319
1310
  }
1320
1311
  }
1321
- />
1322
- <View
1312
+ >
1313
+ 2:50 PM
1314
+ </Text>
1315
+ <Text
1323
1316
  style={
1324
1317
  [
1325
1318
  {
1326
- "alignItems": "center",
1327
- "flexDirection": "row",
1328
- "gap": 4,
1329
- "justifyContent": "center",
1330
- "maxWidth": "100%",
1331
- "paddingVertical": 4,
1319
+ "color": "#687385",
1320
+ "fontSize": 13,
1321
+ "fontWeight": 400,
1322
+ "lineHeight": 16,
1332
1323
  },
1333
1324
  {},
1334
1325
  ]
1335
1326
  }
1336
- testID="message-status-time"
1337
1327
  >
1338
- <Text
1339
- style={
1340
- {
1341
- "color": "#687385",
1342
- "fontSize": 13,
1343
- "fontWeight": 400,
1344
- "lineHeight": 16,
1345
- }
1346
- }
1347
- >
1348
- 2:50 PM
1349
- </Text>
1350
- <Text
1351
- style={
1352
- [
1353
- {
1354
- "color": "#687385",
1355
- "fontSize": 13,
1356
- "fontWeight": 400,
1357
- "lineHeight": 16,
1358
- },
1359
- {},
1360
- ]
1361
- }
1362
- >
1363
- Edited
1364
- </Text>
1365
- </View>
1328
+ Edited
1329
+ </Text>
1366
1330
  </View>
1367
1331
  </View>
1368
1332
  </View>
1369
1333
  </View>
1370
1334
  </View>
1371
- <View />
1372
1335
  </View>
1336
+ <View />
1373
1337
  </View>
1374
1338
  </View>
1375
1339
  </View>
@@ -1646,14 +1610,6 @@ exports[`Thread should match thread snapshot 1`] = `
1646
1610
  </View>
1647
1611
  </View>
1648
1612
  </View>
1649
- <View
1650
- style={
1651
- {
1652
- "marginTop": -4,
1653
- "zIndex": 0,
1654
- }
1655
- }
1656
- />
1657
1613
  <View
1658
1614
  style={
1659
1615
  [